Generate SSS shares from mnemonic words

App.tsx

@@ -6,7 +6,6 @@
  */
 
 import React from 'react';
-import { Buffer } from 'buffer';
 import { StatusBar } from 'expo-status-bar';
 import { NavigationContainer } from '@react-navigation/native';
 import { GestureHandlerRootView } from 'react-native-gesture-handler';
@@ -16,10 +15,6 @@ import AuthNavigator from './src/navigation/AuthNavigator';
 import { AuthProvider, useAuth } from './src/context/AuthContext';
 import { colors } from './src/theme/colors';
 
-if (typeof globalThis !== 'undefined' && !globalThis.Buffer) {
-  globalThis.Buffer = Buffer;
-}
-
 /**
  * Loading screen shown while restoring auth state
  */

package-lock.json

@@ -14,8 +14,6 @@
         "@react-navigation/bottom-tabs": "^6.6.1",
         "@react-navigation/native": "^6.1.18",
         "@react-navigation/native-stack": "^6.11.0",
-        "bip39": "^3.1.0",
-        "buffer": "^6.0.3",
         "expo": "~52.0.0",
         "expo-asset": "~11.0.5",
         "expo-constants": "~17.0.8",
@@ -3182,18 +3180,6 @@
         "@jridgewell/sourcemap-codec": "^1.4.14"
       }
     },
-    "node_modules/@noble/hashes": {
-      "version": "1.8.0",
-      "resolved": "https://registry.npmjs.org/@noble/hashes/-/hashes-1.8.0.tgz",
-      "integrity": "sha512-jCs9ldd7NwzpgXDIf6P3+NrHh9/sD6CQdxHyjQI+h/6rDNo88ypBxxz45UDuZHz9r3tNz7N/VInSVoVdtXEI4A==",
-      "license": "MIT",
-      "engines": {
-        "node": "^14.21.3 || >=16"
-      },
-      "funding": {
-        "url": "https://paulmillr.com/funding/"
-      }
-    },
     "node_modules/@nodelib/fs.scandir": {
       "version": "2.1.5",
       "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
@@ -4434,15 +4420,6 @@
         "node": ">=0.6"
       }
     },
-    "node_modules/bip39": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/bip39/-/bip39-3.1.0.tgz",
-      "integrity": "sha512-c9kiwdk45Do5GL0vJMe7tS95VjCii65mYAH7DfWl3uW8AVzXKQVUm64i3hzVybBDMp9r7j9iNxR85+ul8MdN/A==",
-      "license": "ISC",
-      "dependencies": {
-        "@noble/hashes": "^1.2.0"
-      }
-    },
     "node_modules/bplist-creator": {
       "version": "0.0.7",
       "resolved": "https://registry.npmjs.org/bplist-creator/-/bplist-creator-0.0.7.tgz",
@@ -4530,9 +4507,9 @@
       }
     },
     "node_modules/buffer": {
-      "version": "6.0.3",
-      "resolved": "https://registry.npmjs.org/buffer/-/buffer-6.0.3.tgz",
-      "integrity": "sha512-FTiCpNxtwiZZHEZbcbTIcZjERVICn9yq/pDFkTl95/AxzD1naBctN7YO68riM/gLSDY7sdrMby8hofADYuuqOA==",
+      "version": "5.7.1",
+      "resolved": "https://registry.npmjs.org/buffer/-/buffer-5.7.1.tgz",
+      "integrity": "sha512-EHcyIPBQ4BSGlvjB16k5KgAJ27CIsHY/2JBmCRReo48y9rQ3MaUzWX3KVlBa4U7MyX02HdVj0K7C3WaB3ju7FQ==",
       "funding": [
         {
           "type": "github",
@@ -4550,7 +4527,7 @@
       "license": "MIT",
       "dependencies": {
         "base64-js": "^1.3.1",
-        "ieee754": "^1.2.1"
+        "ieee754": "^1.1.13"
       }
     },
     "node_modules/buffer-alloc": {
@@ -11058,30 +11035,6 @@
         "node": ">=10"
       }
     },
-    "node_modules/whatwg-url-without-unicode/node_modules/buffer": {
-      "version": "5.7.1",
-      "resolved": "https://registry.npmjs.org/buffer/-/buffer-5.7.1.tgz",
-      "integrity": "sha512-EHcyIPBQ4BSGlvjB16k5KgAJ27CIsHY/2JBmCRReo48y9rQ3MaUzWX3KVlBa4U7MyX02HdVj0K7C3WaB3ju7FQ==",
-      "funding": [
-        {
-          "type": "github",
-          "url": "https://github.com/sponsors/feross"
-        },
-        {
-          "type": "patreon",
-          "url": "https://www.patreon.com/feross"
-        },
-        {
-          "type": "consulting",
-          "url": "https://feross.org/support"
-        }
-      ],
-      "license": "MIT",
-      "dependencies": {
-        "base64-js": "^1.3.1",
-        "ieee754": "^1.1.13"
-      }
-    },
     "node_modules/whatwg-url-without-unicode/node_modules/webidl-conversions": {
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-5.0.0.tgz",

package.json

@@ -15,8 +15,6 @@
     "@react-navigation/bottom-tabs": "^6.6.1",
     "@react-navigation/native": "^6.1.18",
     "@react-navigation/native-stack": "^6.11.0",
-    "bip39": "^3.1.0",
-    "buffer": "^6.0.3",
     "expo": "~52.0.0",
     "expo-asset": "~11.0.5",
     "expo-constants": "~17.0.8",

src/config/index.ts

@@ -112,7 +112,6 @@ export const MOCK_CONFIG = {
   USER: {
     id: 999,
     username: 'MockCaptain',
-    email: 'captain@sentinel.local',
     public_key: 'mock_public_key',
     is_admin: true,
     guale: false,

src/screens/SentinelScreen.tsx

@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from 'react';
+import React, { useState, useEffect, useRef } from 'react';
 import {
   View,
   Text,
@@ -8,18 +8,100 @@ import {
   SafeAreaView,
   Animated,
   Modal,
+  TextInput,
+  KeyboardAvoidingView,
+  Platform,
+  Share,
+  Alert,
+  Linking,
 } from 'react-native';
 import { LinearGradient } from 'expo-linear-gradient';
 import { Ionicons, Feather, MaterialCommunityIcons, FontAwesome5 } from '@expo/vector-icons';
+import { captureRef } from 'react-native-view-shot';
+import AsyncStorage from '@react-native-async-storage/async-storage';
 import { colors, typography, spacing, borderRadius, shadows } from '../theme/colors';
 import { SystemStatus, KillSwitchLog } from '../types';
 import VaultScreen from './VaultScreen';
+import {
+  SSSShare,
+  mnemonicToEntropy,
+  splitSecret,
+  formatShareCompact,
+  serializeShare,
+  verifyShares,
+} from '../utils/sss';
+
+// Nautical-themed mnemonic word list (unique words only)
+const MNEMONIC_WORDS = [
+  'anchor', 'harbor', 'compass', 'lighthouse', 'current', 'ocean', 'tide', 'voyage',
+  'keel', 'stern', 'bow', 'mast', 'sail', 'port', 'starboard', 'reef',
+  'signal', 'beacon', 'chart', 'helm', 'gale', 'calm', 'cove', 'isle',
+  'horizon', 'sextant', 'sound', 'drift', 'wake', 'mariner', 'pilot', 'fathom',
+  'buoy', 'lantern', 'harpoon', 'lagoon', 'bay', 'strait', 'riptide', 'foam',
+  'coral', 'pearl', 'trident', 'ebb', 'flow', 'vault', 'cipher', 'shroud',
+  'salt', 'wave', 'grotto', 'storm', 'north', 'south', 'east', 'west',
+  'ember', 'cabin', 'ledger', 'torch', 'sanctum', 'oath', 'depths', 'captain',
+] as const;
+
+// Animation timing constants
+const ANIMATION_DURATION = {
+  pulse: 1200,
+  glow: 1500,
+  rotate: 30000,
+  heartbeatPress: 150,
+} as const;
+
+const generateMnemonic = (wordCount = 12) => {
+  const words: string[] = [];
+  for (let i = 0; i < wordCount; i += 1) {
+    const index = Math.floor(Math.random() * MNEMONIC_WORDS.length);
+    words.push(MNEMONIC_WORDS[index]);
+  }
+  return words;
+};
+
+/**
+ * Generate SSS shares from mnemonic words
+ * Uses Shamir's Secret Sharing (3,2) threshold scheme
+ */
+const generateSSSShares = (words: string[]): SSSShare[] => {
+  try {
+    // Convert mnemonic to entropy (big integer)
+    const entropy = mnemonicToEntropy(words, MNEMONIC_WORDS);
+    
+    // Split entropy into 3 shares using SSS
+    const shares = splitSecret(entropy);
+    
+    // Verify shares can recover the original (optional, for debugging)
+    if (__DEV__) {
+      const isValid = verifyShares(shares, entropy);
+      if (!isValid) {
+        console.warn('SSS verification failed!');
+      } else {
+        console.log('SSS shares verified successfully');
+      }
+    }
+    
+    return shares;
+  } catch (error) {
+    console.error('Failed to generate SSS shares:', error);
+    // Fallback: return empty shares (should not happen in production)
+    return [
+      { x: 1, y: BigInt(0), label: 'device' },
+      { x: 2, y: BigInt(0), label: 'cloud' },
+      { x: 3, y: BigInt(0), label: 'heir' },
+    ];
+  }
+};
+
+// Icon names type for type safety
+type StatusIconName = 'checkmark-circle' | 'warning' | 'alert-circle';
 
 // Status configuration with nautical theme
 const statusConfig: Record<SystemStatus, { 
   color: string; 
   label: string; 
-  icon: string;
+  icon: StatusIconName;
   description: string;
   gradientColors: [string, string];
 }> = {
@@ -79,52 +161,130 @@ export default function SentinelScreen() {
   const [glowAnim] = useState(new Animated.Value(0.5));
   const [rotateAnim] = useState(new Animated.Value(0));
   const [showVault, setShowVault] = useState(false);
+  const [showMnemonic, setShowMnemonic] = useState(false);
+  const [mnemonicWords, setMnemonicWords] = useState<string[]>([]);
+  const [sssShares, setSssShares] = useState<SSSShare[]>([]);
+  const [showEmailForm, setShowEmailForm] = useState(false);
+  const [emailAddress, setEmailAddress] = useState('');
+  const [isCapturing, setIsCapturing] = useState(false);
+  const mnemonicRef = useRef<View>(null);
 
   useEffect(() => {
     // Pulse animation
-    Animated.loop(
+    const pulseAnimation = Animated.loop(
       Animated.sequence([
         Animated.timing(pulseAnim, {
           toValue: 1.06,
-          duration: 1200,
+          duration: ANIMATION_DURATION.pulse,
           useNativeDriver: true,
         }),
         Animated.timing(pulseAnim, {
           toValue: 1,
-          duration: 1200,
+          duration: ANIMATION_DURATION.pulse,
           useNativeDriver: true,
         }),
       ])
-    ).start();
+    );
+    pulseAnimation.start();
 
     // Glow animation
-    Animated.loop(
+    const glowAnimation = Animated.loop(
       Animated.sequence([
         Animated.timing(glowAnim, {
           toValue: 1,
-          duration: 1500,
+          duration: ANIMATION_DURATION.glow,
           useNativeDriver: true,
         }),
         Animated.timing(glowAnim, {
           toValue: 0.5,
-          duration: 1500,
+          duration: ANIMATION_DURATION.glow,
           useNativeDriver: true,
         }),
       ])
-    ).start();
+    );
+    glowAnimation.start();
 
     // Slow rotate for ship wheel
-    Animated.loop(
+    const rotateAnimation = Animated.loop(
       Animated.timing(rotateAnim, {
         toValue: 1,
-        duration: 30000,
+        duration: ANIMATION_DURATION.rotate,
         useNativeDriver: true,
       })
-    ).start();
-  }, []);
+    );
+    rotateAnimation.start();
 
-  const openVault = () => {
+    // Cleanup animations on unmount to prevent memory leaks
+    return () => {
+      pulseAnimation.stop();
+      glowAnimation.stop();
+      rotateAnimation.stop();
+    };
+  }, [pulseAnim, glowAnim, rotateAnim]);
+
+  const openVaultWithMnemonic = () => {
+    const words = generateMnemonic();
+    const shares = generateSSSShares(words);
+    setMnemonicWords(words);
+    setSssShares(shares);
+    setShowMnemonic(true);
+    setShowVault(false);
+    setShowEmailForm(false);
+    setEmailAddress('');
+    
+    // Store Share A (device share) locally
+    if (shares[0]) {
+      AsyncStorage.setItem('sentinel_share_device', serializeShare(shares[0])).catch(() => {
+        // Best-effort local store; UI remains available
+      });
+    }
+  };
+
+  const handleScreenshot = async () => {
+    try {
+      setIsCapturing(true);
+      const uri = await captureRef(mnemonicRef, {
+        format: 'png',
+        quality: 1,
+        result: 'tmpfile',
+      });
+      await Share.share({
+        url: uri,
+        message: 'Sentinel key backup',
+      });
+      setShowMnemonic(false);
       setShowVault(true);
+    } catch (error) {
+      Alert.alert('Screenshot failed', 'Please try again or use email backup.');
+    } finally {
+      setIsCapturing(false);
+    }
+  };
+
+  const handleEmailBackup = () => {
+    setShowEmailForm(true);
+  };
+
+  const handleSendEmail = async () => {
+    const trimmed = emailAddress.trim();
+    if (!trimmed || !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(trimmed)) {
+      Alert.alert('Invalid email', 'Please enter a valid email address.');
+      return;
+    }
+
+    const subject = encodeURIComponent('Sentinel Vault Recovery Key');
+    const body = encodeURIComponent(`Your 12-word mnemonic:\n${mnemonicWords.join(' ')}`);
+    const mailtoUrl = `mailto:${trimmed}?subject=${subject}&body=${body}`;
+
+    try {
+      await Linking.openURL(mailtoUrl);
+      setShowMnemonic(false);
+      setShowEmailForm(false);
+      setEmailAddress('');
+      setShowVault(true);
+    } catch (error) {
+      Alert.alert('Email failed', 'Unable to open email client.');
+    }
   };
 
   const handleHeartbeat = () => {
@@ -132,23 +292,23 @@ export default function SentinelScreen() {
     Animated.sequence([
       Animated.timing(pulseAnim, {
         toValue: 1.15,
-        duration: 150,
+        duration: ANIMATION_DURATION.heartbeatPress,
         useNativeDriver: true,
       }),
       Animated.timing(pulseAnim, {
         toValue: 1,
-        duration: 150,
+        duration: ANIMATION_DURATION.heartbeatPress,
         useNativeDriver: true,
       }),
     ]).start();
 
-    // Add new log
+    // Add new log using functional update to avoid stale closure
     const newLog: KillSwitchLog = {
       id: Date.now().toString(),
       action: 'HEARTBEAT_CONFIRMED',
       timestamp: new Date(),
     };
-    setLogs([newLog, ...logs]);
+    setLogs((prevLogs) => [newLog, ...prevLogs]);
     
     // Reset status if warning
     if (status === 'warning') {
@@ -226,7 +386,7 @@ export default function SentinelScreen() {
                   colors={currentStatus.gradientColors}
                   style={styles.statusCircle}
                 >
-                  <Ionicons name={currentStatus.icon as any} size={56} color="#fff" />
+                  <Ionicons name={currentStatus.icon} size={56} color="#fff" />
                 </LinearGradient>
               </Animated.View>
               <Text style={[styles.statusLabel, { color: currentStatus.color }]}>
@@ -290,8 +450,10 @@ export default function SentinelScreen() {
               </View>
               <TouchableOpacity
                 style={styles.vaultAccessButton}
-                onPress={openVault}
+                onPress={openVaultWithMnemonic}
                 activeOpacity={0.8}
+                accessibilityLabel="Open Shadow Vault"
+                accessibilityRole="button"
               >
                 <Text style={styles.vaultAccessButtonText}>Open</Text>
               </TouchableOpacity>
@@ -302,6 +464,8 @@ export default function SentinelScreen() {
               style={styles.heartbeatButton}
               onPress={handleHeartbeat}
               activeOpacity={0.9}
+              accessibilityLabel="Signal the watch - Confirm your presence"
+              accessibilityRole="button"
             >
               <LinearGradient
                 colors={[colors.nautical.teal, colors.nautical.seafoam]}
@@ -348,17 +512,128 @@ export default function SentinelScreen() {
         onRequestClose={() => setShowVault(false)}
       >
         <View style={styles.vaultModalContainer}>
-          {showVault ? <VaultScreen /> : null}
+          <VaultScreen />
           <TouchableOpacity
             style={styles.vaultCloseButton}
             onPress={() => setShowVault(false)}
             activeOpacity={0.85}
+            accessibilityLabel="Close vault"
+            accessibilityRole="button"
           >
             <Ionicons name="close" size={20} color={colors.nautical.cream} />
           </TouchableOpacity>
         </View>
       </Modal>
 
+      {/* Mnemonic Modal */}
+      <Modal
+        visible={showMnemonic}
+        animationType="fade"
+        transparent
+        onRequestClose={() => setShowMnemonic(false)}
+      >
+        <KeyboardAvoidingView
+          style={styles.mnemonicOverlay}
+          behavior={Platform.OS === 'ios' ? 'padding' : undefined}
+        >
+          <View ref={mnemonicRef} collapsable={false}>
+            <LinearGradient
+              colors={[colors.sentinel.cardBackground, colors.sentinel.backgroundGradientEnd]}
+              style={styles.mnemonicCard}
+            >
+            <TouchableOpacity
+              style={styles.mnemonicClose}
+              onPress={() => setShowMnemonic(false)}
+              activeOpacity={0.85}
+              accessibilityLabel="Close mnemonic modal"
+              accessibilityRole="button"
+            >
+              <Ionicons name="close" size={18} color={colors.sentinel.textSecondary} />
+            </TouchableOpacity>
+            <View style={styles.mnemonicHeader}>
+              <MaterialCommunityIcons name="key-variant" size={22} color={colors.sentinel.primary} />
+              <Text style={styles.mnemonicTitle}>12-Word Mnemonic</Text>
+            </View>
+            <Text style={styles.mnemonicSubtitle}>
+              Your seed is protected by SSS (3,2) threshold encryption. Any 2 shares can restore your vault.
+            </Text>
+            <View style={styles.mnemonicBlock}>
+              <Text style={styles.mnemonicBlockText}>
+                {mnemonicWords.join(' ')}
+              </Text>
+            </View>
+            <View style={styles.partGrid}>
+              <View style={[styles.partCard, styles.partCardStored]}>
+                <Text style={styles.partLabel}>SHARE A • DEVICE</Text>
+                <Text style={styles.partValue}>
+                  {sssShares[0] ? formatShareCompact(sssShares[0]) : '---'}
+                </Text>
+                <Text style={styles.partHint}>Stored on this device</Text>
+              </View>
+              <View style={styles.partCard}>
+                <Text style={styles.partLabel}>SHARE B • CLOUD</Text>
+                <Text style={styles.partValue}>
+                  {sssShares[1] ? formatShareCompact(sssShares[1]) : '---'}
+                </Text>
+                <Text style={styles.partHint}>To be synced to Sentinel</Text>
+              </View>
+              <View style={styles.partCard}>
+                <Text style={styles.partLabel}>SHARE C • HEIR</Text>
+                <Text style={styles.partValue}>
+                  {sssShares[2] ? formatShareCompact(sssShares[2]) : '---'}
+                </Text>
+                <Text style={styles.partHint}>For your heir (2-of-3 required)</Text>
+              </View>
+            </View>
+            <TouchableOpacity
+              style={[styles.mnemonicPrimaryButton, isCapturing && styles.mnemonicButtonDisabled]}
+              onPress={handleScreenshot}
+              activeOpacity={0.85}
+              disabled={isCapturing}
+              accessibilityLabel="Take screenshot backup of mnemonic"
+              accessibilityRole="button"
+              accessibilityState={{ disabled: isCapturing }}
+            >
+              <Text style={styles.mnemonicPrimaryText}>
+                {isCapturing ? 'CAPTURING...' : 'PHYSICAL BACKUP (SCREENSHOT)'}
+              </Text>
+            </TouchableOpacity>
+            <TouchableOpacity
+              style={styles.mnemonicSecondaryButton}
+              onPress={handleEmailBackup}
+              activeOpacity={0.85}
+              accessibilityLabel="Send mnemonic backup via email"
+              accessibilityRole="button"
+            >
+              <Text style={styles.mnemonicSecondaryText}>EMAIL BACKUP</Text>
+            </TouchableOpacity>
+            {showEmailForm ? (
+              <View style={styles.emailForm}>
+                <TextInput
+                  style={styles.emailInput}
+                  value={emailAddress}
+                  onChangeText={setEmailAddress}
+                  placeholder="you@email.com"
+                  placeholderTextColor={colors.sentinel.textSecondary}
+                  keyboardType="email-address"
+                  autoCapitalize="none"
+                  autoCorrect={false}
+                />
+                <TouchableOpacity
+                  style={styles.emailSendButton}
+                  onPress={handleSendEmail}
+                  activeOpacity={0.85}
+                  accessibilityLabel="Send backup email"
+                  accessibilityRole="button"
+                >
+                  <Text style={styles.emailSendText}>SEND EMAIL</Text>
+                </TouchableOpacity>
+              </View>
+            ) : null}
+            </LinearGradient>
+          </View>
+        </KeyboardAvoidingView>
+      </Modal>
     </View>
   );
 }
@@ -619,4 +894,148 @@ const styles = StyleSheet.create({
     alignItems: 'center',
     justifyContent: 'center',
   },
+  mnemonicOverlay: {
+    flex: 1,
+    backgroundColor: 'rgba(11, 20, 24, 0.72)',
+    justifyContent: 'center',
+    padding: spacing.lg,
+  },
+  mnemonicCard: {
+    borderRadius: borderRadius.xl,
+    padding: spacing.lg,
+    borderWidth: 1,
+    borderColor: colors.sentinel.cardBorder,
+    ...shadows.glow,
+  },
+  mnemonicHeader: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    gap: spacing.sm,
+    marginBottom: spacing.sm,
+  },
+  mnemonicClose: {
+    position: 'absolute',
+    top: spacing.sm,
+    right: spacing.sm,
+    width: 32,
+    height: 32,
+    borderRadius: 16,
+    alignItems: 'center',
+    justifyContent: 'center',
+    backgroundColor: 'rgba(26, 58, 74, 0.35)',
+  },
+  mnemonicTitle: {
+    fontSize: typography.fontSize.lg,
+    fontWeight: '700',
+    color: colors.sentinel.text,
+    letterSpacing: typography.letterSpacing.wide,
+  },
+  mnemonicSubtitle: {
+    fontSize: typography.fontSize.sm,
+    color: colors.sentinel.textSecondary,
+    marginBottom: spacing.md,
+  },
+  mnemonicBlock: {
+    backgroundColor: colors.sentinel.cardBackground,
+    borderRadius: borderRadius.lg,
+    paddingVertical: spacing.md,
+    paddingHorizontal: spacing.md,
+    borderWidth: 1,
+    borderColor: colors.sentinel.cardBorder,
+    marginBottom: spacing.lg,
+  },
+  partGrid: {
+    gap: spacing.sm,
+    marginBottom: spacing.lg,
+  },
+  partCard: {
+    backgroundColor: colors.sentinel.cardBackground,
+    borderRadius: borderRadius.lg,
+    paddingVertical: spacing.sm,
+    paddingHorizontal: spacing.md,
+    borderWidth: 1,
+    borderColor: colors.sentinel.cardBorder,
+  },
+  partCardStored: {
+    borderColor: colors.sentinel.primary,
+  },
+  partLabel: {
+    fontSize: typography.fontSize.xs,
+    color: colors.sentinel.textSecondary,
+    letterSpacing: typography.letterSpacing.wide,
+    marginBottom: 4,
+    fontWeight: '600',
+  },
+  partValue: {
+    fontSize: typography.fontSize.md,
+    color: colors.sentinel.text,
+    fontFamily: typography.fontFamily.mono,
+    fontWeight: '700',
+    marginBottom: 2,
+  },
+  partHint: {
+    fontSize: typography.fontSize.xs,
+    color: colors.sentinel.textSecondary,
+  },
+  mnemonicBlockText: {
+    fontSize: typography.fontSize.sm,
+    color: colors.sentinel.text,
+    fontFamily: typography.fontFamily.mono,
+    fontWeight: '600',
+    lineHeight: 22,
+    textAlign: 'center',
+  },
+  mnemonicPrimaryButton: {
+    backgroundColor: colors.sentinel.primary,
+    paddingVertical: spacing.sm,
+    borderRadius: borderRadius.full,
+    alignItems: 'center',
+    marginBottom: spacing.sm,
+  },
+  mnemonicButtonDisabled: {
+    opacity: 0.6,
+  },
+  mnemonicPrimaryText: {
+    color: colors.nautical.cream,
+    fontWeight: '700',
+    letterSpacing: typography.letterSpacing.wide,
+  },
+  mnemonicSecondaryButton: {
+    backgroundColor: 'transparent',
+    paddingVertical: spacing.sm,
+    borderRadius: borderRadius.full,
+    alignItems: 'center',
+    borderWidth: 1,
+    borderColor: colors.sentinel.cardBorder,
+  },
+  mnemonicSecondaryText: {
+    color: colors.sentinel.text,
+    fontWeight: '700',
+    letterSpacing: typography.letterSpacing.wide,
+  },
+  emailForm: {
+    marginTop: spacing.sm,
+  },
+  emailInput: {
+    height: 44,
+    borderRadius: borderRadius.full,
+    borderWidth: 1,
+    borderColor: colors.sentinel.cardBorder,
+    paddingHorizontal: spacing.md,
+    color: colors.sentinel.text,
+    fontSize: typography.fontSize.sm,
+    backgroundColor: 'rgba(255, 255, 255, 0.02)',
+    marginBottom: spacing.sm,
+  },
+  emailSendButton: {
+    backgroundColor: colors.nautical.teal,
+    paddingVertical: spacing.sm,
+    borderRadius: borderRadius.full,
+    alignItems: 'center',
+  },
+  emailSendText: {
+    color: colors.nautical.cream,
+    fontWeight: '700',
+    letterSpacing: typography.letterSpacing.wide,
+  },
 });

src/types/index.ts

@@ -77,7 +77,6 @@ export interface ProtocolInfo {
 export interface User {
   id: number;
   username: string;
-  email?: string;
   public_key: string;
   is_admin: boolean;
   guale: boolean;

src/utils/index.ts

@@ -0,0 +1,5 @@
+/**
+ * Utility functions for Sentinel
+ */
+
+export * from './sss';

src/utils/sss.ts

@@ -0,0 +1,263 @@
+/**
+ * Shamir's Secret Sharing (SSS) Implementation
+ * 
+ * This implements a (3,2) threshold scheme where:
+ * - Secret is split into 3 shares
+ * - Any 2 shares can recover the original secret
+ * 
+ * Based on the Sentinel crypto_core_demo Python implementation.
+ */
+
+// Use a large prime for the finite field
+// We use 2^127 - 1 (a Mersenne prime) which fits well in BigInt
+// This is smaller than the Python version's 2^521 - 1 but sufficient for our 128-bit entropy
+const PRIME = BigInt('170141183460469231731687303715884105727'); // 2^127 - 1
+
+/**
+ * Represents an SSS share as a coordinate point (x, y)
+ */
+export interface SSSShare {
+  x: number;
+  y: bigint;
+  label: string; // 'device' | 'cloud' | 'heir'
+}
+
+/**
+ * Generate a cryptographically secure random BigInt in range [0, max)
+ */
+function secureRandomBigInt(max: bigint): bigint {
+  // Get the number of bytes needed
+  const byteLength = Math.ceil(max.toString(2).length / 8);
+  const randomBytes = new Uint8Array(byteLength);
+  
+  // Use crypto.getRandomValues for secure randomness
+  if (typeof crypto !== 'undefined' && crypto.getRandomValues) {
+    crypto.getRandomValues(randomBytes);
+  } else {
+    // Fallback for environments without crypto
+    for (let i = 0; i < byteLength; i++) {
+      randomBytes[i] = Math.floor(Math.random() * 256);
+    }
+  }
+  
+  // Convert to BigInt
+  let result = BigInt(0);
+  for (let i = 0; i < randomBytes.length; i++) {
+    result = (result << BigInt(8)) + BigInt(randomBytes[i]);
+  }
+  
+  // Ensure result is within range
+  return result % max;
+}
+
+/**
+ * Convert mnemonic words to entropy (as BigInt)
+ * Each word is mapped to its index, then combined into a single large number
+ */
+export function mnemonicToEntropy(words: string[], wordList: readonly string[]): bigint {
+  let entropy = BigInt(0);
+  const wordListLength = BigInt(wordList.length);
+  
+  for (const word of words) {
+    const index = wordList.indexOf(word);
+    if (index === -1) {
+      throw new Error(`Word "${word}" not found in word list`);
+    }
+    entropy = entropy * wordListLength + BigInt(index);
+  }
+  
+  return entropy;
+}
+
+/**
+ * Convert entropy back to mnemonic words
+ */
+export function entropyToMnemonic(entropy: bigint, wordCount: number, wordList: readonly string[]): string[] {
+  const words: string[] = [];
+  const wordListLength = BigInt(wordList.length);
+  let remaining = entropy;
+  
+  for (let i = 0; i < wordCount; i++) {
+    const index = Number(remaining % wordListLength);
+    words.unshift(wordList[index]);
+    remaining = remaining / wordListLength;
+  }
+  
+  return words;
+}
+
+/**
+ * Modular inverse using extended Euclidean algorithm
+ * Returns x such that (a * x) % p === 1
+ */
+function modInverse(a: bigint, p: bigint): bigint {
+  let [oldR, r] = [a % p, p];
+  let [oldS, s] = [BigInt(1), BigInt(0)];
+  
+  while (r !== BigInt(0)) {
+    const quotient = oldR / r;
+    [oldR, r] = [r, oldR - quotient * r];
+    [oldS, s] = [s, oldS - quotient * s];
+  }
+  
+  // Ensure positive result
+  return ((oldS % p) + p) % p;
+}
+
+/**
+ * Modular arithmetic helper to ensure positive results
+ */
+function mod(n: bigint, p: bigint): bigint {
+  return ((n % p) + p) % p;
+}
+
+/**
+ * Split a secret into 3 shares using SSS (3,2) threshold scheme
+ * 
+ * Uses linear polynomial: f(x) = secret + a*x (mod p)
+ * where 'a' is a random coefficient
+ * 
+ * Any 2 points on this line can recover the y-intercept (secret)
+ */
+export function splitSecret(secret: bigint): SSSShare[] {
+  // Generate random coefficient for the polynomial
+  const a = secureRandomBigInt(PRIME);
+  
+  // Polynomial: f(x) = secret + a*x (mod PRIME)
+  const f = (x: number): bigint => {
+    return mod(secret + a * BigInt(x), PRIME);
+  };
+  
+  // Generate 3 shares at x = 1, 2, 3
+  return [
+    { x: 1, y: f(1), label: 'device' },
+    { x: 2, y: f(2), label: 'cloud' },
+    { x: 3, y: f(3), label: 'heir' },
+  ];
+}
+
+/**
+ * Recover the secret from any 2 shares using Lagrange interpolation
+ * 
+ * For 2 points (x1, y1) and (x2, y2), the secret (y-intercept) is:
+ * S = (x2*y1 - x1*y2) / (x2 - x1) (mod p)
+ */
+export function recoverSecret(shareA: SSSShare, shareB: SSSShare): bigint {
+  const { x: x1, y: y1 } = shareA;
+  const { x: x2, y: y2 } = shareB;
+  
+  // Numerator: x2*y1 - x1*y2
+  const numerator = mod(
+    BigInt(x2) * y1 - BigInt(x1) * y2,
+    PRIME
+  );
+  
+  // Denominator: x2 - x1
+  const denominator = mod(BigInt(x2 - x1), PRIME);
+  
+  // Division in modular arithmetic = multiply by modular inverse
+  const invDenominator = modInverse(denominator, PRIME);
+  
+  return mod(numerator * invDenominator, PRIME);
+}
+
+/**
+ * Format a share for display (truncated for readability)
+ * Shows first 8 and last 4 characters of the y-value
+ */
+export function formatShareForDisplay(share: SSSShare): string {
+  const yStr = share.y.toString();
+  if (yStr.length <= 16) {
+    return `(${share.x}, ${yStr})`;
+  }
+  return `(${share.x}, ${yStr.slice(0, 8)}...${yStr.slice(-4)})`;
+}
+
+/**
+ * Format a share as a compact display string (for UI cards)
+ * Returns a shorter format showing the share index and a hash-like preview
+ */
+export function formatShareCompact(share: SSSShare): string {
+  const yStr = share.y.toString();
+  // Create a "fingerprint" from the y value
+  const fingerprint = yStr.slice(0, 4) + '-' + yStr.slice(4, 8) + '-' + yStr.slice(-4);
+  return fingerprint;
+}
+
+/**
+ * Serialize a share to a string for storage/transmission
+ */
+export function serializeShare(share: SSSShare): string {
+  return JSON.stringify({
+    x: share.x,
+    y: share.y.toString(),
+    label: share.label,
+  });
+}
+
+/**
+ * Deserialize a share from a string
+ */
+export function deserializeShare(str: string): SSSShare {
+  const parsed = JSON.parse(str);
+  return {
+    x: parsed.x,
+    y: BigInt(parsed.y),
+    label: parsed.label,
+  };
+}
+
+/**
+ * Main function to generate mnemonic and SSS shares
+ * This is the entry point for the vault initialization flow
+ */
+export interface VaultKeyData {
+  mnemonic: string[];
+  shares: SSSShare[];
+  entropy: bigint;
+}
+
+export function generateVaultKeys(
+  wordList: readonly string[],
+  wordCount: number = 12
+): VaultKeyData {
+  // Generate random mnemonic
+  const mnemonic: string[] = [];
+  for (let i = 0; i < wordCount; i++) {
+    const index = Math.floor(Math.random() * wordList.length);
+    mnemonic.push(wordList[index]);
+  }
+  
+  // Convert to entropy
+  const entropy = mnemonicToEntropy(mnemonic, wordList);
+  
+  // Split into shares
+  const shares = splitSecret(entropy);
+  
+  return { mnemonic, shares, entropy };
+}
+
+/**
+ * Verify that shares can recover the original entropy
+ * Useful for testing and validation
+ */
+export function verifyShares(
+  shares: SSSShare[],
+  originalEntropy: bigint
+): boolean {
+  // Test all 3 combinations of 2 shares
+  const combinations = [
+    [shares[0], shares[1]], // Device + Cloud
+    [shares[1], shares[2]], // Cloud + Heir
+    [shares[0], shares[2]], // Device + Heir
+  ];
+  
+  for (const [a, b] of combinations) {
+    const recovered = recoverSecret(a, b);
+    if (recovered !== originalEntropy) {
+      return false;
+    }
+  }
+  
+  return true;
+}