feat(r6): mobile ouvert à tous les rôles — maquette + socle R6.1

R4 avait délibérément fermé le mobile au Technicien. Le référent demande
l'ouverture à tous les rôles avec les mêmes droits qu'au web — nouvelle
release R6 (R4 est close, R4.1/4.2/4.3 déjà pris par le socle mobile
technicien d'origine, pas de réouverture ni de collision de numérotation).

Maquette (docs/02-design/maquettes/maquette-mobile-tous-roles.html, 7
écrans) validée par le référent : D1 barre d'onglets adaptative par rôle
(Technicien/Technicien limité inchangés + onglet Menu ajouté) ; D2 le Menu
reprend à l'identique les 4 groupes du web, même matrice de permissions ;
D3 groupe sans lien visible masqué en entier ; D4 le mobile porte les
actions courantes par famille, pas les flux de gestion les plus denses ;
D5 aucune logique de permission propre au mobile.

R6.1 — socle : usePermissions() mobile calqué sur le web ; barre d'onglets
adaptative (ongletsVisibles par rôle, href:null masque sans retirer du
navigateur) ; Accueil (dashboard réel pour Administrateur/Gestionnaire/
Dispatcher/Vue seule, aucun chiffre inventé) ; OT (liste complète,
viewOther déjà géré serveur, réutilise la fiche OT R4 telle quelle) ; Menu
(groupes filtrés, vide masqué) ; Demandes (PanneauDemandes — un seul
composant pour tous les rôles : création/suivi Demandeur, approbation/
rejet Gestionnaire/Dispatcher/Administrateur, lecture Vue seule).
Familles pas encore portées : écran « à venir » plutôt qu'un lien mort.

Typecheck propre, 17 tests Jest, lint 5/5 paquets.

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

apps/mobile/app/(tabs)/accueil.tsx

@@ -0,0 +1,179 @@
+import { router } from 'expo-router';
+import { Pressable, Text, View } from 'react-native';
+import { SafeAreaView } from 'react-native-safe-area-context';
+import { useRequests, useWorkOrders } from '@/api/exploitation';
+import { useMe } from '@/auth/session';
+import { usePermissions } from '@/auth/use-permissions';
+import { EnteteTabs } from '@/composants/ui';
+import { PanneauDemandes } from '@/composants/panneau-demandes';
+import { useTokens } from '@/theme/tokens';
+
+/** Accueil — maquette « mobile ouvert à tous les rôles », écran 2 : le
+ *  Demandeur y voit directement ses demandes (son seul geste) ; les rôles
+ *  de gestion (Administrateur/Gestionnaire/Dispatcher/Vue seule) y trouvent
+ *  leurs signaux réels (urgence, OT en cours, demandes à traiter) — aucun
+ *  chiffre inventé : seuls WORK_ORDERS/REQUESTS sont déjà câblés sur mobile,
+ *  le reste (stock, préventif du mois…) attend son propre écran (Menu). */
+export default function PageAccueil() {
+  const { data: me } = useMe();
+  if (me?.role.name === 'Demandeur') {
+    return (
+      <SafeAreaView style={{ flex: 1 }} edges={['top']}>
+        <View style={{ flex: 1, padding: 14, gap: 10 }}>
+          <EnteteTabs />
+          <PanneauDemandes />
+        </View>
+      </SafeAreaView>
+    );
+  }
+  return <TableauDeBordGestion />;
+}
+
+function TableauDeBordGestion() {
+  const t = useTokens();
+  const { can } = usePermissions();
+  const peutOT = can('WORK_ORDERS', 'view');
+  const peutDemandes = can('REQUESTS', 'view');
+  const { data: workOrders } = useWorkOrders();
+  const { data: requests } = useRequests();
+
+  const ots = workOrders ?? [];
+  const urgences = ots.filter((o) => o.priority === 'PERSON_TRAPPED' && o.status !== 'DONE' && o.status !== 'CANCELLED');
+  const enCours = ots.filter((o) => o.status === 'OPEN' || o.status === 'IN_PROGRESS').length;
+  const aTraiter = (requests ?? []).filter((r) => r.status === 'RECEIVED').length;
+
+  return (
+    <SafeAreaView style={{ flex: 1, backgroundColor: t.fond }} edges={['top']}>
+      <View style={{ padding: 14, gap: 10, flex: 1 }}>
+        <EnteteTabs />
+        <Text style={{ fontFamily: 'Manrope_800ExtraBold', fontSize: 19, color: t.encre }}>
+          Accueil
+        </Text>
+
+        {urgences.length ? (
+          <Pressable
+            accessibilityRole="button"
+            onPress={() => router.push(`/ot/${urgences[0]!.id}`)}
+            style={{
+              backgroundColor: t.prioBloqueFond,
+              borderRadius: 10,
+              padding: 9,
+              flexDirection: 'row',
+              alignItems: 'center',
+              gap: 8,
+            }}
+          >
+            <View style={{ width: 8, height: 8, borderRadius: 4, backgroundColor: t.prioBloque }} />
+            <Text style={{ color: t.prioBloque, fontFamily: 'Manrope_800ExtraBold', fontSize: 12 }}>
+              {urgences.length === 1
+                ? `1 personne bloquée — ${urgences[0]!.assetReference} · ${urgences[0]!.siteName}`
+                : `${urgences.length} personnes bloquées`}
+            </Text>
+          </Pressable>
+        ) : null}
+
+        {peutOT || peutDemandes ? (
+          <View style={{ flexDirection: 'row', gap: 8 }}>
+            {peutOT ? (
+              <View
+                style={{
+                  flex: 1,
+                  backgroundColor: t.surface,
+                  borderColor: t.bordure,
+                  borderWidth: 1,
+                  borderRadius: 10,
+                  padding: 10,
+                }}
+              >
+                <Text style={{ fontFamily: 'Manrope_800ExtraBold', fontSize: 19, color: t.primaire }}>
+                  {enCours}
+                </Text>
+                <Text style={{ fontFamily: 'Manrope_600SemiBold', fontSize: 10.5, color: t.encre2 }}>
+                  OT en cours
+                </Text>
+              </View>
+            ) : null}
+            {peutDemandes ? (
+              <View
+                style={{
+                  flex: 1,
+                  backgroundColor: t.surface,
+                  borderColor: t.bordure,
+                  borderWidth: 1,
+                  borderRadius: 10,
+                  padding: 10,
+                }}
+              >
+                <Text style={{ fontFamily: 'Manrope_800ExtraBold', fontSize: 19, color: t.encre }}>
+                  {aTraiter}
+                </Text>
+                <Text style={{ fontFamily: 'Manrope_600SemiBold', fontSize: 10.5, color: t.encre2 }}>
+                  Demandes reçues
+                </Text>
+              </View>
+            ) : null}
+          </View>
+        ) : null}
+
+        {peutDemandes && aTraiter > 0 ? (
+          <Pressable
+            accessibilityRole="button"
+            onPress={() => router.push('/demandes')}
+            style={{
+              flexDirection: 'row',
+              alignItems: 'center',
+              gap: 10,
+              backgroundColor: t.surface,
+              borderColor: t.bordure,
+              borderWidth: 1,
+              borderRadius: 10,
+              padding: 11,
+            }}
+          >
+            <View
+              style={{
+                width: 28,
+                height: 28,
+                borderRadius: 8,
+                backgroundColor: t.primaireDoux,
+                alignItems: 'center',
+                justifyContent: 'center',
+              }}
+            >
+              <Text style={{ fontSize: 14, color: t.primaire }}>✎</Text>
+            </View>
+            <View style={{ flex: 1 }}>
+              <Text style={{ fontFamily: 'Manrope_700Bold', fontSize: 12.5, color: t.encre }}>
+                Demandes en attente
+              </Text>
+              <Text style={{ fontFamily: 'Manrope_400Regular', fontSize: 11, color: t.encre2 }}>
+                à approuver ou rejeter
+              </Text>
+            </View>
+            <Text
+              style={{
+                fontFamily: 'Manrope_800ExtraBold',
+                fontSize: 10.5,
+                color: t.stAttente,
+                backgroundColor: t.stAttenteFond,
+                paddingHorizontal: 7,
+                paddingVertical: 2,
+                borderRadius: 999,
+                overflow: 'hidden',
+              }}
+            >
+              {aTraiter}
+            </Text>
+            <Text style={{ color: t.encre3, fontSize: 13 }}>›</Text>
+          </Pressable>
+        ) : null}
+
+        {!peutOT && !peutDemandes ? (
+          <Text style={{ color: t.encre3, fontFamily: 'Manrope_600SemiBold', textAlign: 'center', padding: 24 }}>
+            Rien à afficher ici pour votre rôle — voir le Menu.
+          </Text>
+        ) : null}
+      </View>
+    </SafeAreaView>
+  );
+}