From d40ed210b4dad09c8d54a8a463cd09ebc5fab859 Mon Sep 17 00:00:00 2001
From: arussac <antoninrussac1@gmail.com>
Date: Sat, 23 May 2026 17:26:48 +0200
Subject: [PATCH] =?UTF-8?q?maquettes=20:=20chat=203=20versions=20=C3=A0=20?=
 =?UTF-8?q?valider?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 maquettes/chat/v1.svg | 368 ++++++++++++++++++++++++++++++++++++++++++
 maquettes/chat/v2.svg | 187 +++++++++++++++++++++
 maquettes/chat/v3.svg | 239 +++++++++++++++++++++++++++
 3 files changed, 794 insertions(+)
 create mode 100644 maquettes/chat/v1.svg
 create mode 100644 maquettes/chat/v2.svg
 create mode 100644 maquettes/chat/v3.svg

diff --git a/maquettes/chat/v1.svg b/maquettes/chat/v1.svg
new file mode 100644
index 0000000..a5eff57
--- /dev/null
+++ b/maquettes/chat/v1.svg
@@ -0,0 +1,368 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1280 720" width="1280" height="720">
+<!--
+  v5 — Vue complète / Version la plus aboutie
+  Tous les éléments visibles : pub, chat avec IPs colorisées,
+  effets néon, menu fermé avec badge, champ de saisie stylisé
+-->
+<defs>
+  <style>
+    .mono { font-family: 'Courier New', Courier, monospace; }
+    .sans { font-family: Arial, Helvetica, sans-serif; }
+    .msg  { font-family: Arial, Helvetica, sans-serif; font-size: 13px; fill: #c0c0c0; }
+    .ts   { font-family: 'Courier New', Courier, monospace; font-size: 10px; fill: #2e2e2e; }
+  </style>
+
+  <!-- Gradient fond -->
+  <linearGradient id="bg" x1="0" y1="0" x2="1" y2="1">
+    <stop offset="0%" stop-color="#0a0a0e"/>
+    <stop offset="100%" stop-color="#0c0c0e"/>
+  </linearGradient>
+
+  <!-- Gradient header -->
+  <linearGradient id="hdr" x1="0" y1="0" x2="1" y2="0">
+    <stop offset="0%" stop-color="#0e0e18"/>
+    <stop offset="50%" stop-color="#111118"/>
+    <stop offset="100%" stop-color="#0e0e18"/>
+  </linearGradient>
+
+  <!-- Gradient input -->
+  <linearGradient id="inp" x1="0" y1="0" x2="0" y2="1">
+    <stop offset="0%" stop-color="#1a1a24"/>
+    <stop offset="100%" stop-color="#141418"/>
+  </linearGradient>
+
+  <!-- Gradient barre pub -->
+  <linearGradient id="pub-bg" x1="0" y1="0" x2="1" y2="0">
+    <stop offset="0%" stop-color="#0e0e0e"/>
+    <stop offset="100%" stop-color="#111111"/>
+  </linearGradient>
+
+  <!-- Filtres glow -->
+  <filter id="glow-c" x="-40%" y="-40%" width="180%" height="180%">
+    <feGaussianBlur stdDeviation="4"/>
+  </filter>
+  <filter id="glow-m" x="-40%" y="-40%" width="180%" height="180%">
+    <feGaussianBlur stdDeviation="4"/>
+  </filter>
+  <filter id="glow-g" x="-40%" y="-40%" width="180%" height="180%">
+    <feGaussianBlur stdDeviation="3.5"/>
+  </filter>
+  <filter id="glow-o" x="-40%" y="-40%" width="180%" height="180%">
+    <feGaussianBlur stdDeviation="3"/>
+  </filter>
+  <filter id="glow-title" x="-30%" y="-30%" width="160%" height="160%">
+    <feGaussianBlur stdDeviation="6"/>
+  </filter>
+  <filter id="glow-btn" x="-30%" y="-30%" width="160%" height="160%">
+    <feGaussianBlur stdDeviation="5"/>
+  </filter>
+  <filter id="glow-menu" x="-50%" y="-50%" width="200%" height="200%">
+    <feGaussianBlur stdDeviation="2"/>
+  </filter>
+
+  <!-- Badge menu -->
+  <filter id="badge-glow" x="-50%" y="-50%" width="200%" height="200%">
+    <feGaussianBlur stdDeviation="2"/>
+  </filter>
+</defs>
+
+<!-- ══ FOND PRINCIPAL ══ -->
+<rect width="1280" height="720" fill="url(#bg)"/>
+
+<!-- Scanlines subtiles -->
+<rect width="1280" height="720" fill="none" stroke="#ffffff" stroke-width="0" opacity="0.02">
+  <animate attributeName="y" values="0;720" dur="8s" repeatCount="indefinite"/>
+</rect>
+
+<!-- ══════════════════════════════════════════
+     BANDE PUBLICITAIRE GAUCHE  130px
+     ══════════════════════════════════════════ -->
+<rect x="0" y="0" width="130" height="720" fill="url(#pub-bg)" stroke="#1e1e24" stroke-width="1"/>
+<!-- Ligne décorative droite -->
+<line x1="129" y1="0" x2="129" y2="720" stroke="#1a1a22" stroke-width="2"/>
+<line x1="127" y1="0" x2="127" y2="720" stroke="#0e0e12" stroke-width="1"/>
+
+<!-- Label pub discret -->
+<rect x="25" y="5" width="80" height="12" fill="#0e0e10" rx="6"/>
+<text x="65" y="15" fill="#2a2a38" text-anchor="middle" class="sans" font-size="8">PUB</text>
+
+<!-- ── Ad 1 : NOVA STORE ── -->
+<rect x="4" y="22" width="122" height="190" fill="#111116" stroke="#1e1e28" rx="4"/>
+<rect x="4" y="22" width="122" height="54" fill="#141420" rx="4"/>
+<!-- Trait déco haut -->
+<line x1="4" y1="75" x2="126" y2="75" stroke="#1a1a28" stroke-width="1"/>
+<!-- Titre ad avec subtle glow violet -->
+<text x="65" y="46" fill="#3333aa" text-anchor="middle" class="sans" font-size="14" font-weight="bold" filter="url(#glow-c)" opacity="0.5">NOVA</text>
+<text x="65" y="46" fill="#5566cc" text-anchor="middle" class="sans" font-size="14" font-weight="bold">NOVA</text>
+<text x="65" y="64" fill="#333355" text-anchor="middle" class="sans" font-size="9" letter-spacing="2">STORE 2026</text>
+<rect x="12" y="82" width="106" height="68" fill="#0c0c12" rx="2" stroke="#1a1a24"/>
+<text x="65" y="120" fill="#2a2a88" text-anchor="middle" class="sans" font-size="28">&#128722;</text>
+<rect x="20" y="160" width="90" height="24" fill="#181828" rx="12" stroke="#222235"/>
+<text x="65" y="176" fill="#4444aa" text-anchor="middle" class="sans" font-size="10">DÉCOUVRIR &#8594;</text>
+<text x="65" y="202" fill="#222232" text-anchor="middle" class="sans" font-size="8">nova-store.io</text>
+
+<!-- ── Ad 2 : APEX GEAR ── -->
+<rect x="4" y="220" width="122" height="190" fill="#0e120e" stroke="#1a241a" rx="4"/>
+<rect x="4" y="220" width="122" height="54" fill="#101810" rx="4"/>
+<line x1="4" y1="273" x2="126" y2="273" stroke="#182018" stroke-width="1"/>
+<text x="65" y="244" fill="#2a6633" text-anchor="middle" class="sans" font-size="13" font-weight="bold" filter="url(#glow-g)" opacity="0.5">APEX GEAR</text>
+<text x="65" y="244" fill="#44bb55" text-anchor="middle" class="sans" font-size="13" font-weight="bold">APEX GEAR</text>
+<text x="65" y="262" fill="#224422" text-anchor="middle" class="sans" font-size="9" letter-spacing="1">GAMING SETUP</text>
+<rect x="12" y="280" width="106" height="68" fill="#0a0e0a" rx="2" stroke="#182018"/>
+<text x="65" y="318" fill="#226622" text-anchor="middle" class="sans" font-size="28">&#127918;</text>
+<rect x="20" y="358" width="90" height="24" fill="#142014" rx="12" stroke="#1e2e1e"/>
+<text x="65" y="374" fill="#44aa44" text-anchor="middle" class="sans" font-size="10">ACHETER &#8594;</text>
+<text x="65" y="400" fill="#1a2a1a" text-anchor="middle" class="sans" font-size="8">apex-gear.com</text>
+
+<!-- ── Ad 3 : SHIELDVPN ── -->
+<rect x="4" y="418" width="122" height="190" fill="#0e0e16" stroke="#1a1a26" rx="4"/>
+<rect x="4" y="418" width="122" height="54" fill="#111020" rx="4"/>
+<line x1="4" y1="471" x2="126" y2="471" stroke="#181828" stroke-width="1"/>
+<text x="65" y="442" fill="#552288" text-anchor="middle" class="sans" font-size="12" font-weight="bold" filter="url(#glow-m)" opacity="0.5">SHIELDVPN</text>
+<text x="65" y="442" fill="#8844cc" text-anchor="middle" class="sans" font-size="12" font-weight="bold">SHIELDVPN</text>
+<text x="65" y="460" fill="#331155" text-anchor="middle" class="sans" font-size="9" letter-spacing="1">SÉCURITÉ TOTALE</text>
+<rect x="12" y="478" width="106" height="68" fill="#0a0810" rx="2" stroke="#181824"/>
+<text x="65" y="516" fill="#441188" text-anchor="middle" class="sans" font-size="28">&#128274;</text>
+<rect x="12" y="556" width="106" height="24" fill="#1a0a28" rx="12" stroke="#221230"/>
+<text x="65" y="572" fill="#9944dd" text-anchor="middle" class="sans" font-size="9">ESSAI GRATUIT &#8594;</text>
+<text x="65" y="598" fill="#221132" text-anchor="middle" class="sans" font-size="8">shieldvpn.net</text>
+
+<!-- ══════════════════════════════════════════
+     TOGGLE MENU DROIT  35px (avec badge)
+     ══════════════════════════════════════════ -->
+<rect x="1245" y="0" width="35" height="720" fill="#0e0e14" stroke="#1a1a22" stroke-width="1"/>
+<line x1="1246" y1="0" x2="1246" y2="720" stroke="#1a1a2a" stroke-width="2"/>
+
+<!-- Hamburger stylisé -->
+<line x1="1253" y1="20" x2="1272" y2="20" stroke="#4a4a6a" stroke-width="2" stroke-linecap="round"/>
+<line x1="1256" y1="28" x2="1272" y2="28" stroke="#4a4a6a" stroke-width="1.5" stroke-linecap="round"/>
+<line x1="1253" y1="36" x2="1272" y2="36" stroke="#4a4a6a" stroke-width="2" stroke-linecap="round"/>
+
+<!-- Badge notification (point rouge) -->
+<circle cx="1271" cy="16" r="5" fill="#880000" filter="url(#badge-glow)" opacity="0.8"/>
+<circle cx="1271" cy="16" r="4" fill="#cc2222"/>
+<circle cx="1271" cy="16" r="2" fill="#ff4444"/>
+<text x="1271" y="20" fill="#ffffff" text-anchor="middle" class="sans" font-size="6" font-weight="bold">3</text>
+
+<!-- Étiquettes verticales options (petit texte rotatif) -->
+<text x="1262" y="120" fill="#2a2a44" class="sans" font-size="8" text-anchor="middle" transform="rotate(90,1262,120)">Paramètres</text>
+<text x="1262" y="240" fill="#2a2a44" class="sans" font-size="8" text-anchor="middle" transform="rotate(90,1262,240)">Shop</text>
+<text x="1262" y="380" fill="#2a2a44" class="sans" font-size="8" text-anchor="middle" transform="rotate(90,1262,380)">Mes données</text>
+
+<!-- ══════════════════════════════════════════
+     ZONE CHAT PRINCIPALE  1115px
+     ══════════════════════════════════════════ -->
+<rect x="130" y="0" width="1115" height="720" fill="#090910"/>
+
+<!-- ── EN-TÊTE enrichi ── -->
+<rect x="130" y="0" width="1115" height="58" fill="url(#hdr)" stroke="#1e1e2a" stroke-width="1"/>
+<!-- Séparateur lumineux sous le header -->
+<line x1="130" y1="58" x2="1245" y2="58" stroke="#222233" stroke-width="1"/>
+<line x1="130" y1="57" x2="1245" y2="57" stroke="#2a2a44" stroke-width="0.5" opacity="0.5"/>
+
+<!-- Logo / titre avec glow -->
+<text x="155" y="26" fill="#0066aa" class="sans" font-size="20" font-weight="bold" filter="url(#glow-title)" opacity="0.8">XIP</text>
+<text x="155" y="26" fill="#00aaee" class="sans" font-size="20" font-weight="bold">XIP</text>
+<line x1="185" y1="12" x2="185" y2="46" stroke="#222233" stroke-width="1"/>
+<text x="196" y="24" fill="#ccccdd" class="sans" font-size="14" font-weight="bold">Chat Public</text>
+<text x="196" y="42" fill="#3a3a55" class="sans" font-size="11">canal : <tspan fill="#4a4a77"># général</tspan></text>
+
+<!-- Indicateur de connexion animé -->
+<circle cx="420" cy="29" r="6" fill="#003300" stroke="#006600" stroke-width="1"/>
+<circle cx="420" cy="29" r="4" fill="#00ff44" filter="url(#glow-g)" opacity="0.6"/>
+<circle cx="420" cy="29" r="3" fill="#00ff88"/>
+<text x="434" y="27" fill="#33aa44" class="sans" font-size="12">312 en ligne</text>
+<text x="434" y="42" fill="#2a3a2a" class="sans" font-size="10">pic journalier : 1 204</text>
+
+<!-- Barre de recherche (déco) -->
+<rect x="700" y="14" width="200" height="28" fill="#141420" stroke="#222232" rx="14"/>
+<text x="720" y="31" fill="#2a2a44" class="sans" font-size="11">&#128269; Rechercher...</text>
+
+<!-- Heure / date -->
+<text x="940" y="24" fill="#2a2a40" class="mono" font-size="10">ven. 23 mai 2026</text>
+<text x="940" y="40" fill="#3a3a5a" class="mono" font-size="12">17:48</text>
+
+<!-- ── MESSAGES ── -->
+<!-- Ligne: y_ip, y_msg, séparateur à y_msg+9 -->
+
+<!-- 1: 192.168.1.45 (gris standard) -->
+<text x="155" y="80" fill="#606080" class="mono" font-size="12" font-weight="bold">192.168.1.45</text>
+<text x="279" y="80" class="ts">17:42</text>
+<text x="155" y="97" class="msg">Salut tout le monde !</text>
+<line x1="148" y1="106" x2="1230" y2="106" stroke="#141420" stroke-width="1"/>
+
+<!-- 2: 172.16.254.1 (CYAN — haut rang) -->
+<!-- Barre latérale cyan -->
+<rect x="143" y="115" width="3" height="44" fill="#004466" rx="1.5"/>
+<rect x="143" y="115" width="3" height="44" fill="#00ccff" rx="1.5" filter="url(#glow-c)" opacity="0.6"/>
+<text x="155" y="119" fill="#007799" class="mono" font-size="12" font-weight="bold" filter="url(#glow-c)" opacity="0.6">172.16.254.1</text>
+<text x="155" y="119" fill="#00ddff" class="mono" font-size="12" font-weight="bold">172.16.254.1</text>
+<!-- Badge rang -->
+<rect x="266" y="109" width="30" height="13" fill="#003344" rx="6" stroke="#006688"/>
+<text x="281" y="120" fill="#00ccff" text-anchor="middle" class="sans" font-size="7" font-weight="bold">TOP 5</text>
+<text x="306" y="119" class="ts">17:43</text>
+<text x="155" y="136" class="msg">Vous avez vu les nouveautés du shop ce soir ? Y'a des trucs ouf</text>
+<line x1="148" y1="145" x2="1230" y2="145" stroke="#141420" stroke-width="1"/>
+
+<!-- 3: 10.0.0.187 (gris) -->
+<text x="155" y="163" fill="#606080" class="mono" font-size="12" font-weight="bold">10.0.0.187</text>
+<text x="253" y="163" class="ts">17:43</text>
+<text x="155" y="180" class="msg">Ouais j'ai check, les prix sont vraiment corrects cette fois</text>
+<line x1="148" y1="189" x2="1230" y2="189" stroke="#141420" stroke-width="1"/>
+
+<!-- 4: 203.0.113.42 (ORANGE) -->
+<rect x="143" y="198" width="3" height="32" fill="#663300" rx="1.5"/>
+<rect x="143" y="198" width="3" height="32" fill="#ff8800" rx="1.5" filter="url(#glow-o)" opacity="0.5"/>
+<text x="155" y="202" fill="#994400" class="mono" font-size="12" font-weight="bold" filter="url(#glow-o)" opacity="0.6">203.0.113.42</text>
+<text x="155" y="202" fill="#ff8844" class="mono" font-size="12" font-weight="bold">203.0.113.42</text>
+<text x="279" y="202" class="ts">17:44</text>
+<text x="155" y="219" class="msg">lol ça spam trop ce soir 😂</text>
+<line x1="148" y1="228" x2="1230" y2="228" stroke="#141420" stroke-width="1"/>
+
+<!-- 5: 10.10.10.99 (MAGENTA) -->
+<rect x="143" y="237" width="3" height="44" fill="#660044" rx="1.5"/>
+<rect x="143" y="237" width="3" height="44" fill="#ff00aa" rx="1.5" filter="url(#glow-m)" opacity="0.5"/>
+<text x="155" y="241" fill="#880055" class="mono" font-size="12" font-weight="bold" filter="url(#glow-m)" opacity="0.6">10.10.10.99</text>
+<text x="155" y="241" fill="#ff44cc" class="mono" font-size="12" font-weight="bold">10.10.10.99</text>
+<rect x="254" y="231" width="38" height="13" fill="#330022" rx="6" stroke="#660044"/>
+<text x="273" y="242" fill="#ff00aa" text-anchor="middle" class="sans" font-size="7" font-weight="bold">VIP</text>
+<text x="302" y="241" class="ts">17:44</text>
+<text x="155" y="258" class="msg">@203.0.113.42 t'as raison mais c'est le fun quand même 🔥</text>
+<line x1="148" y1="267" x2="1230" y2="267" stroke="#141420" stroke-width="1"/>
+
+<!-- 6: 192.168.1.1 (gris) -->
+<text x="155" y="285" fill="#606080" class="mono" font-size="12" font-weight="bold">192.168.1.1</text>
+<text x="249" y="285" class="ts">17:45</text>
+<text x="155" y="302" class="msg">Le chat est vraiment actif ce soir, j'adore</text>
+<line x1="148" y1="311" x2="1230" y2="311" stroke="#141420" stroke-width="1"/>
+
+<!-- 7: 172.31.0.5 (VERT) -->
+<rect x="143" y="320" width="3" height="44" fill="#005522" rx="1.5"/>
+<rect x="143" y="320" width="3" height="44" fill="#00ff77" rx="1.5" filter="url(#glow-g)" opacity="0.5"/>
+<text x="155" y="324" fill="#007733" class="mono" font-size="12" font-weight="bold" filter="url(#glow-g)" opacity="0.6">172.31.0.5</text>
+<text x="155" y="324" fill="#00ee77" class="mono" font-size="12" font-weight="bold">172.31.0.5</text>
+<text x="247" y="324" class="ts">17:45</text>
+<text x="155" y="341" class="msg">Drop de demain va être énorme 🔥 j'ai les infos du shop en avance</text>
+<line x1="148" y1="350" x2="1230" y2="350" stroke="#141420" stroke-width="1"/>
+
+<!-- 8: 10.0.0.253 (gris) -->
+<text x="155" y="368" fill="#606080" class="mono" font-size="12" font-weight="bold">10.0.0.253</text>
+<text x="252" y="368" class="ts">17:45</text>
+<text x="155" y="385" class="msg">Quelqu'un sait comment configurer le stream OBS ?</text>
+<line x1="148" y1="394" x2="1230" y2="394" stroke="#141420" stroke-width="1"/>
+
+<!-- 9: 192.168.1.45 (réponse, gris) -->
+<text x="155" y="412" fill="#606080" class="mono" font-size="12" font-weight="bold">192.168.1.45</text>
+<text x="279" y="412" class="ts">17:46</text>
+<text x="155" y="429" class="msg">Vérife dans Paramètres &#x2192; onglet Diffusion &#x2192; Bitrate</text>
+<line x1="148" y1="438" x2="1230" y2="438" stroke="#141420" stroke-width="1"/>
+
+<!-- 10: 172.16.254.1 (CYAN) -->
+<rect x="143" y="447" width="3" height="32" fill="#004466" rx="1.5"/>
+<rect x="143" y="447" width="3" height="32" fill="#00ccff" rx="1.5" filter="url(#glow-c)" opacity="0.5"/>
+<text x="155" y="451" fill="#007799" class="mono" font-size="12" font-weight="bold" filter="url(#glow-c)" opacity="0.5">172.16.254.1</text>
+<text x="155" y="451" fill="#00ddff" class="mono" font-size="12" font-weight="bold">172.16.254.1</text>
+<text x="306" y="451" class="ts">17:47</text>
+<text x="155" y="468" class="msg">Sérieux ? T'as accès aux infos du shop en avant-première ?</text>
+<line x1="148" y1="477" x2="1230" y2="477" stroke="#141420" stroke-width="1"/>
+
+<!-- 11: 10.10.10.99 (MAGENTA) -->
+<rect x="143" y="486" width="3" height="32" fill="#660044" rx="1.5"/>
+<rect x="143" y="486" width="3" height="32" fill="#ff00aa" rx="1.5" filter="url(#glow-m)" opacity="0.4"/>
+<text x="155" y="490" fill="#880055" class="mono" font-size="12" font-weight="bold" filter="url(#glow-m)" opacity="0.5">10.10.10.99</text>
+<text x="155" y="490" fill="#ff44cc" class="mono" font-size="12" font-weight="bold">10.10.10.99</text>
+<text x="302" y="490" class="ts">17:47</text>
+<text x="155" y="507" class="msg">Pas accès officiel mais j'ai des sources bien placées 😏</text>
+<line x1="148" y1="516" x2="1230" y2="516" stroke="#141420" stroke-width="1"/>
+
+<!-- 12: 192.168.100.2 (gris) -->
+<text x="155" y="534" fill="#606080" class="mono" font-size="12" font-weight="bold">192.168.100.2</text>
+<text x="271" y="534" class="ts">17:48</text>
+<text x="155" y="551" class="msg">Quel canal pour les annonces du shop ?</text>
+<line x1="148" y1="560" x2="1230" y2="560" stroke="#141420" stroke-width="1"/>
+
+<!-- 13: 203.0.113.42 (ORANGE) -->
+<rect x="143" y="569" width="3" height="32" fill="#663300" rx="1.5"/>
+<rect x="143" y="569" width="3" height="32" fill="#ff8800" rx="1.5" filter="url(#glow-o)" opacity="0.4"/>
+<text x="155" y="573" fill="#994400" class="mono" font-size="12" font-weight="bold" filter="url(#glow-o)" opacity="0.5">203.0.113.42</text>
+<text x="155" y="573" fill="#ff8844" class="mono" font-size="12" font-weight="bold">203.0.113.42</text>
+<text x="279" y="573" class="ts">17:48</text>
+<text x="155" y="590" class="msg">Y'a un canal #shop mais c'est souvent silencieux 🤐</text>
+
+<!-- ══ PUB GAMBLING (droite, lumineux) ══ -->
+<defs>
+  <filter id="glow-red-gb" x="-40%" y="-40%" width="180%" height="180%">
+    <feGaussianBlur stdDeviation="5"/>
+  </filter>
+  <filter id="glow-gold-gb" x="-40%" y="-40%" width="180%" height="180%">
+    <feGaussianBlur stdDeviation="5"/>
+  </filter>
+</defs>
+<!-- Fond + bordure néon rouge -->
+<rect x="966" y="162" width="248" height="258" fill="#100400"/>
+<rect x="966" y="162" width="248" height="258" fill="none" stroke="#ff2200" stroke-width="3" rx="6" filter="url(#glow-red-gb)" opacity="0.9"/>
+<rect x="966" y="162" width="248" height="258" fill="none" stroke="#ff4422" stroke-width="1.5" rx="6"/>
+<!-- Header rouge -->
+<rect x="966" y="162" width="248" height="54" fill="#1a0400" rx="6"/>
+<text x="1090" y="186" fill="#aa2200" text-anchor="middle" class="sans" font-size="15" font-weight="bold" filter="url(#glow-red-gb)" opacity="0.9">&#9824; CASINO LUCKY &#9824;</text>
+<text x="1090" y="186" fill="#ff5533" text-anchor="middle" class="sans" font-size="15" font-weight="bold">&#9824; CASINO LUCKY &#9824;</text>
+<text x="1090" y="204" fill="#882200" text-anchor="middle" class="sans" font-size="9" letter-spacing="2">OFFRE EXCLUSIVE</text>
+<line x1="966" y1="216" x2="1214" y2="216" stroke="#440000" stroke-width="1"/>
+<!-- +200% or néon -->
+<text x="1090" y="262" fill="#996600" text-anchor="middle" class="sans" font-size="32" font-weight="bold" filter="url(#glow-gold-gb)" opacity="0.9">+200%</text>
+<text x="1090" y="262" fill="#ffdd00" text-anchor="middle" class="sans" font-size="32" font-weight="bold">+200%</text>
+<text x="1090" y="282" fill="#cc6600" text-anchor="middle" class="sans" font-size="11">sur votre 1er dépôt &#x2022; 500&#x20AC; max</text>
+<!-- 7 7 7 avec suits -->
+<text x="980" y="336" fill="#ff8800" class="sans" font-size="26" filter="url(#glow-red-gb)" opacity="0.5">&#9830;</text>
+<text x="980" y="336" fill="#ffaa44" class="sans" font-size="26">&#9830;</text>
+<text x="1030" y="338" fill="#ffdd00" class="sans" font-size="30" font-weight="bold" filter="url(#glow-gold-gb)" opacity="0.6">7</text>
+<text x="1030" y="338" fill="#ffffff" class="sans" font-size="30" font-weight="bold">7</text>
+<text x="1070" y="338" fill="#ffdd00" class="sans" font-size="30" font-weight="bold" filter="url(#glow-gold-gb)" opacity="0.6">7</text>
+<text x="1070" y="338" fill="#ffffff" class="sans" font-size="30" font-weight="bold">7</text>
+<text x="1110" y="338" fill="#ffdd00" class="sans" font-size="30" font-weight="bold" filter="url(#glow-gold-gb)" opacity="0.6">7</text>
+<text x="1110" y="338" fill="#ffffff" class="sans" font-size="30" font-weight="bold">7</text>
+<text x="1156" y="336" fill="#ff8800" class="sans" font-size="26" filter="url(#glow-red-gb)" opacity="0.5">&#9824;</text>
+<text x="1156" y="336" fill="#ffaa44" class="sans" font-size="26">&#9824;</text>
+<!-- CTA néon -->
+<rect x="976" y="349" width="228" height="38" fill="#220000" rx="19"/>
+<rect x="976" y="349" width="228" height="38" fill="none" stroke="#ff2200" stroke-width="1.5" rx="19" filter="url(#glow-red-gb)" opacity="0.8"/>
+<text x="1090" y="373" fill="#aa2200" text-anchor="middle" class="sans" font-size="13" font-weight="bold" filter="url(#glow-red-gb)" opacity="0.7">JOUER MAINTENANT &#x2192;</text>
+<text x="1090" y="373" fill="#ff4422" text-anchor="middle" class="sans" font-size="13" font-weight="bold">JOUER MAINTENANT &#x2192;</text>
+<!-- Disclaimer -->
+<text x="1090" y="411" fill="#440000" text-anchor="middle" class="sans" font-size="7">18+ &#x2022; Jeu responsable &#x2022; casino-lucky.bet</text>
+
+<!-- SCROLLBAR -->
+<rect x="1228" y="58" width="8" height="592" fill="#080810" stroke="#141420" stroke-width="1"/>
+<!-- Thumb scrollbar -->
+<rect x="1229" y="420" width="6" height="130" fill="#252535" rx="3"/>
+<rect x="1230" y="421" width="4" height="128" fill="#2e2e48" rx="2"/>
+
+<!-- ── ZONE DE SAISIE enrichie ── -->
+<rect x="130" y="650" width="1115" height="70" fill="#0e0e16" stroke="#1e1e2a" stroke-width="1"/>
+<!-- Trait lumineux en haut de la zone de saisie -->
+<line x1="130" y1="650" x2="1245" y2="650" stroke="#222238" stroke-width="1"/>
+<line x1="130" y1="651" x2="1245" y2="651" stroke="#2a2a44" stroke-width="0.5" opacity="0.4"/>
+
+<!-- Champ de saisie -->
+<rect x="175" y="660" width="930" height="48" fill="url(#inp)" stroke="#252538" stroke-width="1" rx="24"/>
+<!-- Reflet interne haut -->
+<rect x="176" y="661" width="928" height="6" fill="#ffffff" opacity="0.02" rx="24"/>
+
+<!-- Icône gauche (emoji/attachment) -->
+<text x="200" y="690" fill="#2a2a44" class="sans" font-size="16">&#128512;</text>
+<text x="228" y="690" fill="#222238" class="sans" font-size="16">&#128206;</text>
+
+<text x="260" y="690" fill="#252540" class="sans" font-size="13">Entrez un message...</text>
+
+<!-- Bouton envoi avec glow bleu-cyan -->
+<circle cx="1151" cy="684" r="22" fill="#001828" stroke="#003055" stroke-width="1"/>
+<circle cx="1151" cy="684" r="22" fill="#0066aa" filter="url(#glow-btn)" opacity="0.3"/>
+<!-- Flèche -->
+<polygon points="1142,679 1159,684 1142,689 1147,684" fill="#00aaee"/>
+<polygon points="1142,679 1159,684 1142,689 1147,684" fill="#00ddff" filter="url(#glow-btn)" opacity="0.5"/>
+
+<!-- Raccourcis bas de page -->
+<text x="175" y="712" fill="#1e1e2e" class="sans" font-size="9">Entrée pour envoyer · Maj+Entrée pour saut de ligne</text>
+<text x="1220" y="712" fill="#1e1e2e" text-anchor="end" class="sans" font-size="9">0/500</text>
+</svg>
diff --git a/maquettes/chat/v2.svg b/maquettes/chat/v2.svg
new file mode 100644
index 0000000..1435756
--- /dev/null
+++ b/maquettes/chat/v2.svg
@@ -0,0 +1,187 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1280 720" width="1280" height="720">
+<defs>
+  <style>
+    .mono { font-family: 'Courier New', Courier, monospace; }
+    .sans { font-family: Arial, Helvetica, sans-serif; }
+    .ip   { font-family: 'Courier New', Courier, monospace; font-size: 12px; font-weight: bold; fill: #7a7a7a; }
+    .ts   { font-family: 'Courier New', Courier, monospace; font-size: 10px; fill: #2e2e2e; }
+    .msg  { font-family: Arial, Helvetica, sans-serif; font-size: 13px; fill: #bababa; }
+    .sep  { stroke: #181818; stroke-width: 1; }
+  </style>
+</defs>
+
+<!-- ══ FOND ══ -->
+<rect width="1280" height="720" fill="#0d0d0d"/>
+
+<!-- ══════════════════════════════
+     BANDE PUB GAUCHE  130px
+     ══════════════════════════════ -->
+<rect x="0" y="0" width="130" height="720" fill="#111" stroke="#1a1a1a" stroke-width="1"/>
+<rect x="4" y="4" width="122" height="14" fill="#161616" rx="2"/>
+<text x="65" y="15" fill="#383838" text-anchor="middle" class="sans" font-size="8">PUBLICITÉ</text>
+
+<!-- Ad 1: NOVA STORE -->
+<rect x="4" y="22" width="122" height="188" fill="#161616" stroke="#222" rx="3"/>
+<rect x="4" y="22" width="122" height="52" fill="#1c1c1c" rx="3"/>
+<text x="65" y="44" fill="#5a5a5a" text-anchor="middle" class="sans" font-size="14" font-weight="bold">NOVA</text>
+<text x="65" y="62" fill="#484848" text-anchor="middle" class="sans" font-size="9">STORE 2026</text>
+<rect x="14" y="83" width="102" height="64" fill="#111" rx="2"/>
+<text x="65" y="118" fill="#404040" text-anchor="middle" class="sans" font-size="26">&#128722;</text>
+<text x="65" y="166" fill="#484848" text-anchor="middle" class="sans" font-size="10">DÉCOUVRIR</text>
+<text x="65" y="198" fill="#303030" text-anchor="middle" class="sans" font-size="8">nova-store.io</text>
+
+<!-- Ad 2: APEX GEAR -->
+<rect x="4" y="218" width="122" height="188" fill="#161616" stroke="#222" rx="3"/>
+<rect x="4" y="218" width="122" height="52" fill="#141e14" rx="3"/>
+<text x="65" y="240" fill="#447744" text-anchor="middle" class="sans" font-size="12" font-weight="bold">APEX GEAR</text>
+<text x="65" y="257" fill="#336633" text-anchor="middle" class="sans" font-size="9">Gaming Setup</text>
+<rect x="14" y="278" width="102" height="64" fill="#111" rx="2"/>
+<text x="65" y="313" fill="#336633" text-anchor="middle" class="sans" font-size="26">&#127918;</text>
+<text x="65" y="360" fill="#3a5a3a" text-anchor="middle" class="sans" font-size="10">ACHETER</text>
+<text x="65" y="394" fill="#2a3a2a" text-anchor="middle" class="sans" font-size="8">apex-gear.com</text>
+
+<!-- Ad 3: SHIELDVPN -->
+<rect x="4" y="414" width="122" height="188" fill="#161616" stroke="#222" rx="3"/>
+<rect x="4" y="414" width="122" height="52" fill="#14141e" rx="3"/>
+<text x="65" y="436" fill="#4455aa" text-anchor="middle" class="sans" font-size="11" font-weight="bold">SHIELDVPN</text>
+<text x="65" y="452" fill="#3a4488" text-anchor="middle" class="sans" font-size="9">Sécurité totale</text>
+<rect x="14" y="474" width="102" height="64" fill="#111" rx="2"/>
+<text x="65" y="509" fill="#3a4488" text-anchor="middle" class="sans" font-size="26">&#128274;</text>
+<text x="65" y="556" fill="#3a4488" text-anchor="middle" class="sans" font-size="10">ESSAI GRATUIT</text>
+<text x="65" y="590" fill="#2a3366" text-anchor="middle" class="sans" font-size="8">shieldvpn.net</text>
+
+<!-- ══════════════════════════════
+     TOGGLE MENU DROIT  35px
+     ══════════════════════════════ -->
+<rect x="1245" y="0" width="35" height="720" fill="#111" stroke="#1a1a1a" stroke-width="1"/>
+<line x1="1253" y1="18" x2="1272" y2="18" stroke="#3a3a3a" stroke-width="2" stroke-linecap="round"/>
+<line x1="1253" y1="26" x2="1272" y2="26" stroke="#3a3a3a" stroke-width="2" stroke-linecap="round"/>
+<line x1="1253" y1="34" x2="1272" y2="34" stroke="#3a3a3a" stroke-width="2" stroke-linecap="round"/>
+
+<!-- ══════════════════════════════
+     ZONE CHAT PRINCIPALE  1115px
+     ══════════════════════════════ -->
+<rect x="130" y="0" width="1115" height="720" fill="#0d0d0d"/>
+
+<!-- ── EN-TÊTE ── -->
+<rect x="130" y="0" width="1115" height="52" fill="#111" stroke="#1a1a1a" stroke-width="1"/>
+<text x="158" y="24" fill="#d0d0d0" class="sans" font-size="17" font-weight="bold">XIP</text>
+<text x="190" y="20" fill="#cccccc" class="sans" font-size="14" font-weight="bold">Chat</text>
+<circle cx="206" cy="36" r="5" fill="#2d4a2d"/>
+<circle cx="206" cy="36" r="3" fill="#3a8a3a"/>
+<text x="218" y="41" fill="#3a6a3a" class="sans" font-size="11">312 connectés</text>
+<rect x="1050" y="14" width="95" height="24" fill="#1a1a1a" stroke="#262626" rx="12"/>
+<text x="1097" y="30" fill="#4a4a4a" text-anchor="middle" class="sans" font-size="10"># général</text>
+<line x1="130" y1="52" x2="1245" y2="52" stroke="#1a1a1a" stroke-width="1"/>
+
+<!-- ── MESSAGES ── -->
+
+<!-- 1: 192.168.1.45 -->
+<text x="155" y="76" class="ip">192.168.1.45</text>
+<text x="277" y="76" class="ts">17:42</text>
+<text x="155" y="93" class="msg">Salut tout le monde !</text>
+<line x1="155" y1="102" x2="1230" y2="102" class="sep"/>
+
+<!-- 2: 10.0.0.187 -->
+<text x="155" y="119" class="ip">10.0.0.187</text>
+<text x="253" y="119" class="ts">17:43</text>
+<text x="155" y="136" class="msg">Vous avez vu les nouveautés du shop ce soir ?</text>
+<line x1="155" y1="145" x2="1230" y2="145" class="sep"/>
+
+<!-- 3: 172.16.254.1 -->
+<text x="155" y="162" class="ip">172.16.254.1</text>
+<text x="271" y="162" class="ts">17:43</text>
+<text x="155" y="179" class="msg">Ouais j'ai check, les prix sont vraiment corrects</text>
+<line x1="155" y1="188" x2="1230" y2="188" class="sep"/>
+
+<!-- 4: 203.0.113.42 -->
+<text x="155" y="205" class="ip">203.0.113.42</text>
+<text x="275" y="205" class="ts">17:44</text>
+<text x="155" y="222" class="msg">lol ça spam trop ce soir</text>
+<line x1="155" y1="231" x2="1230" y2="231" class="sep"/>
+
+<!-- 5: 10.10.10.99 -->
+<text x="155" y="248" class="ip">10.10.10.99</text>
+<text x="255" y="248" class="ts">17:44</text>
+<text x="155" y="265" class="msg">@203.0.113.42 t'as raison mais c'est le fun quand même</text>
+<line x1="155" y1="274" x2="1230" y2="274" class="sep"/>
+
+<!-- 6: 192.168.1.1 -->
+<text x="155" y="291" class="ip">192.168.1.1</text>
+<text x="252" y="291" class="ts">17:45</text>
+<text x="155" y="308" class="msg">Le chat est bien actif ce soir, j'aime ça</text>
+<line x1="155" y1="317" x2="1230" y2="317" class="sep"/>
+
+<!-- 7: 10.0.0.253 -->
+<text x="155" y="334" class="ip">10.0.0.253</text>
+<text x="252" y="334" class="ts">17:45</text>
+<text x="155" y="351" class="msg">Quelqu'un sait comment configurer le stream ?</text>
+<line x1="155" y1="360" x2="1230" y2="360" class="sep"/>
+
+<!-- 8: 192.168.1.45 (réponse) -->
+<text x="155" y="377" class="ip">192.168.1.45</text>
+<text x="277" y="377" class="ts">17:46</text>
+<text x="155" y="394" class="msg">Vérife dans Paramètres &#x2192; onglet Diffusion</text>
+<line x1="155" y1="403" x2="1230" y2="403" class="sep"/>
+
+<!-- 9: 172.31.0.5 -->
+<text x="155" y="420" class="ip">172.31.0.5</text>
+<text x="247" y="420" class="ts">17:46</text>
+<text x="155" y="437" class="msg">Le drop de demain va être chaud, j'ai les infos du shop</text>
+<line x1="155" y1="446" x2="1230" y2="446" class="sep"/>
+
+<!-- 10: 10.0.0.187 -->
+<text x="155" y="463" class="ip">10.0.0.187</text>
+<text x="253" y="463" class="ts">17:47</text>
+<text x="155" y="480" class="msg">Sérieux ? T'as accès aux infos du shop ?</text>
+<line x1="155" y1="489" x2="1230" y2="489" class="sep"/>
+
+<!-- 11: 192.168.100.2 -->
+<text x="155" y="506" class="ip">192.168.100.2</text>
+<text x="271" y="506" class="ts">17:47</text>
+<text x="155" y="523" class="msg">Pas accès direct mais j'ai des sources 😏</text>
+<line x1="155" y1="532" x2="1230" y2="532" class="sep"/>
+
+<!-- 12: 10.0.1.15 -->
+<text x="155" y="549" class="ip">10.0.1.15</text>
+<text x="241" y="549" class="ts">17:48</text>
+<text x="155" y="566" class="msg">Quel canal pour les annonces du shop ?</text>
+
+<!-- ══ PUB GAMBLING (droite, lumineux) ══ -->
+<!-- Fond rouge sombre -->
+<rect x="966" y="162" width="248" height="258" fill="#1a0600" stroke="#cc4400" stroke-width="2" rx="6"/>
+<!-- Header rouge vif -->
+<rect x="966" y="162" width="248" height="54" fill="#220800" rx="6"/>
+<text x="1090" y="187" fill="#ff5500" text-anchor="middle" class="sans" font-size="15" font-weight="bold">&#9824; CASINO LUCKY &#9824;</text>
+<text x="1090" y="205" fill="#882200" text-anchor="middle" class="sans" font-size="9" letter-spacing="2">OFFRE EXCLUSIVE</text>
+<line x1="966" y1="216" x2="1214" y2="216" stroke="#441400" stroke-width="1"/>
+<!-- Zone bonus -->
+<rect x="976" y="224" width="228" height="82" fill="#1e0c00" rx="4"/>
+<text x="1090" y="258" fill="#ffaa00" text-anchor="middle" class="sans" font-size="30" font-weight="bold">+200%</text>
+<text x="1090" y="278" fill="#ff8800" text-anchor="middle" class="sans" font-size="12">sur votre 1er dépôt</text>
+<text x="1090" y="295" fill="#cc5500" text-anchor="middle" class="sans" font-size="10">jusqu'&#x00E0; 500&#x20AC; offerts</text>
+<!-- 7 7 7 avec déco -->
+<text x="980" y="338" fill="#ffcc00" class="sans" font-size="26">&#9830;</text>
+<text x="1030" y="340" fill="#ffffff" class="sans" font-size="30" font-weight="bold">7</text>
+<text x="1070" y="340" fill="#ffaa00" class="sans" font-size="30" font-weight="bold">7</text>
+<text x="1110" y="340" fill="#ffffff" class="sans" font-size="30" font-weight="bold">7</text>
+<text x="1154" y="338" fill="#ffcc00" class="sans" font-size="26">&#9824;</text>
+<!-- CTA rouge vif -->
+<rect x="976" y="350" width="228" height="38" fill="#cc2200" rx="19"/>
+<text x="1090" y="374" fill="#ffffff" text-anchor="middle" class="sans" font-size="13" font-weight="bold">JOUER MAINTENANT &#x2192;</text>
+<!-- Disclaimer -->
+<text x="1090" y="412" fill="#441400" text-anchor="middle" class="sans" font-size="7">18+ &#x2022; Jeu responsable &#x2022; casino-lucky.bet</text>
+
+<!-- SCROLLBAR -->
+<rect x="1229" y="52" width="8" height="598" fill="#090909" stroke="#141414" stroke-width="1"/>
+<rect x="1230" y="390" width="6" height="140" fill="#1e1e1e" rx="3"/>
+
+<!-- ── ZONE DE SAISIE ── -->
+<rect x="130" y="650" width="1115" height="70" fill="#111" stroke="#1a1a1a" stroke-width="1"/>
+<rect x="178" y="661" width="927" height="47" fill="#181818" stroke="#252525" stroke-width="1" rx="23"/>
+<text x="228" y="690" fill="#333" class="sans" font-size="13">Entrez un message...</text>
+<!-- Bouton envoi -->
+<circle cx="1151" cy="684" r="21" fill="#1a2a1a" stroke="#283828" stroke-width="1"/>
+<polygon points="1143,679 1158,684 1143,689 1147,684" fill="#4a7a4a"/>
+</svg>
diff --git a/maquettes/chat/v3.svg b/maquettes/chat/v3.svg
new file mode 100644
index 0000000..57ca7d5
--- /dev/null
+++ b/maquettes/chat/v3.svg
@@ -0,0 +1,239 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1280 720" width="1280" height="720">
+<defs>
+  <style>
+    .mono { font-family: 'Courier New', Courier, monospace; }
+    .sans { font-family: Arial, Helvetica, sans-serif; }
+    .msg  { font-family: Arial, Helvetica, sans-serif; font-size: 13px; fill: #c0c0c0; }
+    .ts   { font-family: 'Courier New', Courier, monospace; font-size: 10px; fill: #303030; }
+  </style>
+  <!-- Filtres de glow colorés -->
+  <filter id="blur-cyan" x="-40%" y="-40%" width="180%" height="180%">
+    <feGaussianBlur stdDeviation="4"/>
+  </filter>
+  <filter id="blur-magenta" x="-40%" y="-40%" width="180%" height="180%">
+    <feGaussianBlur stdDeviation="4"/>
+  </filter>
+  <filter id="blur-green" x="-40%" y="-40%" width="180%" height="180%">
+    <feGaussianBlur stdDeviation="4"/>
+  </filter>
+  <filter id="blur-orange" x="-40%" y="-40%" width="180%" height="180%">
+    <feGaussianBlur stdDeviation="3"/>
+  </filter>
+  <filter id="blur-title" x="-20%" y="-20%" width="140%" height="140%">
+    <feGaussianBlur stdDeviation="6"/>
+  </filter>
+</defs>
+
+<!-- ══ FOND ══ -->
+<rect width="1280" height="720" fill="#080808"/>
+<!-- Légère teinte violacée en fond -->
+<rect width="1280" height="720" fill="url(#bg-grad)" opacity="0.4"/>
+<defs>
+  <linearGradient id="bg-grad" x1="0" y1="0" x2="1" y2="1">
+    <stop offset="0%" stop-color="#0a0a14"/>
+    <stop offset="100%" stop-color="#0a080e"/>
+  </linearGradient>
+</defs>
+
+<!-- ══════════════════════════════
+     BANDE PUB GAUCHE
+     ══════════════════════════════ -->
+<rect x="0" y="0" width="130" height="720" fill="#0c0c10" stroke="#1a1a22" stroke-width="1"/>
+<text x="65" y="14" fill="#2a2a38" text-anchor="middle" class="sans" font-size="8">PUBLICITÉ</text>
+
+<!-- Ad 1 -->
+<rect x="4" y="20" width="122" height="188" fill="#121218" stroke="#1e1e2a" rx="3"/>
+<rect x="4" y="20" width="122" height="52" fill="#161620" rx="3"/>
+<text x="65" y="42" fill="#4444aa" text-anchor="middle" class="sans" font-size="13" font-weight="bold" filter="url(#blur-cyan)" opacity="0.5">NOVA</text>
+<text x="65" y="42" fill="#5555cc" text-anchor="middle" class="sans" font-size="13" font-weight="bold">NOVA</text>
+<text x="65" y="59" fill="#383870" text-anchor="middle" class="sans" font-size="9">STORE 2026</text>
+<rect x="14" y="80" width="102" height="62" fill="#0e0e16" rx="2"/>
+<text x="65" y="115" fill="#3a3a88" text-anchor="middle" class="sans" font-size="24">&#128722;</text>
+<text x="65" y="163" fill="#3a3a88" text-anchor="middle" class="sans" font-size="10">DÉCOUVRIR</text>
+<text x="65" y="196" fill="#282840" text-anchor="middle" class="sans" font-size="8">nova-store.io</text>
+
+<!-- Ad 2 -->
+<rect x="4" y="216" width="122" height="188" fill="#121218" stroke="#1e1e2a" rx="3"/>
+<rect x="4" y="216" width="122" height="52" fill="#101614" rx="3"/>
+<text x="65" y="238" fill="#225533" text-anchor="middle" class="sans" font-size="11" font-weight="bold" filter="url(#blur-green)" opacity="0.5">APEX GEAR</text>
+<text x="65" y="238" fill="#33aa55" text-anchor="middle" class="sans" font-size="11" font-weight="bold">APEX GEAR</text>
+<text x="65" y="254" fill="#225533" text-anchor="middle" class="sans" font-size="9">Gaming Setup</text>
+<rect x="14" y="276" width="102" height="62" fill="#0e160e" rx="2"/>
+<text x="65" y="311" fill="#33aa55" text-anchor="middle" class="sans" font-size="24">&#127918;</text>
+<text x="65" y="358" fill="#33aa55" text-anchor="middle" class="sans" font-size="10">ACHETER</text>
+<text x="65" y="392" fill="#225533" text-anchor="middle" class="sans" font-size="8">apex-gear.com</text>
+
+<!-- Ad 3 -->
+<rect x="4" y="412" width="122" height="188" fill="#121218" stroke="#1e1e2a" rx="3"/>
+<rect x="4" y="412" width="122" height="52" fill="#16101a" rx="3"/>
+<text x="65" y="434" fill="#6622aa" text-anchor="middle" class="sans" font-size="11" font-weight="bold" filter="url(#blur-magenta)" opacity="0.5">SHIELDVPN</text>
+<text x="65" y="434" fill="#9944dd" text-anchor="middle" class="sans" font-size="11" font-weight="bold">SHIELDVPN</text>
+<text x="65" y="450" fill="#552288" text-anchor="middle" class="sans" font-size="9">Sécurité totale</text>
+<rect x="14" y="472" width="102" height="62" fill="#110e16" rx="2"/>
+<text x="65" y="507" fill="#9944dd" text-anchor="middle" class="sans" font-size="24">&#128274;</text>
+<text x="65" y="554" fill="#9944dd" text-anchor="middle" class="sans" font-size="10">ESSAI GRATUIT</text>
+<text x="65" y="588" fill="#441877" text-anchor="middle" class="sans" font-size="8">shieldvpn.net</text>
+
+<!-- ══════════════════════════════
+     TOGGLE MENU DROIT
+     ══════════════════════════════ -->
+<rect x="1245" y="0" width="35" height="720" fill="#0c0c10" stroke="#1a1a22" stroke-width="1"/>
+<line x1="1253" y1="18" x2="1272" y2="18" stroke="#3a3a55" stroke-width="2" stroke-linecap="round"/>
+<line x1="1253" y1="26" x2="1272" y2="26" stroke="#3a3a55" stroke-width="2" stroke-linecap="round"/>
+<line x1="1253" y1="34" x2="1272" y2="34" stroke="#3a3a55" stroke-width="2" stroke-linecap="round"/>
+
+<!-- ══════════════════════════════
+     ZONE CHAT
+     ══════════════════════════════ -->
+<rect x="130" y="0" width="1115" height="720" fill="#090910"/>
+
+<!-- ── EN-TÊTE ── -->
+<rect x="130" y="0" width="1115" height="52" fill="#0e0e16" stroke="#1a1a26" stroke-width="1"/>
+<!-- Titre avec glow -->
+<text x="158" y="26" fill="#00ccff" class="sans" font-size="18" font-weight="bold" filter="url(#blur-cyan)" opacity="0.7">XIP</text>
+<text x="158" y="26" fill="#00eeff" class="sans" font-size="18" font-weight="bold">XIP</text>
+<text x="198" y="22" fill="#aaaacc" class="sans" font-size="14" font-weight="bold">Chat</text>
+<circle cx="214" cy="37" r="5" fill="#002200"/>
+<circle cx="214" cy="37" r="3" fill="#00ff44" filter="url(#blur-green)" opacity="0.9"/>
+<circle cx="214" cy="37" r="2" fill="#00ff88"/>
+<text x="226" y="42" fill="#33ff66" class="sans" font-size="11">312 connectés</text>
+<rect x="1050" y="14" width="95" height="24" fill="#131320" stroke="#222233" rx="12"/>
+<text x="1097" y="30" fill="#5555aa" text-anchor="middle" class="sans" font-size="10"># général</text>
+<line x1="130" y1="52" x2="1245" y2="52" stroke="#1a1a2a" stroke-width="1"/>
+
+<!-- ── MESSAGES ── -->
+
+<!-- 1: 192.168.1.45 (gris normal) -->
+<text x="155" y="76" fill="#666688" class="mono" font-size="12" font-weight="bold">192.168.1.45</text>
+<text x="277" y="76" class="ts">17:42</text>
+<text x="155" y="93" class="msg">Salut tout le monde !</text>
+<line x1="155" y1="102" x2="1230" y2="102" stroke="#141420" stroke-width="1"/>
+
+<!-- 2: 172.16.254.1 (CYAN) -->
+<text x="155" y="119" fill="#00aacc" class="mono" font-size="12" font-weight="bold" filter="url(#blur-cyan)" opacity="0.7">172.16.254.1</text>
+<text x="155" y="119" fill="#00ddff" class="mono" font-size="12" font-weight="bold">172.16.254.1</text>
+<text x="271" y="119" class="ts">17:43</text>
+<text x="155" y="136" class="msg">Vous avez vu les nouvelles du shop ce soir ?</text>
+<line x1="155" y1="145" x2="1230" y2="145" stroke="#141420" stroke-width="1"/>
+
+<!-- 3: 10.0.0.187 (gris normal) -->
+<text x="155" y="162" fill="#666688" class="mono" font-size="12" font-weight="bold">10.0.0.187</text>
+<text x="253" y="162" class="ts">17:43</text>
+<text x="155" y="179" class="msg">Ouais j'ai check, les prix sont vraiment corrects</text>
+<line x1="155" y1="188" x2="1230" y2="188" stroke="#141420" stroke-width="1"/>
+
+<!-- 4: 203.0.113.42 (ORANGE) -->
+<text x="155" y="205" fill="#cc5500" class="mono" font-size="12" font-weight="bold" filter="url(#blur-orange)" opacity="0.8">203.0.113.42</text>
+<text x="155" y="205" fill="#ff8844" class="mono" font-size="12" font-weight="bold">203.0.113.42</text>
+<text x="275" y="205" class="ts">17:44</text>
+<text x="155" y="222" class="msg">lol ça spam trop ce soir</text>
+<line x1="155" y1="231" x2="1230" y2="231" stroke="#141420" stroke-width="1"/>
+
+<!-- 5: 10.10.10.99 (MAGENTA) -->
+<text x="155" y="248" fill="#aa0088" class="mono" font-size="12" font-weight="bold" filter="url(#blur-magenta)" opacity="0.8">10.10.10.99</text>
+<text x="155" y="248" fill="#ff00cc" class="mono" font-size="12" font-weight="bold">10.10.10.99</text>
+<text x="255" y="248" class="ts">17:44</text>
+<text x="155" y="265" class="msg">@203.0.113.42 t'as raison mais c'est le fun quand même</text>
+<line x1="155" y1="274" x2="1230" y2="274" stroke="#141420" stroke-width="1"/>
+
+<!-- 6: 192.168.1.1 (gris) -->
+<text x="155" y="291" fill="#666688" class="mono" font-size="12" font-weight="bold">192.168.1.1</text>
+<text x="252" y="291" class="ts">17:45</text>
+<text x="155" y="308" class="msg">Le chat est bien actif ce soir, j'aime ça</text>
+<line x1="155" y1="317" x2="1230" y2="317" stroke="#141420" stroke-width="1"/>
+
+<!-- 7: 172.31.0.5 (VERT) -->
+<text x="155" y="334" fill="#008844" class="mono" font-size="12" font-weight="bold" filter="url(#blur-green)" opacity="0.8">172.31.0.5</text>
+<text x="155" y="334" fill="#00ee77" class="mono" font-size="12" font-weight="bold">172.31.0.5</text>
+<text x="247" y="334" class="ts">17:45</text>
+<text x="155" y="351" class="msg">Le drop de demain va être chaud 🔥 j'ai les infos du shop</text>
+<line x1="155" y1="360" x2="1230" y2="360" stroke="#141420" stroke-width="1"/>
+
+<!-- 8: 10.0.0.253 (gris) -->
+<text x="155" y="377" fill="#666688" class="mono" font-size="12" font-weight="bold">10.0.0.253</text>
+<text x="252" y="377" class="ts">17:46</text>
+<text x="155" y="394" class="msg">Quelqu'un sait configurer le stream ?</text>
+<line x1="155" y1="403" x2="1230" y2="403" stroke="#141420" stroke-width="1"/>
+
+<!-- 9: 192.168.1.45 (gris) -->
+<text x="155" y="420" fill="#666688" class="mono" font-size="12" font-weight="bold">192.168.1.45</text>
+<text x="277" y="420" class="ts">17:46</text>
+<text x="155" y="437" class="msg">Vérife dans Paramètres &#x2192; onglet Diffusion</text>
+<line x1="155" y1="446" x2="1230" y2="446" stroke="#141420" stroke-width="1"/>
+
+<!-- 10: 172.16.254.1 (CYAN again) -->
+<text x="155" y="463" fill="#00aacc" class="mono" font-size="12" font-weight="bold" filter="url(#blur-cyan)" opacity="0.6">172.16.254.1</text>
+<text x="155" y="463" fill="#00ddff" class="mono" font-size="12" font-weight="bold">172.16.254.1</text>
+<text x="271" y="463" class="ts">17:47</text>
+<text x="155" y="480" class="msg">Sérieux ? T'as accès aux infos du shop ?</text>
+<line x1="155" y1="489" x2="1230" y2="489" stroke="#141420" stroke-width="1"/>
+
+<!-- 11: 10.10.10.99 (MAGENTA) -->
+<text x="155" y="506" fill="#aa0088" class="mono" font-size="12" font-weight="bold" filter="url(#blur-magenta)" opacity="0.7">10.10.10.99</text>
+<text x="155" y="506" fill="#ff00cc" class="mono" font-size="12" font-weight="bold">10.10.10.99</text>
+<text x="255" y="506" class="ts">17:47</text>
+<text x="155" y="523" class="msg">Pas accès direct mais j'ai des sources 😏</text>
+<line x1="155" y1="532" x2="1230" y2="532" stroke="#141420" stroke-width="1"/>
+
+<!-- 12: 203.0.113.42 (ORANGE) -->
+<text x="155" y="549" fill="#cc5500" class="mono" font-size="12" font-weight="bold" filter="url(#blur-orange)" opacity="0.7">203.0.113.42</text>
+<text x="155" y="549" fill="#ff8844" class="mono" font-size="12" font-weight="bold">203.0.113.42</text>
+<text x="275" y="549" class="ts">17:48</text>
+<text x="155" y="566" class="msg">Quel canal pour les annonces du shop ?</text>
+
+<!-- ══ PUB GAMBLING NÉON (droite, lumineux) ══ -->
+<defs>
+  <filter id="glow-rb" x="-40%" y="-40%" width="180%" height="180%">
+    <feGaussianBlur stdDeviation="5"/>
+  </filter>
+  <filter id="glow-gd" x="-40%" y="-40%" width="180%" height="180%">
+    <feGaussianBlur stdDeviation="5"/>
+  </filter>
+</defs>
+<!-- Fond + bordure néon rouge -->
+<rect x="966" y="162" width="248" height="258" fill="#100400"/>
+<rect x="966" y="162" width="248" height="258" fill="none" stroke="#ff2200" stroke-width="3" rx="6" filter="url(#glow-rb)" opacity="0.9"/>
+<rect x="966" y="162" width="248" height="258" fill="none" stroke="#ff4422" stroke-width="1.5" rx="6"/>
+<!-- Header rouge -->
+<rect x="966" y="162" width="248" height="54" fill="#1a0400" rx="6"/>
+<text x="1090" y="186" fill="#aa2200" text-anchor="middle" class="sans" font-size="15" font-weight="bold" filter="url(#glow-rb)" opacity="0.9">&#9824; CASINO LUCKY &#9824;</text>
+<text x="1090" y="186" fill="#ff5533" text-anchor="middle" class="sans" font-size="15" font-weight="bold">&#9824; CASINO LUCKY &#9824;</text>
+<text x="1090" y="204" fill="#882200" text-anchor="middle" class="sans" font-size="9" letter-spacing="2">OFFRE EXCLUSIVE</text>
+<line x1="966" y1="216" x2="1214" y2="216" stroke="#440000" stroke-width="1"/>
+<!-- +200% or néon -->
+<text x="1090" y="262" fill="#996600" text-anchor="middle" class="sans" font-size="32" font-weight="bold" filter="url(#glow-gd)" opacity="0.9">+200%</text>
+<text x="1090" y="262" fill="#ffdd00" text-anchor="middle" class="sans" font-size="32" font-weight="bold">+200%</text>
+<text x="1090" y="282" fill="#cc6600" text-anchor="middle" class="sans" font-size="11">sur votre 1er dépôt &#x2022; 500&#x20AC; max</text>
+<!-- 7 7 7 néon -->
+<text x="980" y="336" fill="#ff8800" class="sans" font-size="26" filter="url(#glow-rb)" opacity="0.6">&#9830;</text>
+<text x="980" y="336" fill="#ffaa44" class="sans" font-size="26">&#9830;</text>
+<text x="1030" y="338" fill="#ffdd00" class="sans" font-size="30" font-weight="bold" filter="url(#glow-gd)" opacity="0.6">7</text>
+<text x="1030" y="338" fill="#ffffff" class="sans" font-size="30" font-weight="bold">7</text>
+<text x="1070" y="338" fill="#ffdd00" class="sans" font-size="30" font-weight="bold" filter="url(#glow-gd)" opacity="0.6">7</text>
+<text x="1070" y="338" fill="#ffffff" class="sans" font-size="30" font-weight="bold">7</text>
+<text x="1110" y="338" fill="#ffdd00" class="sans" font-size="30" font-weight="bold" filter="url(#glow-gd)" opacity="0.6">7</text>
+<text x="1110" y="338" fill="#ffffff" class="sans" font-size="30" font-weight="bold">7</text>
+<text x="1156" y="336" fill="#ff8800" class="sans" font-size="26" filter="url(#glow-rb)" opacity="0.6">&#9824;</text>
+<text x="1156" y="336" fill="#ffaa44" class="sans" font-size="26">&#9824;</text>
+<!-- CTA néon rouge -->
+<rect x="976" y="349" width="228" height="38" fill="#220000" rx="19"/>
+<rect x="976" y="349" width="228" height="38" fill="none" stroke="#ff2200" stroke-width="1.5" rx="19" filter="url(#glow-rb)" opacity="0.8"/>
+<text x="1090" y="373" fill="#aa2200" text-anchor="middle" class="sans" font-size="13" font-weight="bold" filter="url(#glow-rb)" opacity="0.7">JOUER MAINTENANT &#x2192;</text>
+<text x="1090" y="373" fill="#ff4422" text-anchor="middle" class="sans" font-size="13" font-weight="bold">JOUER MAINTENANT &#x2192;</text>
+<!-- Disclaimer -->
+<text x="1090" y="411" fill="#440000" text-anchor="middle" class="sans" font-size="7">18+ &#x2022; Jeu responsable &#x2022; casino-lucky.bet</text>
+
+<!-- SCROLLBAR -->
+<rect x="1229" y="52" width="8" height="598" fill="#080810" stroke="#141420" stroke-width="1"/>
+<rect x="1230" y="390" width="6" height="140" fill="#252535" rx="3"/>
+
+<!-- ── ZONE DE SAISIE ── -->
+<rect x="130" y="650" width="1115" height="70" fill="#0e0e16" stroke="#1a1a26" stroke-width="1"/>
+<rect x="178" y="661" width="927" height="47" fill="#141420" stroke="#222234" stroke-width="1" rx="23"/>
+<text x="228" y="690" fill="#2a2a44" class="sans" font-size="13">Entrez un message...</text>
+<!-- Bouton envoi avec glow cyan -->
+<circle cx="1151" cy="684" r="21" fill="#00223a" stroke="#004466" stroke-width="1"/>
+<circle cx="1151" cy="684" r="21" fill="#004488" filter="url(#blur-cyan)" opacity="0.4"/>
+<polygon points="1143,679 1158,684 1143,689 1147,684" fill="#00ddff"/>
+</svg>