improve tab structure

src/screens/SentinelScreen.tsx

@@ -7,11 +7,13 @@ import {
   TouchableOpacity,
   SafeAreaView,
   Animated,
+  Modal,
 } from 'react-native';
 import { LinearGradient } from 'expo-linear-gradient';
 import { Ionicons, Feather, MaterialCommunityIcons, FontAwesome5 } from '@expo/vector-icons';
 import { colors, typography, spacing, borderRadius, shadows } from '../theme/colors';
 import { SystemStatus, KillSwitchLog } from '../types';
+import VaultScreen from './VaultScreen';
 
 // Status configuration with nautical theme
 const statusConfig: Record<SystemStatus, { 
@@ -76,6 +78,7 @@ export default function SentinelScreen() {
   const [pulseAnim] = useState(new Animated.Value(1));
   const [glowAnim] = useState(new Animated.Value(0.5));
   const [rotateAnim] = useState(new Animated.Value(0));
+  const [showVault, setShowVault] = useState(false);
 
   useEffect(() => {
     // Pulse animation
@@ -270,6 +273,26 @@ export default function SentinelScreen() {
               </View>
             </View>
 
+            {/* Shadow Vault Access */}
+            <View style={styles.vaultAccessCard}>
+              <View style={styles.vaultAccessIcon}>
+                <MaterialCommunityIcons name="treasure-chest" size={22} color={colors.nautical.teal} />
+              </View>
+              <View style={styles.vaultAccessContent}>
+                <Text style={styles.vaultAccessTitle}>Shadow Vault</Text>
+                <Text style={styles.vaultAccessText}>
+                  Access sealed assets from the Lighthouse.
+                </Text>
+              </View>
+              <TouchableOpacity
+                style={styles.vaultAccessButton}
+                onPress={() => setShowVault(true)}
+                activeOpacity={0.8}
+              >
+                <Text style={styles.vaultAccessButtonText}>Open</Text>
+              </TouchableOpacity>
+            </View>
+
             {/* Heartbeat Button */}
             <TouchableOpacity
               style={styles.heartbeatButton}
@@ -313,6 +336,24 @@ export default function SentinelScreen() {
           </ScrollView>
         </SafeAreaView>
       </LinearGradient>
+
+      {/* Vault Modal */}
+      <Modal
+        visible={showVault}
+        animationType="slide"
+        onRequestClose={() => setShowVault(false)}
+      >
+        <View style={styles.vaultModalContainer}>
+          <VaultScreen />
+          <TouchableOpacity
+            style={styles.vaultCloseButton}
+            onPress={() => setShowVault(false)}
+            activeOpacity={0.85}
+          >
+            <Ionicons name="close" size={20} color={colors.nautical.cream} />
+          </TouchableOpacity>
+        </View>
+      </Modal>
     </View>
   );
 }
@@ -513,4 +554,64 @@ const styles = StyleSheet.create({
     color: colors.sentinel.textSecondary,
     fontFamily: typography.fontFamily.mono,
   },
+  // Shadow Vault Access Card
+  vaultAccessCard: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    backgroundColor: colors.sentinel.cardBackground,
+    borderRadius: borderRadius.xl,
+    padding: spacing.base,
+    marginBottom: spacing.lg,
+    borderWidth: 1,
+    borderColor: colors.sentinel.cardBorder,
+  },
+  vaultAccessIcon: {
+    width: 44,
+    height: 44,
+    borderRadius: 22,
+    backgroundColor: `${colors.nautical.teal}20`,
+    alignItems: 'center',
+    justifyContent: 'center',
+    marginRight: spacing.md,
+  },
+  vaultAccessContent: {
+    flex: 1,
+  },
+  vaultAccessTitle: {
+    fontSize: typography.fontSize.base,
+    fontWeight: '600',
+    color: colors.sentinel.text,
+    marginBottom: 2,
+  },
+  vaultAccessText: {
+    fontSize: typography.fontSize.sm,
+    color: colors.sentinel.textSecondary,
+  },
+  vaultAccessButton: {
+    backgroundColor: colors.nautical.teal,
+    paddingHorizontal: spacing.md,
+    paddingVertical: spacing.sm,
+    borderRadius: borderRadius.full,
+  },
+  vaultAccessButtonText: {
+    color: colors.nautical.cream,
+    fontWeight: '700',
+    fontSize: typography.fontSize.sm,
+  },
+  // Vault Modal
+  vaultModalContainer: {
+    flex: 1,
+    backgroundColor: colors.vault.background,
+  },
+  vaultCloseButton: {
+    position: 'absolute',
+    top: spacing.xl + spacing.lg,
+    right: spacing.lg,
+    width: 36,
+    height: 36,
+    borderRadius: 18,
+    backgroundColor: 'rgba(26, 58, 74, 0.65)',
+    alignItems: 'center',
+    justifyContent: 'center',
+  },
 });