fix(mobile): migrate to Expo SDK 54, replace NativeWind with StyleSheet

- Update package.json to Expo ~54.0.35, expo-router ~6.0.24, RN 0.81.5
- Remove NativeWind/Tailwind dependencies
- Fix babel.config.js: presets babel-preset-expo only
- Rewrite all screens with StyleSheet.create (no className)
- Add lucide-react-native + react-native-svg
- Export design tokens C from _layout.tsx for shared usage
- Install node_modules (702 packages)

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>

memento-mobile/app/(tabs)/search.tsx

@@ -1,13 +1,14 @@
 import { useState } from 'react'
 import {
   View, Text, TextInput, FlatList,
-  TouchableOpacity, ActivityIndicator,
+  TouchableOpacity, ActivityIndicator, StyleSheet,
 } from 'react-native'
 import { SafeAreaView } from 'react-native-safe-area-context'
 import { Search as SearchIcon, X } from 'lucide-react-native'
 import { useRouter } from 'expo-router'
 import { apiFetch } from '@/lib/api'
 import { ENDPOINTS } from '@/lib/config'
+import { C } from '../_layout'
 
 interface SearchResult {
   id: string
@@ -40,67 +41,59 @@ export default function SearchScreen() {
   }
 
   return (
-    <SafeAreaView className="flex-1 bg-paper">
-      <View className="px-5 pt-4 pb-2">
-        <Text className="text-2xl font-serif italic text-ink mb-4">Recherche</Text>
-
-        <View className="flex-row items-center bg-white border border-border rounded-xl px-3 py-2.5 gap-2">
-          <SearchIcon size={16} color="#8A8A82" />
+    <SafeAreaView style={s.safe}>
+      <View style={s.top}>
+        <Text style={s.title}>Recherche</Text>
+        <View style={s.inputRow}>
+          <SearchIcon size={16} color={C.concrete} />
           <TextInput
-            value={query}
-            onChangeText={setQuery}
+            value={query} onChangeText={setQuery}
             placeholder="Chercher dans vos notes…"
-            className="flex-1 text-[15px] text-ink"
-            placeholderTextColor="#8A8A82"
-            returnKeyType="search"
-            onSubmitEditing={handleSearch}
+            style={s.input} placeholderTextColor={C.concrete}
+            returnKeyType="search" onSubmitEditing={handleSearch}
           />
           {query.length > 0 && (
             <TouchableOpacity onPress={() => { setQuery(''); setResults([]); setSearched(false) }}>
-              <X size={14} color="#8A8A82" />
+              <X size={14} color={C.concrete} />
             </TouchableOpacity>
           )}
         </View>
       </View>
 
-      {loading ? (
-        <View className="flex-1 items-center justify-center">
-          <ActivityIndicator color="#A47148" />
-        </View>
-      ) : (
-        <FlatList
-          data={results}
-          keyExtractor={(item) => item.id}
-          contentContainerClassName="px-5 pt-3 pb-8"
-          renderItem={({ item }) => (
-            <TouchableOpacity
-              onPress={() => router.push(`/note/${item.id}`)}
-              className="bg-white border border-border rounded-2xl p-4 mb-2.5 active:opacity-70"
-            >
-              <Text className="text-[15px] font-semibold text-ink" numberOfLines={1}>
-                {item.title || 'Sans titre'}
+      {loading
+        ? <View style={s.center}><ActivityIndicator color={C.brand} /></View>
+        : <FlatList
+            data={results}
+            keyExtractor={(item) => item.id}
+            contentContainerStyle={s.list}
+            renderItem={({ item }) => (
+              <TouchableOpacity onPress={() => router.push(`/note/${item.id}`)} style={s.card}>
+                <Text style={s.cardTitle} numberOfLines={1}>{item.title || 'Sans titre'}</Text>
+                {item.snippet && <Text style={s.snippet} numberOfLines={2}>{item.snippet}</Text>}
+                {item.notebookName && <Text style={s.nb}>{item.notebookName}</Text>}
+              </TouchableOpacity>
+            )}
+            ListEmptyComponent={
+              <Text style={s.empty}>
+                {searched ? `Aucun résultat pour "${query}"` : 'Tapez votre recherche puis appuyez sur Entrée'}
               </Text>
-              {item.snippet && (
-                <Text className="text-[12px] text-concrete mt-1" numberOfLines={2}>
-                  {item.snippet}
-                </Text>
-              )}
-              {item.notebookName && (
-                <Text className="text-[11px] text-concrete/60 mt-1">{item.notebookName}</Text>
-              )}
-            </TouchableOpacity>
-          )}
-          ListEmptyComponent={
-            searched ? (
-              <Text className="text-concrete text-center mt-12">Aucun résultat pour "{query}"</Text>
-            ) : (
-              <Text className="text-concrete text-center mt-12 text-[13px]">
-                Tapez votre recherche puis appuyez sur Entrée
-              </Text>
-            )
-          }
-        />
-      )}
+            }
+          />}
     </SafeAreaView>
   )
 }
+
+const s = StyleSheet.create({
+  safe: { flex: 1, backgroundColor: C.paper },
+  top: { paddingHorizontal: 20, paddingTop: 16, paddingBottom: 8 },
+  title: { fontSize: 22, fontStyle: 'italic', fontWeight: '700', color: C.ink, marginBottom: 16 },
+  inputRow: { flexDirection: 'row', alignItems: 'center', backgroundColor: C.white, borderWidth: 1, borderColor: C.border, borderRadius: 12, paddingHorizontal: 12, paddingVertical: 10, gap: 8 },
+  input: { flex: 1, fontSize: 15, color: C.ink },
+  center: { flex: 1, alignItems: 'center', justifyContent: 'center' },
+  list: { paddingHorizontal: 20, paddingTop: 12, paddingBottom: 32 },
+  card: { backgroundColor: C.white, borderWidth: 1, borderColor: C.border, borderRadius: 16, padding: 16, marginBottom: 10 },
+  cardTitle: { fontSize: 15, fontWeight: '600', color: C.ink },
+  snippet: { fontSize: 12, color: C.concrete, marginTop: 4 },
+  nb: { fontSize: 11, color: C.concrete, marginTop: 4, opacity: 0.7 },
+  empty: { textAlign: 'center', color: C.concrete, marginTop: 48, fontSize: 13 },
+})