feat: SAPIENS Mobile App - Initial commit

React Native mobile application for SAPIENS news platform.
Consolidated all previous history into single commit.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

sapiense-ai-app/components/OutletCard.tsx

@@ -0,0 +1,112 @@
+import { View, Text, TouchableOpacity, Image, StyleSheet } from 'react-native';
+
+interface OutletCardProps {
+  id: string;
+  name: string;
+  description: string;
+  category: string;
+  focusSubject: string;
+  avatar?: string;
+  articleCount: number;
+  onPress: (id: string) => void;
+}
+
+export default function OutletCard({
+  id,
+  name,
+  description,
+  avatar,
+  articleCount,
+  onPress,
+}: OutletCardProps) {
+  const getInitials = (name: string) => {
+    return name
+      .split(' ')
+      .map(word => word[0])
+      .join('')
+      .toUpperCase()
+      .slice(0, 2);
+  };
+
+  return (
+    <TouchableOpacity
+      style={styles.card}
+      onPress={() => onPress(id)}
+      activeOpacity={0.7}
+    >
+      <View style={styles.content}>
+        {avatar ? (
+          <Image
+            source={{ uri: avatar }}
+            style={styles.avatar}
+            defaultSource={require('../assets/images/partial-react-logo.png')}
+          />
+        ) : (
+          <View style={styles.avatarFallback}>
+            <Text style={styles.avatarText}>{getInitials(name)}</Text>
+          </View>
+        )}
+
+        <View style={styles.textContainer}>
+          <Text style={styles.name} numberOfLines={1}>
+            {name}
+          </Text>
+          <Text style={styles.description} numberOfLines={1}>
+            {description}
+          </Text>
+        </View>
+      </View>
+    </TouchableOpacity>
+  );
+}
+
+const styles = StyleSheet.create({
+  card: {
+    backgroundColor: '#fff',
+    borderRadius: 12,
+    padding: 12,
+    marginBottom: 8,
+    shadowColor: '#000',
+    shadowOffset: { width: 0, height: 1 },
+    shadowOpacity: 0.1,
+    shadowRadius: 2,
+    elevation: 2,
+  },
+  content: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    gap: 12,
+  },
+  avatar: {
+    width: 48,
+    height: 48,
+    borderRadius: 24,
+  },
+  avatarFallback: {
+    width: 48,
+    height: 48,
+    borderRadius: 24,
+    backgroundColor: '#e0e0e0',
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+  avatarText: {
+    fontSize: 14,
+    fontWeight: '600',
+    color: '#333',
+  },
+  textContainer: {
+    flex: 1,
+    minWidth: 0,
+  },
+  name: {
+    fontSize: 16,
+    fontWeight: '600',
+    color: '#000',
+    marginBottom: 4,
+  },
+  description: {
+    fontSize: 14,
+    color: '#666',
+  },
+});