fix(v14-bis): drag handle overlay + toggle gauche + manifeste preview + scrollbar visible + couleurs attenuees + 2e logo insta

FIX 1 drag handle : overlay full-screen z-9998 capture mouseup garanti
  (iframe AEP capturait les events — overlay au-dessus de tout au mousedown)
FIX 2 toggle gauche : minmax(0,1fr) + visibility hidden au lieu de display:none
  (conflit display:none + width:0 effondrait la col centre quand 2 cols togglees)
FIX 3 manifeste preview : slot flex-col + astro-island display:block
  (display:contents masquait astro-island au flex layout, preview ne s'inserait pas)
FIX 4 scrollbar visible : overflow-y:auto + scrollbar-color custom #94A3B8
  (style WebKit + Firefox uniquement quand data-preview-open=true)
FIX 5 couleurs attenuees : data-muted #C8867E/#8F9A78/#7B848E/#566375 + texte encre
FIX 6 Insta x2 : @aep.politique + @julesneny avec aria-labels et titles distincts
FIX 7 SVG Insta : path simple (camera carree + lentille) au lieu du path complexe

src/components/astro/ColCentre.astro

@@ -104,8 +104,12 @@ import PreviewArticle from '../vue/PreviewArticle.vue';
        Pas de border ici - PreviewArticle.vue gere son propre conteneur.
        shrink-0 pour preserver sa taille auto, sinon flex pourrait l'ecraser.
        V1.4-E1 : client:load (vs client:visible) pour garantir hydration immediate des listeners
-                  'preview-open' / 'journal-item-click' (le v-if rendait l'observer aveugle). -->
-  <div id="col-centre-preview-slot" class="shrink-0" style="display: contents;">
+                  'preview-open' / 'journal-item-click' (le v-if rendait l'observer aveugle).
+       V1.4-bis FIX 3 : le wrapper en display:contents masquait l'astro-island au flex layout.
+       On passe en flex container explicite (column) + l'astro-island prend display:block.
+       Quand mode=null, PreviewArticle renvoie rien → le slot ne prend pas de hauteur.
+       Quand mode=manifeste/article, le slot grandit pour contenir la preview. -->
+  <div id="col-centre-preview-slot" class="shrink-0 flex flex-col">
     <PreviewArticle client:load />
   </div>
 
@@ -122,6 +126,36 @@ import PreviewArticle from '../vue/PreviewArticle.vue';
   </section>
 </div>
 
+<style>
+  /* V1.4-bis FIX 3 : force l'astro-island a se comporter comme block dans le slot preview,
+     sinon le default inline empeche le contenu Vue (border + bg) de se rendre correctement
+     dans le flex column de la col centre. */
+  #col-centre-preview-slot > astro-island {
+    display: block;
+    width: 100%;
+  }
+  /* V1.4-bis FIX 4 : scrollbar visible sur la col centre quand preview ouverte
+     (overflow:auto au lieu de natif fin qui se cache). Style WebKit + Firefox. */
+  #col-centre-grid[data-preview-open="true"] {
+    scrollbar-width: thin;
+    scrollbar-color: #94A3B8 #FAFAF7;
+  }
+  #col-centre-grid[data-preview-open="true"]::-webkit-scrollbar {
+    width: 10px;
+  }
+  #col-centre-grid[data-preview-open="true"]::-webkit-scrollbar-track {
+    background: #FAFAF7;
+  }
+  #col-centre-grid[data-preview-open="true"]::-webkit-scrollbar-thumb {
+    background: #94A3B8;
+    border-radius: 5px;
+    border: 2px solid #FAFAF7;
+  }
+  #col-centre-grid[data-preview-open="true"]::-webkit-scrollbar-thumb:hover {
+    background: #64748B;
+  }
+</style>
+
 <script>
   // Poignee repli zone HAUT (mobile only) + toggle desktop V1.4-C2
   const grid = document.getElementById('col-centre-grid');
@@ -256,10 +290,18 @@ import PreviewArticle from '../vue/PreviewArticle.vue';
     let startHautH = 0;
     let containerH = 0;
 
-    // V1.4-D : fix drag handle qui ne se "decliquait" pas au mouseup.
-    // - Listeners poses sur window (vs document) pour capter les events meme si la souris quitte l'iframe
-    // - Ajout mouseleave/blur/pointerup pour robustesse cross-browser / cross-flow utilisateur
-    // - Desactive aussi les transitions CSS pendant le drag (pas de lag visuel) puis restaure
+    // V1.4-bis FIX 1 : overlay full-screen pendant drag.
+    // ROOT CAUSE : l'iframe AEP (EmbedDynamique) capture les pointer events des qu'on
+    // depasse sa zone — mouseup tombe dans l'iframe et n'arrive jamais au parent window.
+    // SOLUTION : creer un <div fixed inset-0 z-9998> AU MOMENT DU mousedown, qui
+    // intercepte tous les events (mousemove + mouseup) pendant le drag. Au mouseup,
+    // on retire l'overlay. Garantie : peu importe ce qu'il y a en dessous (iframe,
+    // Vue island, browser chrome), l'overlay capte la fin du drag.
+    const overlayDuringDrag = document.createElement('div');
+    overlayDuringDrag.style.cssText = 'position:fixed;inset:0;z-index:9998;cursor:row-resize;display:none;background:transparent;';
+    overlayDuringDrag.setAttribute('aria-hidden', 'true');
+    document.body.appendChild(overlayDuringDrag);
+
     dragHandle.addEventListener('mousedown', (e: MouseEvent) => {
       if (grid.dataset.previewOpen === 'true') return;
       if (sessionStorage.getItem('tf-haut-replie') === 'true') return;
@@ -273,6 +315,8 @@ import PreviewArticle from '../vue/PreviewArticle.vue';
       // Suspend transitions pendant drag pour responsivite
       haut.style.transition = 'none';
       bas.style.transition = 'none';
+      // Active l'overlay : capture tous les events tant qu'on draggue
+      overlayDuringDrag.style.display = 'block';
       e.preventDefault();
     });
 
@@ -289,6 +333,8 @@ import PreviewArticle from '../vue/PreviewArticle.vue';
     const stopDrag = () => {
       if (!isDragging) return;
       isDragging = false;
+      // Retire l'overlay (rend le reste de la page de nouveau interactif)
+      overlayDuringDrag.style.display = 'none';
       document.body.style.cursor = '';
       document.body.style.userSelect = '';
       // Restaure transitions
@@ -306,13 +352,16 @@ import PreviewArticle from '../vue/PreviewArticle.vue';
       }
     };
 
-    // Listeners multiples sur window pour couvrir tous les cas (sortie iframe, perte focus, etc.)
-    window.addEventListener('mousemove', onMouseMove);
+    // V1.4-bis : ecoute mousemove + mouseup SUR L'OVERLAY (le plus haut z-index garantit capture).
+    overlayDuringDrag.addEventListener('mousemove', onMouseMove);
+    overlayDuringDrag.addEventListener('mouseup', stopDrag);
+    overlayDuringDrag.addEventListener('pointerup', stopDrag);
+    overlayDuringDrag.addEventListener('mouseleave', stopDrag);
+    // Backup window listeners (pour le cas tres rare ou l'overlay n'aurait pas pris le focus)
     window.addEventListener('mouseup', stopDrag);
     window.addEventListener('pointerup', stopDrag);
-    window.addEventListener('mouseleave', stopDrag);
     window.addEventListener('blur', stopDrag);
-    // Si on rentre dans la fenetre sans bouton souris enfonce, on stoppe (l'user a relache hors-page)
+    // Si la souris revient dans la fenetre sans bouton enfonce, on stoppe
     window.addEventListener('mouseenter', (e: MouseEvent) => {
       if (isDragging && e.buttons === 0) stopDrag();
     });