anto/XIP
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: conformite enonce - explorer, favoris, stats perso, tests, slots
Some checks failed
Deploy XIP / deploy (push) Failing after 37s
Details

Browse Source 
Fonctionnel
- Backend messages : GET /api/messages/:id (detail) + recherche (q),
  pagination par curseur (before/limit) avec enveloppe { items, nextCursor,
  hasMore } ; le flux temps reel garde l'ancien format quand aucun parametre.
- Explorer (/explorer) : catalogue distant, recherche debouncee + annulable
  (AbortController), filtre, defilement infini, etat garde (keep-alive).
- Details par id : /message/:id et /shop/p/:id (consomment route.params).
- Favoris (/favoris) : liste perso persistee en localStorage, notation
  (note/rating/statut) via modale, refletee partout (bouton favori).
- Mes stats (/mes-stats) : agregats derives des favoris (note moyenne, top
  pays/auteurs, statuts), auto-mis a jour, route gardee si liste vide.
- Routeur : pages secondaires en lazy-load + repli, garde beforeEnter.

Technique
- Slots : PrefSection (slot defaut + slot nomme) enveloppe les 5 sections
  "Mes Persos" ; Modal (Teleport + slots).
- v-model custom : SearchBox (defineModel + debounce).
- Directive custom : v-click-outside.
- Tests Vitest : 25 tests (etat, fonctions, composants), ~86% du code metier.
- Retrait d'Ionic (inutilise). Script typecheck backend ; tsconfig @types/bun.
- Correctif type : garde stockLimit nullable dans l'achat (catalog.ts).
- README complet (URL, stack, run, tests, secrets, deploiement, mention IA).
This commit is contained in:
Ethan Puyaubreau
2026-05-31 23:57:00 +02:00
committed by kerboul
parent 9dd72b9b2d
commit cfa2eadec9
111 changed files with 9634 additions and 7875 deletions
Download Patch File Download Diff File Expand all files Collapse all files

736
maquettes/chat/v1.svg
View File

@@ -1,368 +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>
<?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>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 23 KiB

After

Width:  |  Height:  |  Size: 24 KiB