From 012af61fb006d2915286ee0aab1a41ba3e777a60 Mon Sep 17 00:00:00 2001
From: Quentin <quentin@Mac-mini-de-Quentin.local>
Date: Mon, 27 Apr 2026 00:57:03 +0200
Subject: [PATCH] =?UTF-8?q?v2026.5.40=20=E2=80=94=20S=C3=A9lection=20group?=
 =?UTF-8?q?e=20EV=20+=20=C3=A9dition=20domaines=20+=20tri=20=C3=A9quipe=20?=
 =?UTF-8?q?+=20vue=20horizontale=20enrichie?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Onglet Équipe :
- Sélecteur de groupe EasyVista (SI-CSS, SI-EXT, …) en tête de
  section, détecté automatiquement à l'ouverture du panel via le
  <select id="plan_group_id"> de la page Planning EV. Robuste aux
  ajouts/renommages côté EV.
- ID groupe affiché en italique (ex: ID groupe : 191).
- Refresh auto de la liste d'équipe au changement de groupe.
- Plus de bouton 'Détecter' : tout est auto à l'ouverture.
- Tri double : inclus d'abord, puis exclus, alphabétique dans chaque
  sous-groupe.

Onglet EasyVista :
- Édition manuelle des deux domaines (interne DGNSI / externe Internet).
- Bouton Réinitialiser, normalisation auto des URLs.
- Les défauts restent codés en dur en fallback.

Onglet Statuts retiré (placeholder lecture seule).

Vue horizontale enrichie :
- Barre couleur catégorie + référence + ville sur chaque segment.
- Hauteur 22→32px.

Coulisses :
- Nouveau message 'detectGroups' + fonction detectGroupsFromEV() côté
  background.js.
- detectTeamFromEV() accepte un groupId en argument.
- Le fetch du planning continue d'utiliser group_id=191 codé en dur,
  branchement effectif dans une prochaine version.
---
 CHANGELOG.md      |  59 +++
 README.md         |  24 +-
 src/background.js | 147 +++++++-
 src/manifest.json |   2 +-
 src/viewer.css    | 487 +++++++++++++++++++++++--
 src/viewer.js     | 910 +++++++++++++++++++++++++++++++++-------------
 6 files changed, 1341 insertions(+), 288 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index dcacbaa..cf3d7dc 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -9,6 +9,65 @@
 
 ---
 
+## v2026.5.40 — Sélection groupe EV + édition domaines + tri équipe + vue horizontale enrichie
+**Branche** : main
+
+### Onglet Équipe (panel admin)
+- Nouveau **sélecteur de groupe EasyVista** (SI-CSS, SI-EXT, …) en
+  tête de section, détecté automatiquement à l'ouverture du panel
+  via le `<select id="plan_group_id">` de la page Planning EV →
+  source autoritative, robuste aux ajouts/renommages côté EV (un
+  nouveau groupe apparaît tout seul).
+- ID groupe affiché en italique à côté du sélecteur (ex:
+  `ID groupe : 191`).
+- Quand on change de groupe, la **liste d'équipe se rafraîchit
+  automatiquement** avec les membres du nouveau groupe (fetch live).
+- **Plus de bouton "Détecter"** : tout est auto à l'ouverture de
+  l'onglet — détection groupes + détection membres.
+- **Tri double** des techniciens : d'abord les inclus (cases cochées),
+  puis les exclus, et alphabétique dans chaque sous-groupe (insensible
+  casse/accents). Le tri se rafraîchit uniquement aux render() pour
+  éviter que les lignes sautent quand on coche/décoche.
+
+### Onglet EasyVista (panel admin)
+- Refonte complète : **édition manuelle des deux domaines** EV
+  (interne DGNSI = `https://itsma.etat-de-vaud.ch`, externe Internet =
+  `https://itsma.vd.ch`).
+- Bouton **💾 Enregistrer** (normalise : ajoute `https://`, retire le
+  trailing slash) + bouton **↺ Réinitialiser** pour revenir aux
+  valeurs par défaut.
+- Les domaines par défaut restent codés en dur en fallback ; le
+  branchement effectif côté `background.js` (utiliser `cfg.evOrigins`)
+  sera fait dans une prochaine version après validation.
+
+### Onglet Statuts retiré
+- Section "Statuts" supprimée du panel admin (placeholder lecture
+  seule, jamais utile).
+
+### Vue horizontale enrichie
+- Chaque segment timeline d'intervention contient désormais :
+  - Une **barre verticale couleur catégorie** à gauche (mêmes teintes
+    que les `intervention-dot` de la vue classique : livraison/recup/
+    remplacement/incident/rollout/réservation/autre).
+  - La **référence** (ex: `SYYMMDD_NNNNN`) en gras.
+  - La **ville** en gris muted.
+- Hauteur de la timeline horizontale passée de 22px à 32px pour
+  laisser la place au texte.
+- Fond des segments d'intervention : `--bg-elevated` neutre + bordure
+  1px pour que le texte reste lisible (la couleur catégorie n'est
+  plus en fond plein, juste en barre gauche).
+- Vue classique inchangée.
+
+### Coulisses (`background.js`)
+- Nouveau message `detectGroups` + fonction `detectGroupsFromEV()`
+  qui fetche `/index.php?eventName=HelpDesk_PlanningItem` et extrait
+  les paires `(id, nom)` via le `<select>`.
+- `detectTeamFromEV()` accepte désormais un `groupId` en argument →
+  permet de basculer entre SI-CSS / SI-EXT depuis l'admin.
+- ⚠ Le fetch du planning continue d'utiliser `group_id=191` codé en
+  dur — sera retiré quand on validera que `cfg.groupId` est bien
+  alimenté par le sélecteur en terrain réel.
+
 ## v2026.5.39 — Séparation Matin / Après-midi + Apparence (thème, zoom, cache)
 **Branche** : current
 
diff --git a/README.md b/README.md
index 2cde79e..e150ec0 100644
--- a/README.md
+++ b/README.md
@@ -7,7 +7,7 @@ Extension Chrome / Firefox pour visualiser de manière claire et rapide le plann
 - **Auteur** : Quentin Rouiller (QRO)
 - **Cible** : techniciens DGNSI (Canton de Vaud), EasyVista (`itsma.etat-de-vaud.ch` / `itsma.vd.ch`)
 - **Démarrage projet** : jeudi 16 avril 2026
-- **Version actuelle** : `v2026.5.37`
+- **Version actuelle** : `v2026.5.40`
 - **Manifest** : V3 (Chrome/Edge/Firefox)
 - **Format** : `.zip` (Chromium) + `.xpi` signé (Firefox)
 
@@ -83,7 +83,27 @@ Le numéro de **majeure** n'est **pas** un mois et **pas** un chiffre lié au ca
 
 ## Versions notables
 
-### `v2026.5.37` (latest, 25 avril 2026) — Refonte vue horizontale
+### `v2026.5.40` (latest, 27 avril 2026) — Sélection groupe EV + édition domaines + tri équipe + vue horizontale enrichie
+- **Onglet Équipe** : sélecteur de groupe EasyVista (SI-CSS, SI-EXT, …) en tête de section, détecté automatiquement via le `<select id="plan_group_id">` de la page Planning EV. Robuste aux ajouts/renommages côté EV.
+- ID groupe affiché en italique (ex: `ID groupe : 191`).
+- Refresh auto de la liste d'équipe au changement de groupe.
+- Plus de bouton "Détecter" (tout est auto à l'ouverture).
+- Tri double : inclus d'abord, puis exclus, alphabétique dans chaque sous-groupe.
+- **Onglet EasyVista** : édition manuelle des deux domaines (interne / externe), bouton Réinitialiser, normalisation auto des URLs.
+- **Onglet Statuts retiré** (placeholder lecture seule).
+- **Vue horizontale enrichie** : barre verticale couleur catégorie, référence en gras, ville en gris muted, hauteur 22→32px.
+- Coulisses : nouveau message `detectGroups`, fonction `detectGroupsFromEV()` côté `background.js`. `detectTeamFromEV()` accepte un groupId en argument.
+
+### `v2026.5.39` — Séparation Matin / Après-midi + Apparence
+- Pills "MATIN" / "APRÈS-MIDI" entre les interventions
+- Section Apparence (thème, taille du texte, cache, heures de la journée)
+- Section À propos (version, auteur, licence)
+
+### `v2026.5.38` — Attribution auteur + nettoyage + observabilité
+- Module `LOG` unifié + handlers globaux d'erreur
+- Toggle "Logs verbeux (debug)" dans le panel admin
+
+### `v2026.5.37` — Refonte vue horizontale
 - Topbar supprimée en vue horizontale, tout passe en sidebar
 - User-badge + titre + bouton "Aujourd'hui" + date/heure + sélecteur + flèches + stats dans sidebar
 - Banderole pompier masquée (badge + barre rouge gauche conservés)
diff --git a/src/background.js b/src/background.js
index 2259984..e6e2eee 100644
--- a/src/background.js
+++ b/src/background.js
@@ -587,17 +587,26 @@ function watchReconnectTabForIamLogin(tabId) {
  */
 async function fetchCurrentUser(origin, phpsessid) {
   const url = `${origin}/index.php?PHPSESSID=${encodeURIComponent(phpsessid)}`;
-  const resp = await fetch(url, {
+  // v2026.5.40 : on passe par evFetch() qui ajoute les headers Referer +
+  // X-Requested-With attendus par EV. Sans ça, /index.php renvoyait une
+  // page intermédiaire SSO sans le bloc .profile-info → user_null perpétuel.
+  const resp = await evFetch(url, origin, {
     method: "GET",
-    credentials: "include",
     headers: { "Accept": "text/html,*/*" }
   });
   // v4.2 : cette fonction est lancée en tâche de fond au démarrage. Si la
   // session est expirée ou EV inaccessible, on retourne juste null — le
   // planning lui-même déclenchera l'écran d'erreur approprié.
-  if (!resp.ok) return null;
+  if (!resp.ok) {
+    LOG.warn("currentUser", "fetch /index.php non-OK", { status: resp.status });
+    return null;
+  }
   const html = await resp.text();
-  if (looksLikeLoginPage(html)) return null;
+  if (looksLikeLoginPage(html)) {
+    LOG.warn("currentUser", "page de login detectee — session probablement intermediaire SSO");
+    return null;
+  }
+  LOG.info("currentUser", "HTML index.php recu", { taille: html.length, hasProfileInfo: /class=["']profile-info["']/.test(html) });
 
   // v4.2.2 : patterns spécifiques à la structure EasyVista réelle du Canton
   // de Vaud (identifiés à partir du HTML de la page d'accueil). L'user est
@@ -669,7 +678,18 @@ async function fetchCurrentUser(origin, phpsessid) {
     }
   }
 
-  if (!name && !login && !service) return null;
+  if (!name && !login && !service) {
+    // v2026.5.40 : log diagnostic pour comprendre pourquoi l'extraction echoue
+    LOG.warn("currentUser", "aucun nom/service/login extrait du HTML",
+      {
+        taille: html.length,
+        hasH5: /class=["']h5["']/.test(html),
+        hasProfileInfo: /class=["']profile-info["']/.test(html),
+        hasEvDropdown: /class=["'][^"']*ev-employee-dropdown/.test(html),
+        snippet: html.substring(0, 200).replace(/\s+/g, " ")
+      });
+    return null;
+  }
   return { name, login, service };
 }
 
@@ -925,9 +945,80 @@ async function deletePlanningItem(origin, phpsessid, actionId, kind) {
 }
 
 // ============================================================================
-// v5.0.0 : Détection de la liste des techniciens depuis la page planning EV
+// v2026.5.41 : Détection des GROUPES EasyVista (SI-CSS, SI-EXT, …)
 // ============================================================================
 
+/**
+ * Fetch le HTML de la page planning et extrait la liste des groupes depuis
+ * `<select id="plan_group_id">`. C'est la source autoritative : ce sont les
+ * `group_id` exacts qu'EasyVista lui-même utilise pour le widget de
+ * changement de groupe sur la page planning. Robuste aux ajouts/renommages :
+ * si le DGNSI ajoute un 3e groupe ou renomme SI-CSS, ça apparaît tout seul.
+ *
+ * Retourne { groups: [{id, name}, ...] }. Liste vide si le fetch échoue ou
+ * si EV renvoie une page de login / redirection JS.
+ *
+ * @author Quentin Rouiller
+ */
+async function detectGroupsFromEV(origin, phpsessid) {
+  const url = `${origin}/index.php?eventName=HelpDesk_PlanningItem&PHPSESSID=${encodeURIComponent(phpsessid)}`;
+  console.log("[bg] detectGroupsFromEV → fetch page planning");
+  console.log("[bg]   URL =", url);
+
+  const r = await evFetch(url, origin);
+  if (!r.ok) {
+    const err = new Error("HTTP " + r.status);
+    err.kind = classifyHttpStatus(r.status);
+    err.status = r.status;
+    throw err;
+  }
+  const html = await r.text();
+  console.log("[bg]   page planning taille =", html.length);
+
+  if (looksLikeLoginPage(html)) {
+    const err = new Error("session_expired");
+    err.kind = "session_expired";
+    throw err;
+  }
+
+  // Parser le <select id="plan_group_id">…</select> et ses <option>.
+  // On accepte plan_group_id avant ou après le name=, et on tolère les
+  // attributs supplémentaires (onchange, class, etc.).
+  const groups = [];
+  const selectMatch = html.match(/<select[^>]*\bid=["']plan_group_id["'][^>]*>([\s\S]*?)<\/select>/i);
+  if (selectMatch) {
+    const inner = selectMatch[1];
+    const rxOpt = /<option[^>]*\bvalue=["'](\d+)["'][^>]*>([^<]+)<\/option>/gi;
+    let m;
+    while ((m = rxOpt.exec(inner)) !== null) {
+      const id = m[1];
+      const name = (m[2] || "").trim();
+      if (id && name && !groups.some(g => g.id === id)) {
+        groups.push({ id, name });
+      }
+    }
+  }
+  console.log("[bg]   " + groups.length + " groupes détectés :", groups);
+
+  // Fallback : si le <select> est absent (rendu côté client tardif), on
+  // tente de lire les favoris menuGlobals.tech4 où les noms sont en base64.
+  // Ces favoris listent les filtres "SI-CSS"/"SI-EXT" — utile si le HTML
+  // initial ne contient pas encore le <select>.
+  if (groups.length === 0) {
+    const rxFav = /"TITLE"\s*:\s*"([^"]+)"[\s\S]{0,400}?"q2_value_selected"\s*:\s*"([A-Za-z0-9+/=]+)"/g;
+    let mF;
+    while ((mF = rxFav.exec(html)) !== null) {
+      const title = mF[1];
+      // On n'a pas l'ID dans les favoris : on garde au moins le nom pour
+      // affichage info, mais sans ID ce groupe n'est pas sélectionnable
+      // pour fetcher le planning. On ignore donc côté retour.
+      console.log("[bg]   fallback favoris : " + title + " (sans ID, ignoré)");
+    }
+  }
+
+  return { groups };
+}
+
 /**
  * v5.0.1 : Détection de la liste complète des membres du groupe EasyVista.
  *
@@ -942,14 +1033,19 @@ async function deletePlanningItem(origin, phpsessid, actionId, kind) {
  *
  * Retourne { ids: [{id, name, alreadyInTeam}], groupId }.
  */
-async function detectTeamFromEV(origin, phpsessid) {
+async function detectTeamFromEV(origin, phpsessid, groupIdArg, supportIdsArg) {
   // v5.0.1 : valeurs par défaut (correspondent au groupe actuel).
-  // À terme elles devraient venir de la config admin.
+  // v2026.5.41 : on accepte un groupId en argument (ex: switch SI-CSS → SI-EXT).
+  // Quand on change de groupe, on n'a pas la liste support_ids du nouveau
+  // groupe → on passe une chaîne vide, le serveur retourne quand même tous
+  // les membres, juste sans pré-cochage "alreadyInTeam".
   const DEFAULT_GROUP_ID = "191";
   const DEFAULT_SUPPORT_IDS = "76272,83725,66635,92235,90070,40944,72485,86874";
 
-  const groupId = DEFAULT_GROUP_ID;
-  const supportIds = DEFAULT_SUPPORT_IDS;
+  const groupId = groupIdArg || DEFAULT_GROUP_ID;
+  const supportIds = (typeof supportIdsArg === "string")
+    ? supportIdsArg
+    : (groupId === DEFAULT_GROUP_ID ? DEFAULT_SUPPORT_IDS : "");
   console.log("[bg] detectTeamFromEV : group_id =", groupId, "| support_ids =", supportIds);
 
   // Fetch la popup de sélection des intervenants du groupe
@@ -1228,16 +1324,39 @@ chrome.runtime.onMessage.addListener((msg, sender, sendResponse) => {
         return;
       }
 
-      if (msg.type === "detectTeam") {
-        // v5.0.0 : détecte la liste des IDs de techniciens depuis le HTML
-        // v5.0.1 : retourne aussi les noms via la popup group_supports
+      if (msg.type === "detectGroups") {
+        // v2026.5.41 : détecte la liste des groupes EV (SI-CSS, SI-EXT, …)
+        // depuis le <select id="plan_group_id"> de la page planning.
         const session = await findEasyVistaSession();
         if (!session) {
           sendResponse({ ok: false, error: "no_session" });
           return;
         }
         try {
-          const result = await detectTeamFromEV(session.origin, session.phpsessid);
+          const result = await detectGroupsFromEV(session.origin, session.phpsessid);
+          sendResponse({ ok: true, groups: result.groups });
+        } catch (err) {
+          sendResponse({
+            ok: false,
+            error: err.kind || err.message || String(err)
+          });
+        }
+        return;
+      }
+
+      if (msg.type === "detectTeam") {
+        // v5.0.0 : détecte la liste des IDs de techniciens depuis le HTML
+        // v5.0.1 : retourne aussi les noms via la popup group_supports
+        // v2026.5.41 : accepte msg.groupId pour basculer entre SI-CSS / SI-EXT
+        const session = await findEasyVistaSession();
+        if (!session) {
+          sendResponse({ ok: false, error: "no_session" });
+          return;
+        }
+        try {
+          const result = await detectTeamFromEV(
+            session.origin, session.phpsessid, msg.groupId, msg.supportIds
+          );
           // result = { ids: [{id,name,alreadyInTeam}, ...], groupId }
           sendResponse({ ok: true, members: result.ids, groupId: result.groupId });
         } catch (err) {
diff --git a/src/manifest.json b/src/manifest.json
index 44d1c20..0a75dab 100644
--- a/src/manifest.json
+++ b/src/manifest.json
@@ -1,7 +1,7 @@
 {
   "manifest_version": 3,
   "name": "Planification",
-  "version": "2026.5.39",
+  "version": "2026.5.40",
   "description": "Vue claire et rapide du planning des techniciens EasyVista. Développé par Quentin Rouiller — DGNSI, Canton de Vaud.",
   "permissions": [
     "activeTab",
diff --git a/src/viewer.css b/src/viewer.css
index 710efff..5676396 100644
--- a/src/viewer.css
+++ b/src/viewer.css
@@ -1358,6 +1358,29 @@ html.view-horizontal .timeline-noon {
 .tt-ref-val {
   font-family: var(--mono, monospace);
 }
+/* v2026.5.40 r18 : référence cliquable → ouvre la fiche EV. Style "lien"
+   immédiatement reconnaissable : couleur accent, soulignée, cursor pointer. */
+.tt-ref-link {
+  font-family: var(--mono, monospace);
+  color: var(--accent);
+  text-decoration: underline;
+  text-underline-offset: 2px;
+  cursor: pointer;
+  font-weight: 600;
+  transition: color 0.1s, text-shadow 0.1s;
+  pointer-events: auto;
+}
+.tt-ref-link:hover {
+  color: var(--accent);
+  text-shadow: 0 0 6px rgba(59, 130, 246, 0.4);
+}
+.tt-ref-link::after {
+  content: " ↗";
+  font-family: inherit;
+  font-size: 0.85em;
+  opacity: 0.7;
+  margin-left: 2px;
+}
 .tt-copy-btn {
   background: transparent;
   border: 1px solid var(--border);
@@ -2835,7 +2858,10 @@ header.topbar::before {
    ========================================================================== */
 .session-slide-alert {
   position: fixed;
-  top: 60px;
+  /* v2026.5.40 r12 : on positionne l'alerte SOUS les initiales (badge user)
+     pour ne pas chevaucher l'horloge centrale. La topbar fait ~48px donc
+     top: 56px laisse 8px de respiration sous le badge. */
+  top: 56px;
   left: -420px;  /* hors écran au départ */
   width: 380px;
   max-width: calc(100vw - 40px);
@@ -2849,10 +2875,17 @@ header.topbar::before {
   transition: left 0.28s ease-out, opacity 0.28s;
   opacity: 0;
 }
+/* v2026.5.40 r12 : alignée avec le bord gauche de la topbar (à hauteur
+   des initiales — left: 14px = padding gauche de la topbar). */
 .session-slide-alert.visible {
-  left: 20px;
+  left: 14px;
   opacity: 1;
 }
+/* En vue horizontale, l'alerte vient sous le badge user dans la sidebar
+   gauche, donc on laisse left: 14px aussi (la sidebar a son propre padding). */
+html.view-horizontal .session-slide-alert.visible {
+  left: 14px;
+}
 .session-slide-alert.urgent {
   border-left-color: #ef4444;
   animation: session-pulse 1.4s ease-in-out infinite;
@@ -3329,10 +3362,14 @@ html.theme-dark .card.absence-cat-conge {
    réduisait la largeur depuis le côté droit — désormais ils restent à leur
    taille créée et sont simplement repositionnés dans la safe area.
    ========================================================================== */
+/* v2026.5.40 r17 : on retire le `!important` sur width pour permettre à
+   pinTooltip d'imposer la même largeur que le tooltip live au moment du
+   clic (via style.width inline). 520px reste la valeur par défaut si le
+   JS ne définit rien. */
 .pinned-popup:not(.pinned-popup-minimized):not(.pinned-popup-reduced) {
   max-width: none !important;
-  width: 520px !important;   /* largeur standard fixe */
-  min-width: 380px;
+  width: 520px;            /* défaut, peut être override par pinTooltip */
+  min-width: 320px;
 }
 /* Sur les très petits écrans (< 600px), on laisse le clamp naturel */
 @media (max-width: 600px) {
@@ -3513,34 +3550,51 @@ html.view-horizontal .card {
 }
 
 /* Header devient une barre latérale gauche fixe */
-/* v2026.5.35 : réduit à 140px (au lieu de 200px) pour donner plus de place à la timeline */
+/* v2026.5.40 r15 : 180px pour loger "Maladie/Accident" en entier sans
+   tronquer (libellé le plus long parmi tous les badges). */
 html.view-horizontal .card-header {
   flex-direction: column !important;
   align-items: flex-start !important;
   justify-content: center !important;
-  min-width: 140px !important;
-  max-width: 140px !important;
+  min-width: 180px !important;
+  max-width: 180px !important;
   border-bottom: none !important;
   border-right: 1px solid var(--border) !important;
   padding: 6px 10px !important;
   gap: 3px !important;
   flex: 0 0 auto;
 }
+/* v2026.5.40 r8 : nom du tech complet (jusqu'à 3 lignes). Si vraiment
+   trop long, .card-tech-name-tight est appliqué dynamiquement par le JS
+   pour réduire légèrement la font-size (12px → 11.5px). */
 html.view-horizontal .card-tech-name {
-  font-size: 13px !important;
+  font-size: calc(13px * var(--text-scale)) !important;
   font-weight: 600;
   line-height: 1.2 !important;
-  overflow: hidden;
-  text-overflow: ellipsis;
   display: -webkit-box;
-  -webkit-line-clamp: 2;
+  -webkit-line-clamp: 3;
   -webkit-box-orient: vertical;
+  overflow: hidden;
   max-width: 100%;
+  word-break: break-word;
+  hyphens: auto;
 }
+html.view-horizontal .card-tech-name.card-tech-name-tight {
+  font-size: calc(11.5px * var(--text-scale)) !important;
+  letter-spacing: -0.1px;
+}
+/* v2026.5.40 r16 : badge tech compact, sidebar 180px. Le texte est décalé
+   un peu vers la gauche via padding-right > padding-left (effet visuel
+   demandé). */
 html.view-horizontal .card-tech-badge {
-  font-size: 10px !important;
-  padding: 2px 6px !important;
+  font-size: calc(8.5px * var(--text-scale)) !important;
+  padding: 2px 14px 2px 4px !important;
+  line-height: 1.3 !important;
   white-space: nowrap;
+  text-align: center;
+  align-self: flex-start;
+  max-width: 100%;
+  letter-spacing: 0.02em;
 }
 
 /* Le body prend le reste de la ligne, scroll horizontal si trop d'interv */
@@ -3559,7 +3613,18 @@ html.view-horizontal .timeline {
   border-bottom: none !important;
 }
 html.view-horizontal .timeline-bar {
-  height: 22px !important;
+  height: 10px !important;     /* v2026.5.40 r4 : timeline très fine */
+}
+/* Timeline elle-même : padding réduit pour gagner de la hauteur */
+html.view-horizontal .timeline {
+  padding: 4px 14px 2px 14px !important;
+}
+/* Échelle d'heures plus compacte */
+html.view-horizontal .timeline-scale {
+  height: 11px !important;
+}
+html.view-horizontal .timeline-tick {
+  font-size: calc(10px * var(--text-scale)) !important;
 }
 
 /* Liste interventions en mode "chips" (défilement horizontal) */
@@ -3584,17 +3649,22 @@ html.view-horizontal .card-header::after {
 }
 html.view-horizontal .tech-row-stats {
   display: flex;
-  gap: 8px;
-  font-size: 11px;
+  flex-wrap: wrap;             /* libellés complets → permet wrap */
+  gap: 4px;
+  font-size: calc(11px * var(--text-scale));
   color: var(--text-muted);
-  margin-top: 2px;
+  margin-top: 4px;
+  width: 100%;
+  justify-content: flex-start;
 }
 html.view-horizontal .tech-row-stats .stat-pill {
-  padding: 1px 6px;
+  padding: 2px 8px;
   background: var(--bg-muted);
   border: 1px solid var(--border);
-  border-radius: 3px;
+  border-radius: 10px;
   font-variant-numeric: tabular-nums;
+  font-size: calc(10.5px * var(--text-scale));
+  white-space: nowrap;
 }
 
 /* En vue classique, on cache les éléments spécifiques horizontal */
@@ -3767,9 +3837,26 @@ html.view-horizontal .horizontal-sidebar #stats .global-stat b {
 html.view-horizontal .horizontal-sidebar #stats .global-stat-main b {
   font-size: 15px !important;
 }
+/* v2026.5.40 r19 : en sidebar horizontale, on cache tous les séparateurs
+   sauf le `+` (classe .global-stat-sep-keep) qui s'affiche en bloc CENTRÉ
+   entre "tech. dispo" et "pompier". */
 html.view-horizontal .horizontal-sidebar #stats .global-stat-sep {
   display: none !important;
 }
+html.view-horizontal .horizontal-sidebar #stats .global-stat-sep.global-stat-sep-keep {
+  display: block !important;
+  width: 100% !important;
+  text-align: center !important;
+  color: var(--text-faint);
+  font-size: 14px;
+  font-weight: 700;
+  padding: 0;
+  /* Compenser le gap parent (#stats a gap: 4px) pour que le `+` soit serré
+     entre "tech. dispo" et "pompier" — pas d'espace artificiel autour. */
+  margin: -3px auto -3px auto;
+  line-height: 1;
+  align-self: center;
+}
 html.view-horizontal .horizontal-sidebar #stats .global-stat-sub {
   display: block !important;
   font-size: 10px;
@@ -3827,8 +3914,8 @@ html.view-horizontal main .stats {
     font-size: 11px;
   }
   html.view-horizontal .card-header {
-    min-width: 110px !important;
-    max-width: 110px !important;
+    min-width: 160px !important;     /* v2026.5.40 r15 : un peu plus serré sur petit écran */
+    max-width: 160px !important;
   }
 }
 
@@ -4079,10 +4166,18 @@ html.view-horizontal #progress-bar {
   }
 }
 
-/* 14. Banderole "En pompier du..." : masquée en vue horizontale uniquement
-       (la barre rouge à gauche et le badge POMPIER restent visibles). */
+/* v2026.5.40 r17 : banderole "En pompier du..." en vue HORIZONTALE
+   uniquement — pleine largeur, hauteur modérée (2 fois plus que r14d),
+   texte centré. */
 html.view-horizontal .card-status-note.pompier {
-  display: none !important;
+  padding: 4px 14px !important;
+  text-align: center !important;
+  line-height: 1.3 !important;
+  font-size: calc(11.5px * var(--text-scale)) !important;
+  margin: 0 !important;
+  border-radius: 0 !important;
+  width: auto !important;
+  display: block !important;
 }
 
 /* ==========================================================================
@@ -4375,3 +4470,347 @@ html.view-horizontal .day-period-sep {
   line-height: 1.55;
   color: var(--text);
 }
+
+/* ==========================================================================
+   v2026.5.40 : segments timeline enrichis (vue horizontale uniquement)
+   - Barre verticale couleur catégorie à gauche (comme les cards classique)
+   - Référence + ville lisibles dans le segment (si assez large)
+   - Cachés en vue classique (pas la place dans une timeline 20px de haut)
+   ========================================================================== */
+
+/* (retiré v2026.5.40 r3 : le contenu enrichi est maintenant dans
+   .iv-mini-cards en-dessous de la timeline) */
+.timeline-slot-content { display: none; }
+
+/* v2026.5.40 r3 : la timeline reste comme la vue classique (segments colorés
+   compacts). Les infos détaillées sont dans .iv-mini-cards juste en-dessous. */
+
+/* ==========================================================================
+   v2026.5.40 r3 : mini-cartes d'intervention sous la timeline (vue horizontale
+   uniquement). Chaque carte contient ref / heure / ville / adresse, alignée
+   sur l'ordre temporel des interventions. Largeur proportionnelle à la durée
+   (flex-grow), avec min-width pour rester lisible. Trous représentés par des
+   espaces vides qui préservent l'alignement avec la timeline du dessus.
+   ========================================================================== */
+
+/* Par défaut (vue classique) : caché */
+.iv-mini-cards { display: none; }
+
+/* En vue horizontale : flex row qui prend toute la largeur — toutes les
+   mini-cartes équidistantes. Si vraiment trop d'interv pour la largeur
+   (rare), elles se compriment via flex-shrink. */
+html.view-horizontal .iv-mini-cards {
+  display: flex;
+  flex-direction: row;
+  align-items: stretch;
+  width: 100%;
+  gap: 3px;
+  padding: 2px 14px 4px 14px;
+  background: transparent;
+  overflow: hidden;
+}
+
+/* Carte mini d'intervention : v2026.5.40 r5 — toutes les cartes ont la
+   MÊME largeur (flex: 1 1 0) pour qu'on puisse les voir toutes d'un coup
+   sans scroll. La position temporelle est donnée par la timeline au-dessus. */
+.iv-mini-card {
+  flex: 1 1 0;
+  display: flex;
+  flex-direction: row;
+  align-items: stretch;
+  min-width: 0;                    /* permet au flex de bien rétrécir */
+  background: var(--bg-elevated);
+  border: 1px solid var(--border);
+  border-radius: 4px;
+  overflow: hidden;
+  cursor: pointer;
+  transition: background 0.1s, border-color 0.1s, box-shadow 0.1s;
+}
+.iv-mini-card:hover {
+  background: var(--bg-hover);
+  border-color: var(--border-strong);
+  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
+}
+.iv-mini-card.highlight {
+  outline: 2px solid var(--accent);
+  outline-offset: -1px;
+  z-index: 2;
+}
+
+/* Barre verticale couleur catégorie à gauche de chaque carte (4 px) */
+.iv-mini-card-bar {
+  flex: 0 0 4px;
+  background: var(--c-autre);
+}
+.iv-mini-card.color-livraison    .iv-mini-card-bar { background: var(--c-livraison); }
+.iv-mini-card.color-installation .iv-mini-card-bar { background: var(--c-installation); }
+.iv-mini-card.color-recup        .iv-mini-card-bar { background: var(--c-recup); }
+.iv-mini-card.color-remplacement .iv-mini-card-bar { background: var(--c-remplacement); }
+.iv-mini-card.color-incident     .iv-mini-card-bar { background: var(--c-incident); }
+.iv-mini-card.color-rollout      .iv-mini-card-bar { background: var(--c-rollout); }
+.iv-mini-card.color-reservation  .iv-mini-card-bar { background: var(--c-reservation); }
+.iv-mini-card.color-autre        .iv-mini-card-bar { background: var(--c-autre); }
+
+/* v2026.5.40 r7 : bloc heure VERTICAL (09:00 / ↓ / 10:00) */
+.iv-mini-time-vertical {
+  flex: 0 0 auto;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 0;
+  padding: 4px 6px;
+  border-right: 1px solid var(--border);
+  font-variant-numeric: tabular-nums;
+  min-width: 44px;
+}
+.iv-mini-time-start,
+.iv-mini-time-end {
+  font-size: calc(11px * var(--text-scale));
+  font-weight: 600;
+  color: var(--text);
+  line-height: 1.1;
+}
+.iv-mini-time-arrow {
+  font-size: calc(9px * var(--text-scale));
+  color: var(--text-faint);
+  line-height: 1;
+  margin: 1px 0;
+}
+
+/* Bloc texte (3 lignes) à droite — v2026.5.40 r7 : centré horizontalement */
+.iv-mini-card-text {
+  flex: 1 1 auto;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;            /* centre les lignes horizontalement */
+  gap: 1px;
+  padding: 4px 8px;
+  min-width: 0;
+  text-align: center;
+}
+.iv-mini-line {
+  width: 100%;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  line-height: 1.2;
+  text-align: center;
+}
+.iv-mini-ref {
+  font-weight: 700;
+  font-size: calc(11px * var(--text-scale));
+  color: var(--text);
+  letter-spacing: 0.2px;
+}
+.iv-mini-ville {
+  font-size: calc(10.5px * var(--text-scale));
+  font-weight: 600;
+  color: var(--text);
+}
+.iv-mini-adresse {
+  font-size: calc(10px * var(--text-scale));
+  font-style: italic;
+  color: var(--text-faint);
+}
+
+/* ==========================================================================
+   v2026.5.40 r4 : compactage vertical des lignes tech en vue horizontale
+   - Card globale : pas de padding inutile en haut/bas
+   - Body : padding nul, gap minimal
+   - Card-stats (X interv. matin/apm) cachées (info redondante avec mini-cards)
+   ========================================================================== */
+html.view-horizontal .card {
+  margin-bottom: 6px !important;
+  border-radius: 6px;
+}
+html.view-horizontal .card-body {
+  padding: 0 !important;
+  gap: 0 !important;
+}
+/* v2026.5.40 r6 : la card-stats du bas est CACHÉE en horizontal — l'info est
+   désormais dans les pills (.tech-row-stats) du header tech, libellés complets. */
+html.view-horizontal .card-body > .card-stats {
+  display: none !important;
+}
+/* Header tech plus compact (centrage vertical, hauteur auto) */
+html.view-horizontal .card-header {
+  padding: 4px 10px !important;
+}
+
+/* v2026.5.40 r7 : chiffre du nombre d'interventions mis en évidence dans
+   la pill du header tech (ex: "4 interventions" → le 4 plus gros). */
+html.view-horizontal .tech-row-stats .stat-pill .stat-pill-big-num {
+  font-size: calc(15px * var(--text-scale));
+  font-weight: 800;
+  color: var(--text);
+  margin-right: 2px;
+  letter-spacing: 0;
+}
+html.view-horizontal .tech-row-stats .stat-pill {
+  display: inline-flex;
+  align-items: baseline;
+  gap: 0;
+}
+
+/* v2026.5.40 r8 : en vue horizontale, le dock des popups épinglés réduits
+   commence APRÈS la sidebar (200px). Sinon les pills étaient cachées sous
+   la sidebar fixe à gauche. */
+html.view-horizontal .pinned-popups-dock {
+  left: 200px !important;
+}
+@media (max-width: 1400px) {
+  html.view-horizontal .pinned-popups-dock {
+    left: 170px !important;
+  }
+}
+
+/* v2026.5.40 r9 : 2 blocs MATIN / APRÈS-MIDI côte à côte. Chaque bloc a
+   son label en haut + ses mini-cards en dessous. Séparation visuelle
+   entre les 2 blocs via un gap plus large + bordure gauche sur l'après-midi. */
+.iv-mini-block {
+  flex: 1 1 0;
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+  gap: 2px;
+}
+.iv-mini-block.period-afternoon {
+  border-left: 2px solid var(--border-strong);
+  padding-left: 8px;
+  margin-left: 8px;
+}
+.iv-mini-block-label {
+  font-size: calc(10px * var(--text-scale));
+  font-weight: 700;
+  letter-spacing: 1px;
+  text-transform: uppercase;
+  color: var(--text-muted);
+  text-align: center;
+  padding: 1px 0;
+}
+.iv-mini-block-cards {
+  display: flex;
+  flex-direction: row;
+  gap: 3px;
+  flex: 1 1 auto;
+  min-width: 0;
+}
+.iv-mini-block-cards .iv-mini-card {
+  flex: 1 1 0;
+}
+
+/* v2026.5.40 r18 : ordre fixe des boutons en vue classique topbar-right.
+   Absence → Douchette → Actualiser → Tout recharger → Vider cache → Thème */
+html.view-classic .topbar-right #absence-btn         { order: 1; }
+html.view-classic .topbar-right #douchette-btn       { order: 2; }
+html.view-classic .topbar-right #refresh-partial-btn { order: 3; }
+html.view-classic .topbar-right #refresh-btn         { order: 4; }
+html.view-classic .topbar-right #abort-btn           { order: 4; }
+html.view-classic .topbar-right #clear-cache-btn     { order: 5; }
+html.view-classic .topbar-right #theme-toggle        { order: 6; }
+
+/* ==========================================================================
+   v2026.5.40 r18 : refonte visuelle onglet Équipe — plus moderne, cohérent
+   avec le reste du panel admin (Apparence, À propos).
+   ========================================================================== */
+.admin-team-table {
+  background: var(--bg-elevated);
+  border: 1px solid var(--border);
+  border-radius: 8px;
+  overflow: hidden;
+  margin-top: 14px;
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
+}
+.admin-team-table th {
+  background: var(--bg-muted) !important;
+  border-bottom: 1px solid var(--border-strong) !important;
+  font-size: 11.5px !important;
+  letter-spacing: 0.6px !important;
+  padding: 10px 14px !important;
+}
+.admin-team-table td {
+  padding: 10px 14px !important;
+  border-bottom: 1px solid var(--border) !important;
+}
+.admin-team-table tr:last-child td {
+  border-bottom: none !important;
+}
+.admin-team-table tr:hover td {
+  background: var(--bg-hover);
+}
+.admin-team-table .admin-input {
+  background: var(--bg);
+  transition: border-color 0.12s, box-shadow 0.12s;
+}
+.admin-team-table .admin-input:focus {
+  outline: none;
+  border-color: var(--accent);
+  box-shadow: 0 0 0 3px var(--accent-soft);
+}
+.admin-team-table .admin-input-id {
+  font-weight: 600;
+  color: var(--text-muted);
+}
+/* Checkbox + label "Exclure" / jours d'absence : style pill */
+.admin-team-table label {
+  display: inline-flex;
+  align-items: center;
+  gap: 5px;
+  padding: 3px 8px;
+  background: var(--bg-muted);
+  border: 1px solid var(--border);
+  border-radius: 12px;
+  font-size: 12px;
+  cursor: pointer;
+  margin-right: 4px;
+  transition: background 0.12s, border-color 0.12s;
+  user-select: none;
+}
+.admin-team-table label:hover {
+  background: var(--bg-hover);
+  border-color: var(--border-strong);
+}
+.admin-team-table label input[type="checkbox"] {
+  margin: 0;
+  cursor: pointer;
+}
+.admin-team-table label:has(input:checked) {
+  background: var(--accent-soft);
+  border-color: var(--accent);
+  color: var(--accent);
+  font-weight: 600;
+}
+
+/* v2026.5.40 r20 : onglet Équipe — colonne "Inclure" plus étroite, ID +
+   nom en lecture seule (texte clair, pas d'input). */
+.admin-team-table th:first-child,
+.admin-team-table td:first-child {
+  width: 60px !important;
+  text-align: center !important;
+  padding-left: 8px !important;
+  padding-right: 8px !important;
+}
+.admin-team-table th:first-child {
+  font-size: 10px !important;
+  letter-spacing: 0.4px !important;
+}
+.admin-team-id-readonly {
+  font-family: var(--mono);
+  font-weight: 600;
+  color: var(--text-muted);
+  font-size: 12.5px;
+}
+.admin-team-name-readonly {
+  font-weight: 600;
+  color: var(--text);
+  font-size: 13px;
+}
+
+/* v2026.5.40 r21b : seul le `/` prend la couleur faint d'absent.
+   Le `+` reste en couleur neutre (héritée du parent stats). */
+.global-stat-sep.sep-absent {
+  color: var(--text-faint) !important;
+  font-weight: 700;
+}
diff --git a/src/viewer.js b/src/viewer.js
index a0fc8f4..a4a5dd4 100644
--- a/src/viewer.js
+++ b/src/viewer.js
@@ -145,6 +145,15 @@ window.addEventListener("unhandledrejection", (event) => {
 
 LOG.info("boot", "viewer.js chargé", { version: LOG.version() });
 
+// v2026.5.40 r22 : pattern simple et fiable pour fermer le tooltip
+//   - mouseleave row    → timer 500ms (démarré dans hideTooltip)
+//   - mouseenter popup  → clearTimeout (annule la fermeture en cours)
+//   - mouseleave popup  → hideTooltip  (démarre un nouveau timer 500ms)
+//   - mouseenter row    → showTooltip  (annule la fermeture aussi)
+// Pas de flags hoveredInBulle/hoveredInRow, pas de watchdog mousemove,
+// pas de elementFromPoint : juste des events natifs qui sont fiables.
+// Source : pattern recommandé dans Tippy.js, jQuery PowerTip, MDN Popover API.
+
 // ============================================================================
 // Configuration
 // ============================================================================
@@ -1792,7 +1801,10 @@ function _showSessionSlideAlert({ urgent }) {
   // Déclenche l'animation de slide-in (petite tempo pour que la transition parte)
   requestAnimationFrame(() => el.classList.add("visible"));
 
-  // Action "Prolonger"
+  // Action "Prolonger" — v2026.5.40 r12 :
+  //  - succès → fermer l'alerte + toast bas-droite "Session prolongée"
+  //  - échec  → fermer l'alerte + toast erreur + ouvrir la bannière /
+  //             écran de reconnexion EasyVista
   el.querySelector(".session-slide-alert-extend").addEventListener("click", async () => {
     const extendBtn = el.querySelector(".session-slide-alert-extend");
     extendBtn.disabled = true;
@@ -1803,7 +1815,6 @@ function _showSessionSlideAlert({ urgent }) {
         state.sessionExpireAt = Date.now() + resp.remainingMs;
         state.sessionPingDone = false;
         state._criticalModalShown = false;
-        // Reset des flags d'alerte pour le prochain cycle
         state._slideAlert5minShown = false;
         state._slideAlert2minShown = false;
         showToast("Session prolongée", "30 minutes de plus");
@@ -1813,8 +1824,15 @@ function _showSessionSlideAlert({ urgent }) {
         throw new Error((resp && resp.error) || "erreur inconnue");
       }
     } catch (err) {
-      extendBtn.disabled = false;
-      extendBtn.textContent = "🔄 Prolonger";
+      // Échec : on ferme cette mini-alerte, on affiche un toast d'erreur,
+      // puis on bascule sur la bannière "session expirée" (laquelle propose
+      // un bouton pour ouvrir EasyVista et se reconnecter).
+      _hideSessionSlideAlert();
+      showToast("Échec prolongation", "Reconnectez-vous à EasyVista");
+      LOG.warn("session", "extendSession a échoué", { err: err && err.message });
+      if (typeof handleSessionExpired === "function") {
+        handleSessionExpired();
+      }
     }
   });
 
@@ -2043,7 +2061,6 @@ async function showAdminPanel() {
     { id: "appearance", label: "Apparence",      render: renderAdminSectionAppearance },
     { id: "team",       label: "Équipe",         render: renderAdminSectionTeam },
     { id: "easyvista",  label: "EasyVista",      render: renderAdminSectionEV },
-    { id: "statuses",   label: "Statuts",        render: renderAdminSectionStatuses },
     { id: "diagnostics",label: "Diagnostics",    render: renderAdminSectionDiagnostics },
     { id: "about",      label: "À propos",       render: renderAdminSectionAbout }
   ];
@@ -2115,6 +2132,111 @@ function renderAdminSectionTeam(container, cfg, saveFn) {
   desc.textContent = "Sélectionnez les personnes qui doivent apparaître dans la planification. Les IDs viennent d'EasyVista (bouton Détecter) ou peuvent être saisis manuellement.";
   container.appendChild(desc);
 
+  // ---- v2026.5.41 : Sélecteur de groupe EasyVista (SI-CSS / SI-EXT / …) ----
+  // Placé en tête de la section Équipe : c'est le groupe qui détermine quels
+  // techniciens sont listés. Détection live depuis le <select id="plan_group_id">
+  // de la page Planning EV — robuste aux ajouts/renommages.
+  const groupRow = _makeAdminRow(
+    "Groupe EasyVista",
+    "Par défaut SI-CSS. La liste est récupérée automatiquement depuis EasyVista."
+  );
+  const groupSelect = document.createElement("select");
+  groupSelect.className = "admin-select";
+  groupSelect.style.minWidth = "240px";
+
+  function paintGroupOptions(groups, selectedId, selectedName) {
+    groupSelect.innerHTML = "";
+    const list = (groups && groups.length) ? groups.slice() : [];
+    if (selectedId && !list.some(g => g.id === selectedId)) {
+      list.unshift({ id: selectedId, name: selectedName || ("Groupe " + selectedId) });
+    }
+    if (list.length === 0) {
+      const o = document.createElement("option");
+      o.value = "";
+      o.textContent = "— Détection en cours… —";
+      o.disabled = true;
+      o.selected = true;
+      groupSelect.appendChild(o);
+      updateGroupIdCaption(null);
+      return;
+    }
+    for (const g of list) {
+      const o = document.createElement("option");
+      o.value = g.id;
+      // v2026.5.41 : nom seul, l'ID est affiché en caption séparée sous le select
+      o.textContent = g.name;
+      if (g.id === selectedId) o.selected = true;
+      groupSelect.appendChild(o);
+    }
+    updateGroupIdCaption(groupSelect.value);
+  }
+
+  function updateGroupIdCaption(id) {
+    if (!id) { groupIdCaption.textContent = ""; return; }
+    groupIdCaption.textContent = "ID groupe : " + id;
+  }
+
+  // Caption ID — créée maintenant pour qu'elle soit dispo dans paintGroupOptions
+  const groupIdCaption = document.createElement("span");
+  groupIdCaption.className = "admin-section-desc";
+  groupIdCaption.style.marginLeft = "12px";
+  groupIdCaption.style.fontStyle = "italic";
+
+  paintGroupOptions(cfg.detectedGroups || [], cfg.groupId, cfg.groupName);
+
+  groupSelect.addEventListener("change", async () => {
+    const id = groupSelect.value;
+    const opt = groupSelect.options[groupSelect.selectedIndex];
+    cfg.groupId = id;
+    const name = opt ? opt.textContent.trim() : "";
+    cfg.groupName = name;
+    updateGroupIdCaption(id);
+    await saveAdminConfig(cfg);
+    showToast("Groupe enregistré", `${name || id} (rechargez l'extension pour appliquer)`);
+    // v2026.5.41 : refresh auto de la liste d'équipe avec le nouveau group_id.
+    await refreshTeamForGroup(id);
+  });
+
+  groupRow.querySelector(".admin-row-control").appendChild(groupSelect);
+
+  // Caption ID groupe à droite du select
+  groupRow.querySelector(".admin-row-control").appendChild(groupIdCaption);
+
+  container.appendChild(groupRow);
+
+  const groupStatus = document.createElement("div");
+  groupStatus.className = "admin-section-desc";
+  groupStatus.style.marginTop = "4px";
+  groupStatus.style.marginBottom = "12px";
+  container.appendChild(groupStatus);
+
+  async function detectGroups() {
+    groupStatus.textContent = "Connexion à EasyVista…";
+    try {
+      const resp = await sendMessage({ type: "detectGroups" });
+      if (resp && resp.ok && resp.groups && resp.groups.length) {
+        cfg.detectedGroups = resp.groups;
+        if (!cfg.groupId) {
+          const def = resp.groups.find(g => /^SI-CSS$/i.test(g.name)) || resp.groups[0];
+          cfg.groupId = def.id;
+          cfg.groupName = def.name;
+        }
+        await saveAdminConfig(cfg);
+        paintGroupOptions(resp.groups, cfg.groupId, cfg.groupName);
+        groupStatus.textContent = `${resp.groups.length} groupe(s) détecté(s).`;
+      } else {
+        const err = (resp && resp.error) || "aucun groupe trouvé";
+        groupStatus.textContent = "Détection impossible : " + err + ".";
+      }
+    } catch (e) {
+      console.warn("[admin] detectGroups err", e);
+      groupStatus.textContent = "Erreur : " + (e.message || e);
+    }
+  }
+
+  // Auto-détection à l'ouverture (non-bloquant, sans popup)
+  detectGroups();
+
   // État local : liste {id, name, included, days:[0..6]}
   // Au départ on remplit depuis cfg.team actuel, puis la détection EV
   // enrichit cette liste.
@@ -2135,53 +2257,14 @@ function renderAdminSectionTeam(container, cfg, saveFn) {
   function render() {
     tableWrap.innerHTML = "";
 
-    // Bouton "Détecter depuis EasyVista"
-    const detectBtn = document.createElement("button");
-    detectBtn.type = "button";
-    detectBtn.className = "btn btn-secondary";
-    detectBtn.textContent = "🔍 Détecter depuis EasyVista (groupe complet)";
-    detectBtn.style.marginBottom = "12px";
-    detectBtn.addEventListener("click", async () => {
-      detectBtn.disabled = true;
-      detectBtn.textContent = "Détection en cours…";
-      try {
-        const resp = await sendMessage({ type: "detectTeam" });
-        if (resp && resp.ok && resp.members && resp.members.length) {
-          // Merge : pour chaque membre détecté, ajoute à `rows` s'il n'y est
-          // pas déjà. S'il y est déjà, met à jour le nom (si meilleur).
-          for (const m of resp.members) {
-            const existing = rows.find(r => r.id === m.id);
-            if (existing) {
-              // Améliorer le nom si le nom actuel commence par "?"
-              if (m.name && !m.name.startsWith("?") && existing.name.startsWith("?")) {
-                existing.name = m.name;
-              }
-            } else {
-              rows.push({
-                id: m.id,
-                name: m.name || "? (" + m.id + ")",
-                included: !!m.alreadyInTeam,  // coché si déjà dans l'équipe
-                days: []
-              });
-            }
-          }
-          showToast("Détecté", resp.members.length + " personne(s) dans le groupe");
-          render();
-        } else {
-          showAlertModal({
-            title: "Détection impossible",
-            message: (resp && resp.error) || "Aucune personne trouvée. Vérifiez que vous êtes connecté à EasyVista.",
-            buttons: [{ label: "OK", variant: "secondary", action: () => {} }]
-          });
-        }
-      } catch (err) {
-        console.warn("[admin] detectTeam err", err);
-      } finally {
-        detectBtn.disabled = false;
-        detectBtn.textContent = "🔍 Détecter depuis EasyVista (groupe complet)";
-      }
+    // v2026.5.41 : tri = inclus d'abord, puis exclus, alphabétique dans
+    // chaque groupe. Pas de tri à chaque toggle de checkbox (sinon la ligne
+    // sauterait sous le curseur), uniquement aux render() (ouverture +
+    // après détection auto).
+    rows.sort((a, b) => {
+      if (a.included !== b.included) return a.included ? -1 : 1;
+      return (a.name || "").localeCompare(b.name || "", "fr", { sensitivity: "base" });
     });
-    tableWrap.appendChild(detectBtn);
 
     // Stats : nb inclus / total
     const included = rows.filter(r => r.included).length;
@@ -2218,31 +2301,28 @@ function renderAdminSectionTeam(container, cfg, saveFn) {
       tdInc.appendChild(cb);
       tr.appendChild(tdInc);
 
-      // ID
+      // ID — v2026.5.40 r20 : non modifiable (lecture seule), affiché en
+      // texte simple plutôt qu'un input.
       const tdId = document.createElement("td");
-      const inpId = document.createElement("input");
-      inpId.type = "text";
-      inpId.value = r.id;
-      inpId.placeholder = "76272";
-      inpId.className = "admin-input admin-input-id";
-      inpId.addEventListener("input", () => { r.id = inpId.value.trim(); });
-      tdId.appendChild(inpId);
+      const idEl = document.createElement("span");
+      idEl.className = "admin-team-id-readonly";
+      idEl.textContent = r.id;
+      tdId.appendChild(idEl);
       tr.appendChild(tdId);
 
-      // Nom
+      // Nom — v2026.5.40 r20 : non modifiable (lecture seule), affiché en
+      // texte simple. Détecté/configuré via "Détecter depuis EasyVista".
       const tdName = document.createElement("td");
-      const inpName = document.createElement("input");
-      inpName.type = "text";
-      inpName.value = r.name;
-      inpName.placeholder = "Dupont, Jean";
-      inpName.className = "admin-input";
-      inpName.addEventListener("input", () => { r.name = inpName.value.trim(); });
-      tdName.appendChild(inpName);
+      const nameEl = document.createElement("span");
+      nameEl.className = "admin-team-name-readonly";
+      nameEl.textContent = r.name;
+      tdName.appendChild(nameEl);
       tr.appendChild(tdName);
 
-      // Jours d'absence récurrente
+      // Jours d'absence récurrente — v2026.5.40 r21 : du lundi (1) au
+      // vendredi (5), pas de samedi/dimanche (jamais utilisés au DGNSI).
       const tdAbs = document.createElement("td");
-      for (let d = 0; d < 7; d++) {
+      for (let d = 1; d <= 5; d++) {
         const lbl = document.createElement("label");
         lbl.className = "admin-day-cb";
         const cbd = document.createElement("input");
@@ -2258,19 +2338,8 @@ function renderAdminSectionTeam(container, cfg, saveFn) {
       }
       tr.appendChild(tdAbs);
 
-      // Bouton supprimer ligne
-      const tdDel = document.createElement("td");
-      const delBtn = document.createElement("button");
-      delBtn.type = "button";
-      delBtn.className = "admin-del-btn";
-      delBtn.textContent = "🗑";
-      delBtn.title = "Retirer cette ligne";
-      delBtn.addEventListener("click", () => {
-        rows.splice(idx, 1);
-        render();
-      });
-      tdDel.appendChild(delBtn);
-      tr.appendChild(tdDel);
+      // v2026.5.40 r18 : poubelle retirée (jamais utilisée — l'équipe est
+      // hardcodée et ajustée via les checkboxes "exclure", pas par suppression).
 
       tbody.appendChild(tr);
     });
@@ -2312,7 +2381,7 @@ function renderAdminSectionTeam(container, cfg, saveFn) {
   // cochés par défaut ; les nouveaux détectés du groupe apparaissent non-cochés.
   (async () => {
     try {
-      const resp = await sendMessage({ type: "detectTeam" });
+      const resp = await sendMessage({ type: "detectTeam", groupId: cfg.groupId });
       if (resp && resp.ok && resp.members && resp.members.length) {
         for (const m of resp.members) {
           const existing = rows.find(r => r.id === m.id);
@@ -2335,26 +2404,144 @@ function renderAdminSectionTeam(container, cfg, saveFn) {
       console.warn("[admin auto-detect]", err);
     }
   })();
+
+  // v2026.5.41 : refresh complet de la liste d'équipe quand on change de groupe.
+  // Appelé depuis le handler `change` du sélecteur de groupe.
+  // Comportement : on REMPLACE complètement les rows (le nouveau groupe a
+  // potentiellement une équipe totalement différente), et on rerend la table.
+  // Aucun pré-cochage : l'utilisateur choisit les techs à inclure dans le
+  // nouveau groupe, puis clique sur Enregistrer.
+  async function refreshTeamForGroup(newGroupId) {
+    rows.length = 0;
+    render();
+    try {
+      const resp = await sendMessage({ type: "detectTeam", groupId: newGroupId });
+      if (resp && resp.ok && resp.members && resp.members.length) {
+        for (const m of resp.members) {
+          rows.push({
+            id: m.id,
+            name: m.name || "? (" + m.id + ")",
+            included: !!m.alreadyInTeam,
+            days: []
+          });
+        }
+        render();
+      } else {
+        console.warn("[admin] refreshTeamForGroup : aucune personne", resp);
+      }
+    } catch (err) {
+      console.warn("[admin] refreshTeamForGroup err", err);
+    }
+  }
+}
+
+// v2026.5.41 : Section EasyVista — édition manuelle des domaines (interne /
+// externe). Les valeurs par défaut restent hardcodées (DEFAULT_EV_ORIGINS),
+// mais l'utilisateur peut les remplacer ou en ajouter d'autres si EasyVista
+// change d'URL. Bouton "Réinitialiser" pour revenir aux défauts.
+const DEFAULT_EV_ORIGIN_INTERNAL = "https://itsma.etat-de-vaud.ch";
+const DEFAULT_EV_ORIGIN_EXTERNAL = "https://itsma.vd.ch";
+
+function _normalizeOrigin(raw) {
+  let s = (raw || "").trim();
+  if (!s) return "";
+  // Retirer trailing slash
+  s = s.replace(/\/+$/, "");
+  // Préfixer https:// si l'utilisateur a tapé juste un domaine
+  if (!/^https?:\/\//i.test(s)) s = "https://" + s;
+  return s;
 }
 
-// v5.0.0 : sections suivantes (placeholders, à enrichir v5.0.1+)
 function renderAdminSectionEV(container, cfg, saveFn) {
   const h = document.createElement("h3");
   h.textContent = "EasyVista";
   h.className = "admin-section-title";
   container.appendChild(h);
+
   const desc = document.createElement("p");
   desc.className = "admin-section-desc";
-  desc.textContent = "Section à venir dans v5.0.1. Origines EasyVista + group_id.";
+  desc.textContent = "Domaines EasyVista surveillés pour détecter votre session active. Le domaine interne (réseau DGNSI) et le domaine externe (Internet) sont préremplis. Modifiez-les si EasyVista change d'URL.";
   container.appendChild(desc);
-  // Infos lecture seule pour l'instant
-  const pre = document.createElement("pre");
-  pre.className = "admin-readonly";
-  pre.textContent = JSON.stringify({
-    evOrigins: cfg.evOrigins,
-    groupId: cfg.groupId
-  }, null, 2);
-  container.appendChild(pre);
+
+  // État local : on lit cfg.evOrigins, sinon défaut.
+  const origins = (cfg.evOrigins && cfg.evOrigins.length >= 2)
+    ? cfg.evOrigins.slice()
+    : [DEFAULT_EV_ORIGIN_INTERNAL, DEFAULT_EV_ORIGIN_EXTERNAL];
+
+  // ---- Champ "Domaine interne" ----
+  const internalRow = _makeAdminRow(
+    "Domaine interne (DGNSI)",
+    `Réseau interne du Canton. Défaut : ${DEFAULT_EV_ORIGIN_INTERNAL}`
+  );
+  const internalInput = document.createElement("input");
+  internalInput.type = "text";
+  internalInput.className = "admin-input";
+  internalInput.style.minWidth = "320px";
+  internalInput.placeholder = DEFAULT_EV_ORIGIN_INTERNAL;
+  internalInput.value = origins[0] || "";
+  internalRow.querySelector(".admin-row-control").appendChild(internalInput);
+  container.appendChild(internalRow);
+
+  // ---- Champ "Domaine externe" ----
+  const externalRow = _makeAdminRow(
+    "Domaine externe (Internet)",
+    `Accès depuis l'extérieur. Défaut : ${DEFAULT_EV_ORIGIN_EXTERNAL}`
+  );
+  const externalInput = document.createElement("input");
+  externalInput.type = "text";
+  externalInput.className = "admin-input";
+  externalInput.style.minWidth = "320px";
+  externalInput.placeholder = DEFAULT_EV_ORIGIN_EXTERNAL;
+  externalInput.value = origins[1] || "";
+  externalRow.querySelector(".admin-row-control").appendChild(externalInput);
+  container.appendChild(externalRow);
+
+  // ---- Statut / messages ----
+  const status = document.createElement("div");
+  status.className = "admin-section-desc";
+  status.style.marginTop = "4px";
+  container.appendChild(status);
+
+  // ---- Boutons ----
+  const btnWrap = document.createElement("div");
+  btnWrap.style.marginTop = "16px";
+  btnWrap.style.display = "flex";
+  btnWrap.style.gap = "8px";
+
+  const saveBtn = document.createElement("button");
+  saveBtn.type = "button";
+  saveBtn.className = "btn btn-primary";
+  saveBtn.textContent = "💾 Enregistrer";
+  saveBtn.addEventListener("click", async () => {
+    const a = _normalizeOrigin(internalInput.value);
+    const b = _normalizeOrigin(externalInput.value);
+    if (!a || !b) {
+      status.textContent = "Les deux domaines doivent être renseignés.";
+      return;
+    }
+    internalInput.value = a;
+    externalInput.value = b;
+    cfg.evOrigins = [a, b];
+    const ok = await saveAdminConfig(cfg);
+    status.textContent = ok
+      ? "Domaines enregistrés. Rechargez l'extension pour appliquer."
+      : "Erreur lors de l'enregistrement.";
+    if (ok) showToast("Domaines enregistrés", `${a}  •  ${b}`);
+  });
+  btnWrap.appendChild(saveBtn);
+
+  const resetBtn = document.createElement("button");
+  resetBtn.type = "button";
+  resetBtn.className = "btn btn-secondary";
+  resetBtn.textContent = "↺ Réinitialiser aux valeurs par défaut";
+  resetBtn.addEventListener("click", () => {
+    internalInput.value = DEFAULT_EV_ORIGIN_INTERNAL;
+    externalInput.value = DEFAULT_EV_ORIGIN_EXTERNAL;
+    status.textContent = "Valeurs par défaut restaurées (cliquez sur Enregistrer pour appliquer).";
+  });
+  btnWrap.appendChild(resetBtn);
+
+  container.appendChild(btnWrap);
 }
 
 // v2026.5.39 : section Apparence — thème, taille du texte, cache.
@@ -2680,25 +2867,6 @@ function _applyTheme(theme) {
   }
 }
 
-function renderAdminSectionStatuses(container, cfg, saveFn) {
-  const h = document.createElement("h3");
-  h.textContent = "Statuts";
-  h.className = "admin-section-title";
-  container.appendChild(h);
-  const desc = document.createElement("p");
-  desc.className = "admin-section-desc";
-  desc.textContent = "Section à venir dans v5.0.x. Mots-clés Clôturé / Résolu / Annulé.";
-  container.appendChild(desc);
-  const pre = document.createElement("pre");
-  pre.className = "admin-readonly";
-  pre.textContent = JSON.stringify({
-    closed: cfg.closedStatus,
-    resolved: cfg.resolvedStatus,
-    cancelled: cfg.cancelledStatus
-  }, null, 2);
-  container.appendChild(pre);
-}
-
 function renderAdminSectionDiagnostics(container, cfg, saveFn) {
   const h = document.createElement("h3");
   h.textContent = "Diagnostics";
@@ -5483,9 +5651,9 @@ function renderStats(s) {
     ${(s.closed + s.resolved > 0) ? `<span class="global-stat-sep">·</span><span class="global-stat"><b>${s.closed + s.resolved}</b> clos</span>` : ""}
     <span class="global-stat-sep">·</span>
     <span class="global-stat" title="Techs réellement disponibles aujourd'hui (hors absents et réservés toute la journée — les pompiers comptent)"><b>${s.available}</b> tech. dispo</span>
-    <span class="global-stat-sep">·</span>
+    <span class="global-stat-sep global-stat-sep-keep sep-pompier">+</span>
     <span class="global-stat"><b>${s.pompiers}</b> pompier${s.pompiers > 1 ? "s" : ""}</span>
-    <span class="global-stat-sep">·</span>
+    <span class="global-stat-sep sep-absent">/</span>
     <span class="global-stat"><b>${s.absents}</b> absent${s.absents > 1 ? "s" : ""}</span>
   `;
   el.classList.remove("hidden");
@@ -5630,6 +5798,12 @@ function buildCard(tech, isoDate) {
   const nameEl = document.createElement("div");
   nameEl.className = "card-tech-name";
   nameEl.textContent = tech.name;
+  // v2026.5.40 r8 : si le nom est très long, ajouter la classe -tight pour
+  // baisser légèrement la font-size (11.5px au lieu de 13px) et lui permettre
+  // de tenir sur 2-3 lignes proprement. Seuil empirique 24 chars.
+  if (typeof tech.name === "string" && tech.name.length > 24) {
+    nameEl.classList.add("card-tech-name-tight");
+  }
   header.appendChild(nameEl);
 
   if (isPompier || isAbsent || isRecurring) {
@@ -5644,6 +5818,9 @@ function buildCard(tech, isoDate) {
       badge.textContent = "Pompier";
     } else if (absenceCategory === "maladie") {
       badge.classList.add("badge-maladie");
+      // v2026.5.40 r15 : libellé complet "Maladie/Accident" partout.
+      // En horizontal, la sidebar est élargie (180px) + font 8.5px pour
+      // que ça tienne sans tronquer.
       badge.textContent = "Maladie/Accident";
     } else if (absenceCategory === "conge") {
       // Déterminer singulier/pluriel selon la durée
@@ -5659,20 +5836,38 @@ function buildCard(tech, isoDate) {
   }
 
   // v2026.5.32 : stats rapides pour la vue horizontale (cachées en classique)
-  const rowStats = document.createElement("div");
-  rowStats.className = "tech-row-stats";
-  const totalInterv = realInterventions.length;
-  const pill1 = document.createElement("span");
-  pill1.className = "stat-pill";
-  pill1.textContent = totalInterv + " interv.";
-  rowStats.appendChild(pill1);
-  if (morning > 0 || afternoon > 0) {
-    const pill2 = document.createElement("span");
-    pill2.className = "stat-pill";
-    pill2.textContent = morning + "m · " + afternoon + "a";
-    rowStats.appendChild(pill2);
+  // v2026.5.40 r7 :
+  //  - chiffre du total mis en évidence (plus gros) via class .stat-pill-big-num
+  //  - libellé matin/aprem raccourci ("3 mat. · 4 a-midi")
+  //  - PAS DE PILL si tech absent toute la journée OU réservé toute la journée
+  //    (info redondante avec le badge "Absent" / "Pompier" et la timeline vide)
+  const reservedAllDay = realInterventions.some(iv => {
+    if (iv.type !== "AL-Reservation") return false;
+    const sm = timeToMinutes(iv.startTime);
+    const em = timeToMinutes(iv.endTime);
+    return sm !== null && em !== null && sm <= DAY_START && em >= DAY_END;
+  });
+  if (!isAbsent && !reservedAllDay) {
+    const rowStats = document.createElement("div");
+    rowStats.className = "tech-row-stats";
+    const totalInterv = realInterventions.length;
+    const pill1 = document.createElement("span");
+    pill1.className = "stat-pill";
+    // Chiffre en avant via span dédié (style .stat-pill-big-num)
+    const numSpan = document.createElement("span");
+    numSpan.className = "stat-pill-big-num";
+    numSpan.textContent = String(totalInterv);
+    pill1.appendChild(numSpan);
+    pill1.appendChild(document.createTextNode(" intervention" + (totalInterv > 1 ? "s" : "")));
+    rowStats.appendChild(pill1);
+    if (morning > 0 || afternoon > 0) {
+      const pill2 = document.createElement("span");
+      pill2.className = "stat-pill";
+      pill2.textContent = morning + " mat. · " + afternoon + " a-midi";
+      rowStats.appendChild(pill2);
+    }
+    header.appendChild(rowStats);
   }
-  header.appendChild(rowStats);
 
   card.appendChild(header);
 
@@ -5811,6 +6006,15 @@ function buildCard(tech, isoDate) {
   // Timeline
   body.appendChild(buildTimeline(realInterventions, pompierBlocks, absenceBlocks, card, isPompier, isAbsent));
 
+  // v2026.5.40 r3 : conteneur mini-cards (visible en vue horizontale uniquement
+  // via CSS). Sous la timeline, alignées dans l'ordre des interventions, avec
+  // une largeur proportionnelle à la durée (flex-grow), un min-width pour
+  // garantir la lisibilité, et des trous représentés par des espaces vides
+  // (préserve l'alignement visuel avec la timeline du dessus).
+  if (realInterventions.length > 0) {
+    body.appendChild(_buildMiniCardsRow(realInterventions, card));
+  }
+
   // Stats de carte
   if (realInterventions.length > 0) {
     const stats = document.createElement("div");
@@ -5907,6 +6111,158 @@ async function _initDayBoundsFromConfig() {
   }
 }
 
+// v2026.5.40 r3 : construit le rangée des mini-cartes (visible en vue
+// horizontale uniquement, masquée en classique via CSS).
+// Chaque intervention donne une mini-carte avec : barre couleur catégorie +
+// référence + heure début→fin + ville + adresse. Les trous entre interventions
+// sont représentés par des espaces vides (flex-grow proportionnel au temps),
+// pour conserver l'alignement visuel avec la timeline du dessus.
+function _buildMiniCardsRow(realInterventions, cardEl) {
+  const row = document.createElement("div");
+  row.className = "iv-mini-cards";
+
+  // v2026.5.40 r5 : on n'utilise plus la largeur proportionnelle à la durée
+  // (= alignement avec la timeline). À la place, chaque mini-card a la
+  // MÊME largeur (flex: 1 1 0), pour que toutes soient visibles d'un coup
+  // et lisibles. La position temporelle est déjà donnée par la timeline
+  // au-dessus.
+  const sorted = [...realInterventions]
+    .map(iv => {
+      const s = timeToMinutes(iv.startTime);
+      const e = timeToMinutes(iv.endTime);
+      return { iv, s, e };
+    })
+    .filter(o => o.s !== null && o.e !== null && o.e > o.s)
+    .sort((a, b) => a.s - b.s);
+
+  // v2026.5.40 r9 : structure en 2 BLOCS (Matin / Après-midi) avec un label
+  // au-dessus de chaque bloc. Plus lisible que la pill au milieu.
+  const blocks = {
+    morning: null,   // créé à la demande
+    afternoon: null
+  };
+  function _ensureBlock(period) {
+    if (blocks[period]) return blocks[period];
+    const block = document.createElement("div");
+    block.className = "iv-mini-block period-" + period;
+    const label = document.createElement("div");
+    label.className = "iv-mini-block-label";
+    label.textContent = period === "morning" ? "Matin" : "Après-midi";
+    block.appendChild(label);
+    const cards = document.createElement("div");
+    cards.className = "iv-mini-block-cards";
+    block.appendChild(cards);
+    blocks[period] = { root: block, cards };
+    row.appendChild(block);
+    return blocks[period];
+  }
+  for (const { iv, s } of sorted) {
+    const period = (s !== null && s < 12 * 60) ? "morning" : "afternoon";
+    _ensureBlock(period);
+    const colorKey = deriveColorKey(iv) || "autre";
+    const ivIdx = realInterventions.indexOf(iv);
+    const card = document.createElement("div");
+    card.className = "iv-mini-card color-" + colorKey;
+    card.dataset.ivIdx = String(ivIdx);
+    if (iv.ref) card.dataset.ref = iv.ref;
+
+    const lieu = splitLieu(iv.bulleLieu);
+    const ville = (lieu && lieu.ville) ? lieu.ville.toUpperCase() : "";
+    const adresse = (lieu && lieu.adresse) ? lieu.adresse : "";
+    const ref = iv.ref || "";
+    const startTime = iv.startTime || "";
+    const endTime = iv.endTime || "";
+
+    // Barre couleur (4px à gauche)
+    const bar = document.createElement("div");
+    bar.className = "iv-mini-card-bar";
+    card.appendChild(bar);
+
+    // v2026.5.40 r7 : bloc heure VERTICAL (haut→bas) : 09:00 / ↓ / 10:00
+    if (startTime && endTime) {
+      const timeCol = document.createElement("div");
+      timeCol.className = "iv-mini-time-vertical";
+      const tStart = document.createElement("span");
+      tStart.className = "iv-mini-time-start";
+      tStart.textContent = startTime;
+      timeCol.appendChild(tStart);
+      const tArrow = document.createElement("span");
+      tArrow.className = "iv-mini-time-arrow";
+      tArrow.textContent = "↓";
+      timeCol.appendChild(tArrow);
+      const tEnd = document.createElement("span");
+      tEnd.className = "iv-mini-time-end";
+      tEnd.textContent = endTime;
+      timeCol.appendChild(tEnd);
+      card.appendChild(timeCol);
+    }
+
+    // Bloc texte : ref + ville + adresse (3 lignes)
+    const txt = document.createElement("div");
+    txt.className = "iv-mini-card-text";
+
+    const lineRef = document.createElement("div");
+    lineRef.className = "iv-mini-line iv-mini-ref";
+    lineRef.textContent = ref;
+    txt.appendChild(lineRef);
+
+    if (ville) {
+      const lineVille = document.createElement("div");
+      lineVille.className = "iv-mini-line iv-mini-ville";
+      lineVille.textContent = ville;
+      txt.appendChild(lineVille);
+    }
+
+    if (adresse) {
+      const lineAdr = document.createElement("div");
+      lineAdr.className = "iv-mini-line iv-mini-adresse";
+      lineAdr.textContent = adresse;
+      txt.appendChild(lineAdr);
+    }
+
+    card.appendChild(txt);
+
+    // v2026.5.40 r8 : hover sur la mini-card = comportement comme une row
+    // .intervention-v2 en vue classique → ouvre la GRANDE popup ancrée.
+    // r9 : pas d'épinglage si réservation (clic sans effet).
+    const isReservation = iv && iv.type === "AL-Reservation";
+    card.addEventListener("mouseenter", (e) => {
+      highlightIntervention(cardEl, ivIdx, true);
+      showTooltip(e, iv, card);
+    });
+    card.addEventListener("mouseleave", () => {
+      highlightIntervention(cardEl, ivIdx, false);
+      hideTooltip();
+    });
+    if (!isReservation) {
+      card.addEventListener("click", (e) => {
+        // Ctrl/Cmd/middle → fiche EV en arrière-plan
+        if (e.ctrlKey || e.metaKey || e.button === 1) {
+          e.preventDefault();
+          e.stopPropagation();
+          openInterventionFromTimeline(card, { background: true });
+          return;
+        }
+        // v2026.5.40 r10 : forcer l'affichage IMMÉDIAT de la grande popup
+        // ancrée AVANT pinTooltip(). Sans ça, si le délai showTooltip 500ms
+        // n'est pas encore écoulé OU si la petite popup timeline était
+        // affichée juste avant, c'est elle qui se faisait épingler.
+        e.stopPropagation();
+        _cancelPendingShowTooltip();
+        _cancelPendingTimelinePopover();
+        _showTooltipImpl(e, iv, card);
+        pinTooltip();
+      });
+    }
+
+    // v2026.5.40 r9 : on ajoute la card dans le bloc Matin ou Après-midi
+    // (period déjà calculé en haut de la boucle)
+    blocks[period].cards.appendChild(card);
+  }
+
+  return row;
+}
+
 function buildTimeline(realInterventions, pompierBlocks, absenceBlocks, cardEl, isPompier, isAbsent) {
 
   const wrap = document.createElement("div");
@@ -5992,6 +6348,12 @@ function buildTimeline(realInterventions, pompierBlocks, absenceBlocks, cardEl,
       el.dataset.title = deriveShortTitle(seg.iv);
       if (seg.iv.ref) el.dataset.ref = seg.iv.ref;
     }
+
+    // v2026.5.40 r3 : la timeline reprend son comportement classique (segments
+    // colorés simples). Les infos détaillées (ref/heure/ville/adresse) sont
+    // maintenant rendues dans un conteneur SÉPARÉ sous la timeline (cf.
+    // .iv-mini-cards plus bas dans buildCard, visible en vue horizontale).
+
     if (seg.ivIdx !== undefined) {
       el.dataset.ivIdx = seg.ivIdx;
       el.addEventListener("mouseenter", () => highlightIntervention(cardEl, seg.ivIdx, true));
@@ -6043,40 +6405,23 @@ function getStatusClass(iv) {
  * @author Quentin Rouiller
  */
 function bindTimelinePopover(el) {
-  // v2026.5.33 : en vue horizontale, les interactions sont différentes :
-  //   - hover   : ouvre directement la GRANDE popup (pas la petite)
-  //   - clic    : ouvre la fiche EasyVista dans un nouvel onglet
-  // En vue classique, le comportement existant est conservé :
+  // v2026.5.40 r4 : comportement UNIFIÉ vue classique + vue horizontale.
   //   - hover        : petite popup qui suit la souris
   //   - clic simple  : grande popup persistante
   //   - double-clic  : fiche EasyVista nouvel onglet
   //   - Ctrl+clic    : fiche EasyVista en arrière-plan
-  const _isHorizontalView = () => document.documentElement.classList.contains("view-horizontal");
 
   el.addEventListener("mouseenter", (e) => {
-    if (_isHorizontalView()) {
-      // Grande popup directement en vue horizontale
-      if (el.dataset.ivIdx !== undefined) {
-        openPersistentTimelinePopup(el);
-      }
-    } else {
-      showTimelinePopover(e, el);
-    }
+    showTimelinePopover(e, el);
   });
   // v4.2.3 : la petite popup timeline SUIT la souris (différent de la grande
   // popup des lignes d'intervention qui est ancrée). On n'utilise pas
   // moveTooltip() (no-op depuis v4.1.12) mais une fonction dédiée.
   el.addEventListener("mousemove", (e) => {
-    if (!_isHorizontalView()) {
-      moveTimelineTooltip(e);
-    }
+    moveTimelineTooltip(e);
   });
   el.addEventListener("mouseleave", () => {
-    if (!_isHorizontalView()) {
-      hideTooltip();
-    }
-    // En vue horizontale, la grande popup est persistante donc on ne ferme
-    // pas au mouseleave (l'user peut interagir avec).
+    hideTooltip();
   });
 
   const kind = el.dataset.kind;
@@ -6084,20 +6429,12 @@ function bindTimelinePopover(el) {
   // Seulement sur les segments avec une interventoin (pas les "hole" libres
   // ni certaines absences sans ivIdx)
   if (ivIdxStr === undefined) return;
+  // v2026.5.40 r9 : pas d'épinglage des absences ni des réservations.
+  // Ces segments restent en hover (petite popup timeline) seulement.
+  if (kind === "absence" || kind === "reservation") return;
 
   let singleClickTimer = null;
   el.addEventListener("click", (e) => {
-    // v2026.5.33 : en vue horizontale, tout clic simple = ouvrir la fiche EV
-    if (_isHorizontalView()) {
-      e.preventDefault();
-      e.stopPropagation();
-      // Ctrl/Cmd/middle → arrière-plan, sinon nouvel onglet actif
-      const background = !!(e.ctrlKey || e.metaKey || e.button === 1);
-      openInterventionFromTimeline(el, { background });
-      return;
-    }
-
-    // Vue classique (inchangé) :
     // Ctrl / Cmd / molette → ouvrir fiche en arrière-plan
     if (e.ctrlKey || e.metaKey || e.button === 1) {
       e.preventDefault();
@@ -6263,7 +6600,43 @@ function openPersistentTimelinePopup(el) {
   positionTooltipAnchored(el, { anchorBelow: true });
 }
 
+// v2026.5.40 r9 : délai d'apparition 500 ms sur la petite popup timeline
+// (cohérent avec showTooltip). Pendant ces 500 ms, si la souris quitte
+// (mouseleave / autre élément), le timer est annulé.
+let _showTimelinePopoverTimer = null;
+function _cancelPendingTimelinePopover() {
+  if (_showTimelinePopoverTimer) {
+    clearTimeout(_showTimelinePopoverTimer);
+    _showTimelinePopoverTimer = null;
+  }
+}
 function showTimelinePopover(e, el) {
+  _cancelPendingTimelinePopover();
+  _cancelPendingShowTooltip();
+  // v2026.5.40 r15 : dès qu'on hover un segment timeline, fermer IMMÉDIATEMENT
+  // TOUTE grande popup non épinglée (peu importe son mode), sinon elle restait
+  // visible pendant les 500ms du timer hide → effet "grande popup pendant 1s".
+  // On respecte uniquement les popups épinglés (pin = action explicite user).
+  const tip = tooltipEl();
+  if (tip && tip.classList.contains("visible") && !bulleState.pinned) {
+    tip.classList.remove("visible");
+    tip.classList.add("hidden");
+    if (tip.dataset) delete tip.dataset.mode;
+    bulleState.hoveredInRow = false;
+    bulleState.hoveredInBulle = false;
+    state.currentTooltipIv = null;
+    if (bulleState.hideTimer) {
+      clearTimeout(bulleState.hideTimer);
+      bulleState.hideTimer = null;
+    }
+  }
+  const _ev = { clientX: e.clientX, clientY: e.clientY };
+  _showTimelinePopoverTimer = setTimeout(() => {
+    _showTimelinePopoverTimer = null;
+    _showTimelinePopoverImpl(_ev, el);
+  }, 500);
+}
+function _showTimelinePopoverImpl(e, el) {
   const s = parseInt(el.dataset.startMin, 10);
   const eMin = parseInt(el.dataset.endMin, 10);
   const kind = el.dataset.kind;
@@ -6291,9 +6664,13 @@ function showTimelinePopover(e, el) {
     </dl>`;
   }
   const tip = tooltipEl();
-  // v4.2.3 : si une grande bulle est déjà ancrée (clic timeline), on ne
-  // la remplace pas par la petite popup hover.
-  if (tip.dataset.mode === "anchored") return;
+  // v2026.5.40 r12 : si une grande bulle ancrée (depuis la mini-card ou
+  // une row classique) est ouverte, on la REMPLACE par la petite popup
+  // qui suit la souris quand l'user hover un segment timeline.
+  // Ancien comportement (return si anchored) gardait la grande popup et
+  // empêchait le hover timeline d'afficher quoi que ce soit.
+  // Si la bulle est ÉPINGLÉE (clic explicite), on respecte l'épinglage.
+  if (tip.dataset.mode === "anchored" && bulleState.pinned) return;
   // v4.2.4 : annuler tout hideTimer en cours pour éviter que la popup
   // précédente, en train d'être masquée, masque AUSSI celle-ci juste après.
   // Problème typique quand on passe rapidement d'un segment à un autre.
@@ -7446,10 +7823,12 @@ function _cancelPendingShowTooltip() {
  * @author Quentin Rouiller
  */
 function showTooltip(e, iv, rowEl) {
-  // v2026.5.39 : on planifie l'affichage à +500ms. Si la souris quitte
-  // l'élément avant, hideTooltip annule le timer (via _cancelPendingShowTooltip).
-  // Si on rappelle showTooltip pour un autre élément avant, on remplace le timer.
+  // v2026.5.39 : on planifie l'affichage à +500ms.
+  // v2026.5.40 r22 : on annule aussi un éventuel hide timer en cours
+  // (cas typique : la souris revient sur la row pendant les 500ms après
+  // mouseleave précédent → on garde la popup ouverte).
   _cancelPendingShowTooltip();
+  _cancelHideTooltip();
   // Capturer les valeurs sérialisables maintenant (l'event peut être recyclé)
   const _ev = { clientX: e.clientX, clientY: e.clientY };
   _showTooltipTimer = setTimeout(() => {
@@ -7534,33 +7913,39 @@ function _showTooltipImpl(e, iv, rowEl) {
 }
 
 function hideTooltip(opts = {}) {
-  // v2026.5.39 : annuler aussi un éventuel show planifié (pas encore exécuté)
+  // v2026.5.40 r22 : version SIMPLE.
+  // - annuler les éventuels timers de show planifiés
+  // - sauf si épinglé (clic explicite), démarrer un timer 500ms qui ferme
+  // - si la souris revient sur la row/popup, le timer est annulé via les
+  //   listeners mouseenter (pas via flags / elementFromPoint)
   _cancelPendingShowTooltip();
-  // Si la bulle est épinglée, on ignore (sauf force: true = unpin explicite)
+  _cancelPendingTimelinePopover();
   if (bulleState.pinned && !opts.force) return;
-  bulleState.hoveredInRow = false;
-  // Petit délai : laisse le temps à la souris d'ENTRER dans la bulle elle-même
-  // (si l'user veut sélectionner du texte). On annule la fermeture si
-  // hoveredInBulle passe à true entre-temps.
   if (bulleState.hideTimer) clearTimeout(bulleState.hideTimer);
   bulleState.hideTimer = setTimeout(() => {
-    if (bulleState.hoveredInBulle || bulleState.hoveredInRow) return;
+    bulleState.hideTimer = null;
     if (bulleState.pinned) return;
-    // v4.2 : si l'utilisateur a une sélection de texte ACTIVE dans la bulle,
-    // on ne ferme pas (sinon la sélection disparaît avant d'avoir pu copier).
+    // Sélection de texte active : on garde (sauf si force).
     if (!opts.force && hasTextSelectionInTooltip()) return;
     const el = tooltipEl();
     el.classList.remove("visible", "pinned");
     el.classList.add("hidden");
-    // v4.2.4 : reset du mode d'ancrage et de la détection de position
-    if (el.dataset) {
-      delete el.dataset.mode;
-    }
+    if (el.dataset) delete el.dataset.mode;
     state.currentTooltipIv = null;
     currentTooltipPos = null;
-    tooltipPositionMode = null;  // re-détecter à la prochaine ouverture
-  }, 500);  // v2026.5.39 : 500ms (au lieu de 1s) — assez pour entrer dans la bulle sans rester trop longtemps en hover
-             //              à l'user d'atteindre le popup depuis la carte
+    tooltipPositionMode = null;
+    bulleState.hoveredInBulle = false;
+    bulleState.hoveredInRow = false;
+  }, 500);
+}
+
+/** v2026.5.40 r22 : annule un timer de fermeture en cours. Appelé par les
+ *  mouseenter sur row et sur popup pour garder la popup ouverte. */
+function _cancelHideTooltip() {
+  if (bulleState.hideTimer) {
+    clearTimeout(bulleState.hideTimer);
+    bulleState.hideTimer = null;
+  }
 }
 
 // v4.2 : détecte si l'utilisateur a une sélection de texte active dans la bulle.
@@ -8040,6 +8425,15 @@ function pinTooltip() {
   popup.dataset.actionId = iv.actionId || "";
   popup.innerHTML = srcEl.innerHTML;
 
+  // v2026.5.40 r17 : conserver la même largeur que le tooltip live au moment
+  // du clic, pour que la taille de la fenêtre ne change pas à l'épinglage.
+  try {
+    const liveRect = srcEl.getBoundingClientRect();
+    if (liveRect && liveRect.width > 100) {
+      popup.style.width = Math.round(liveRect.width) + "px";
+    }
+  } catch (e) { /* ignore — fallback CSS 520px */ }
+
   // v2026.5.18 : mémoriser la ref et la couleur pour le dock (pastille avec
   // couleur de catégorie + texte ref)
   popup.dataset.ref = iv.ref || "";
@@ -8199,8 +8593,28 @@ function pinTooltip() {
   const w = pRect.width;
   const h = pRect.height;
 
-  // Chercher une position libre
-  const pos = _findFreePopupPosition(rowEl, w, h);
+  // v2026.5.40 r9 : on essaie d'abord de garder le popup à la MÊME POSITION
+  // que le tooltip live actuel (pour que l'utilisateur ne voie pas le popup
+  // sauter à droite/gauche/haut/bas après le clic). Si pour une raison
+  // quelconque la position du tooltip n'est pas exploitable, fallback sur
+  // _findFreePopupPosition.
+  let pos = null;
+  try {
+    const liveTip = tooltipEl();
+    if (liveTip && liveTip.classList.contains("visible")) {
+      const r = liveTip.getBoundingClientRect();
+      if (r.width > 0 && r.height > 0) {
+        pos = {
+          docX: r.left + window.scrollX,
+          docY: r.top + window.scrollY,
+          rect: { left: r.left, top: r.top, right: r.right, bottom: r.bottom }
+        };
+      }
+    }
+  } catch (e) { /* on retombera sur _findFreePopupPosition */ }
+  if (!pos) {
+    pos = _findFreePopupPosition(rowEl, w, h);
+  }
 
   if (!pos) {
     // Pas de place : retirer et afficher un toast
@@ -8223,6 +8637,22 @@ function pinTooltip() {
   // par _softUnpinPopup pour pouvoir ré-épingler via le bouton 📌 restauré.
   popup._linkedIv = iv;
 
+  // v2026.5.40 r9 : si la souris passe sur un popup épinglé, on ferme
+  // IMMÉDIATEMENT toute petite popup timeline ou tooltip ouvert. Évite
+  // que le contenu derrière le popup épinglé reste affiché parasitement.
+  popup.addEventListener("mouseenter", () => {
+    _cancelPendingShowTooltip();
+    _cancelPendingTimelinePopover();
+    const tip = tooltipEl();
+    // On ne ferme que les tooltips "live" (hover/anchored), pas les
+    // popups épinglés eux-mêmes.
+    if (tip && !tip.classList.contains("pinned") && tip.classList.contains("visible")) {
+      tip.classList.remove("visible");
+      tip.classList.add("hidden");
+      if (tip.dataset) delete tip.dataset.mode;
+    }
+  });
+
   // v4.3.0 : libérer le tooltip live (il redevient utilisable pour d'autres survols)
   bulleState.pinned = false;
   bulleState.hoveredInRow = false;
@@ -8770,7 +9200,20 @@ function _getPopupSafeArea() {
     const r = dock.getBoundingClientRect();
     if (r.top < bottomLimit) bottomLimit = r.top - 4;
   }
-  return { top: topLimit, bottom: bottomLimit, left: 4, right: window.innerWidth - 4 };
+  // v2026.5.40 r8 : en vue horizontale, on bloque le bord gauche pour ne pas
+  // laisser un popup glisser sous la sidebar fixe (200px, ou 170px en
+  // breakpoint étroit < 1400px).
+  let leftLimit = 4;
+  if (document.documentElement.classList.contains("view-horizontal")) {
+    const sidebar = document.querySelector(".horizontal-sidebar");
+    if (sidebar) {
+      const r = sidebar.getBoundingClientRect();
+      if (r.right > leftLimit) leftLimit = r.right + 4;
+    } else {
+      leftLimit = (window.innerWidth <= 1400) ? 174 : 204;
+    }
+  }
+  return { top: topLimit, bottom: bottomLimit, left: leftLimit, right: window.innerWidth - 4 };
 }
 
 /**
@@ -9060,9 +9503,11 @@ function _formatDateForPill(iso) {
 function _ensureDockCloseAllBtn() {
   const dock = document.getElementById("pinned-popups-dock");
   if (!dock) return;
-  const allPinned = document.querySelectorAll(".pinned-popup");
+  // v2026.5.40 r9 : bouton "Fermer tous" seulement si PLUS DE DEUX (>= 3)
+  // popups réduits dans le dock. Avec 1 ou 2, le user les ferme à la main.
+  const reducedCount = document.querySelectorAll(".pinned-popup-dock-pill").length;
   let closeAllBtn = document.getElementById("pinned-popups-close-all");
-  if (allPinned.length >= 2) {
+  if (reducedCount >= 3) {
     if (!closeAllBtn) {
       closeAllBtn = document.createElement("button");
       closeAllBtn.type = "button";
@@ -9475,67 +9920,20 @@ function bindTooltipInteractions() {
     e.stopPropagation();
   }, { passive: false });
 
-  // Hover sur la bulle elle-même : empêche la fermeture
+  // v2026.5.40 r22 : Hover sur la bulle empêche la fermeture (pour la
+  // sélection de texte). Quand on quitte la bulle, hideTooltip démarre
+  // un nouveau timer 500ms — si la souris revient sur la row avant 500ms,
+  // showTooltip annule le timer (via _cancelHideTooltip).
   el.addEventListener("mouseenter", () => {
-    bulleState.hoveredInBulle = true;
-    if (bulleState.hideTimer) {
-      clearTimeout(bulleState.hideTimer);
-      bulleState.hideTimer = null;
-    }
+    _cancelHideTooltip();
   });
   el.addEventListener("mouseleave", () => {
-    bulleState.hoveredInBulle = false;
-    if (!bulleState.hoveredInRow && !bulleState.pinned) {
-      hideTooltip();
-    }
+    if (!bulleState.pinned) hideTooltip();
   });
 
-  // Double-Ctrl : v2026.5.21 — toggle sur l'intervention survolée
-  //   - Si tooltip visible et iv pas encore épinglée pour cette date : épingle
-  //   - Si tooltip visible et iv déjà épinglée pour cette date : désépingle
-  //   - Sinon (pas de tooltip visible) : rien
-  // On détecte 2 keydown Control dans une fenêtre de 400 ms.
-  let lastCtrlTs = 0;
-  document.addEventListener("keydown", (e) => {
-    if (e.key !== "Control") return;
-    if (e.repeat) return;
-    const now = performance.now();
-    if (now - lastCtrlTs < 400) {
-      lastCtrlTs = 0;
-      const iv = state.currentTooltipIv;
-      if (!iv) return;
-      const pinState = _getPinStateForIv(iv);
-      if (pinState.isPinned && pinState.popup) {
-        // Déjà épinglée : désépingle (ferme le popup correspondant)
-        const idx = pinnedPopups.findIndex(p => p.el === pinState.popup);
-        if (idx >= 0) pinnedPopups.splice(idx, 1);
-        // Fermer aussi la pastille dock si elle existe
-        if (pinState.popup._linkedPill) {
-          try { pinState.popup._linkedPill.remove(); } catch (e) {}
-        }
-        try { pinState.popup.remove(); } catch (e) {}
-        // Nettoyer dock si vide
-        const dock = document.getElementById("pinned-popups-dock");
-        if (dock && dock.querySelectorAll(".pinned-popup-dock-pill").length === 0) {
-          dock.classList.remove("visible");
-          const closeAllBtn = document.getElementById("pinned-popups-close-all");
-          if (closeAllBtn) closeAllBtn.remove();
-        } else {
-          _ensureDockCloseAllBtn();
-        }
-        // Mettre à jour le tooltip hover (📍 → 📌)
-        const tip = tooltipEl();
-        if (tip && tip.classList.contains("visible")) {
-          tip.innerHTML = buildTooltipHTML(iv);
-        }
-      } else {
-        // Pas encore épinglée : épingle
-        pinTooltip();
-      }
-    } else {
-      lastCtrlTs = now;
-    }
-  });
+  // v2026.5.40 r18 : raccourci double-Ctrl pour épingler/désépingler RETIRÉ
+  // (peu utilisé, source de confusion). Pour épingler : clic sur la card /
+  // mini-card ou bouton 📌 du tooltip. Pour désépingler : bouton 📍 du popup.
 
   // v4.1.13 : clic sur le bouton 📌 ou ↻ (bouton d'action de la bulle)
   el.addEventListener("click", (e) => {
@@ -9578,6 +9976,17 @@ function bindTooltipInteractions() {
       const actionId = btn.dataset.actionId;
       const kind = btn.dataset.kind || "absence";
       _triggerDeleteItem(actionId, kind, btn);
+    } else if (action === "open-fiche") {
+      // v2026.5.40 r18 : clic sur la référence → ouvre la fiche EV
+      e.preventDefault();
+      e.stopPropagation();
+      const iv = state.currentTooltipIv;
+      if (iv && iv.formLink && state.session) {
+        const url = state.session.origin + "/index.php?" + iv.formLink
+                  + "&PHPSESSID=" + encodeURIComponent(state.session.phpsessid);
+        const background = !!(e.ctrlKey || e.metaKey || e.button === 1);
+        window.open(url, "_blank", background ? "noopener" : "noopener");
+      }
     }
   });
 
@@ -9686,17 +10095,21 @@ function buildTooltipHTML(iv) {
 
   if (iv.ref) {
     rows.push(`<hr>`);
-    // v4.1.15 : ref avec bouton copier inline
+    // v2026.5.40 r18 : la référence devient cliquable pour ouvrir la fiche EV.
+    // Plus besoin du message "Cliquer pour ouvrir" — la ref est maintenant
+    // un lien stylé (souligné + couleur accent + cursor pointer).
     const refSafe = escapeHtml(iv.ref);
-    rows.push(`<dt>Référence</dt><dd class="tt-ref-cell"><span class="tt-ref-val">${refSafe}</span><button class="tt-copy-btn" data-action="copy-ref" data-ref="${refSafe}" title="Copier la référence">📋</button></dd>`);
+    const canOpen = !iv.ghost && !!iv.formLink;
+    if (canOpen) {
+      rows.push(`<dt>Référence</dt><dd class="tt-ref-cell"><a href="#" class="tt-ref-link" data-action="open-fiche" title="Ouvrir la fiche dans EasyVista">${refSafe}</a><button class="tt-copy-btn" data-action="copy-ref" data-ref="${refSafe}" title="Copier la référence">📋</button></dd>`);
+    } else {
+      rows.push(`<dt>Référence</dt><dd class="tt-ref-cell"><span class="tt-ref-val">${refSafe}</span><button class="tt-copy-btn" data-action="copy-ref" data-ref="${refSafe}" title="Copier la référence">📋</button></dd>`);
+    }
   }
 
   if (iv.ghost) {
     rows.push(`<hr>`);
     rows.push(`<dt>⚠</dt><dd>Intervention disparue d'EasyVista (clôturée, déplacée ou annulée)</dd>`);
-  } else if (iv.formLink) {
-    rows.push(`<hr>`);
-    rows.push(`<dt></dt><dd style="color:var(--text-faint);font-size:11px">Cliquer pour ouvrir la fiche</dd>`);
   }
 
   // v2026.5.21 : icône épingle adaptative
@@ -9806,8 +10219,11 @@ function highlightIntervention(cardEl, ivIdx, on) {
   const row = cardEl.querySelector(`.intervention-v2[data-iv-idx="${ivIdx}"]`)
            || cardEl.querySelector(`.intervention[data-iv-idx="${ivIdx}"]`);
   const slot = cardEl.querySelector(`.timeline-slot[data-iv-idx="${ivIdx}"]`);
+  // v2026.5.40 r3 : highlight aussi la mini-card en vue horizontale
+  const miniCard = cardEl.querySelector(`.iv-mini-card[data-iv-idx="${ivIdx}"]`);
   if (row) row.classList.toggle("highlight", on);
   if (slot) slot.classList.toggle("highlight", on);
+  if (miniCard) miniCard.classList.toggle("highlight", on);
 
   // v2026.5.29 : quand on active le highlight (typiquement depuis un slot
   // timeline), faire scroller la row dans la vue pour que l'user voie la