<!--                                                                                                             
               ████                                                                           ████               
             ███                                                                                 ███             
           ███                                        ██                                           ███           
        ████                                          ██                                             ████        
      ████                                                                                             ████      
    ████                                                                                                 ████    
  █████████████████████     ██               ████     ██    █████████████   █████████     █████████████████████  
                 ████     ████             ██████     ██              ███                   ████                 
               ███      ████             ███   ██     ██            ███                       ████               
             ███      ████             ███     ██     ██         ████       ███████████████      ███             
          ████      ███              ████████████     ██       ████                                ███           
        ████      ███              ███         ██     ██     ████                                    ████        
      ████      ██████████████  ████           ██     ██   ██████████████   ████████████████████       ████      
                                                                                                                 
       ██ INITIATING CONNECTION ██ TARGET: SLAIZEN.COM ██ ACCESSING CODEBASE ██ CONNECTION ESTABLISHED ██        
                                         ██ WELCOME TO THE UNDER-GRID ██                                         
      21  06    2007                                                                        08  10   1992        
         19 12 1 9 26 5 14                                                           10  9  13 13  25            
            14  5 26 9 1 12 19                                                 18 9 22  1 18 4  53853            
                  16   9 18  1  20 5                                       14 9 14 10  1                         
                      08       2724483                                   636679      76883647                    
              08 27328466  08       3335                              0 5683      08  08 3668466                 
          152883 65        85 38 7  77 34 3                           17     74   79      8    95697             
        96977   81         7817  53       1                          9     9   15          8    8 38895          
                8    4Ω4    8  2   3                                     8  17     3♎︎3    1    3                
           8    58          8    8   6                                 7   4   8           8    2                
            7    18       78     2 2                                  9  3 8    82       88    8                 
              2    7888883      8    1                                 287  2      88885    39                   
                08 1916918920                                                168251993112                        
-->
<!DOCTYPE html>
<html lang="fr">

<head>
    <meta charset="UTF-8">
    <script>
        /* Immediate Language Detection to prevent FOUT */
        (function () {
            const savedLang = localStorage.getItem('selectedLanguage') || 'fr';
            document.documentElement.lang = savedLang;
            if (savedLang === 'en') {
                document.documentElement.classList.add('i18n-loading');
                setTimeout(function () {
                    document.documentElement.classList.remove('i18n-loading');
                }, 1000);
            }
        })();
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="Une archive nostalgique et vivante des classiques du vieux Web francophone des années 2000. Retrouvez les jeux Flash cultes de Radio-Canada Jeunesse (La Foire aux mystères), sites rétro, sagas MP3 et animations.">
    <meta name="keywords" content="vieux web, retro web, archive web, radio canada jeunesse, la foire aux mysteres, jeux flash radio canada, foire aux mysteres, zone jeunesse radio canada, jeux flash jeunesse québec, naheulbeuk, survivaure, newgrounds, flash, retro gaming, nostalgie, 2000s, jeux flash, sagas mp3, netophonix, françois pérusse, les 2 minutes du peuple, lapatate, stupid show, koreus, prikiti, albator, rotten, ebaumsworld, joecartoon, newgrounds flash">
    <meta name="robots" content="index, follow">
    <link rel="canonical" href="https://slaizen.com/oldweb/archive.html">
    
    <!-- Open Graph tags for Discord, Facebook, Twitter, etc. -->
    <meta property="og:title" content="Mes Favoris du vieux Web - Slaizen Archive">
    <meta property="og:description" content="Découvrez une sélection de sites cultes des années 2000 : jeux Flash, sagas MP3, humour, et nostalgie rétro.">
    <meta property="og:url" content="https://slaizen.com/oldweb/archive.html">
    <meta property="og:image" content="https://slaizen.com/oldweb/preview-lestupidshow.webp">
    <meta property="og:type" content="website">
    
    <!-- Structured Data for Search Engine Bots (Schema.org JSON-LD) -->
    <script type="application/ld+json">
    {
      "@context": "https://schema.org",
      "@type": "WebPage",
      "name": "Mes Favoris du vieux Web - Slaizen Archive",
      "description": "Une archive historique des sites internet, jeux flash et sagas MP3 populaires du vieux Web francophone des années 2000.",
      "about": [
        {
          "@type": "CreativeWork",
          "name": "LaPatate.com",
          "creator": {
            "@type": "Person",
            "name": "Alexis Leclabart et Jonathan Marouani"
          }
        },
        {
          "@type": "CreativeWork",
          "name": "Perdu.com",
          "creator": {
            "@type": "Person",
            "name": "Gilles Boccon-Gibod"
          }
        },
        {
          "@type": "CreativeWork",
          "name": "Tom et ses Chums",
          "creator": {
            "@type": "Person",
            "name": "Édouard Albernhe-Tremblay (Eddie69)"
          }
        },
        {
          "@type": "CreativeWork",
          "name": "LeStupidShow.com",
          "creator": {
            "@type": "Person",
            "name": "Jitan Forcier et Gitan Forcier"
          }
        },
        {
          "@type": "CreativeWork",
          "name": "Follerie.com",
          "creator": {
            "@type": "Person",
            "name": "Tommy Lajoie"
          }
        },
        {
          "@type": "CreativeWork",
          "name": "Le Démon du Rire",
          "creator": {
            "@type": "Person",
            "name": "Durendal et Junior"
          }
        },
        {
          "@type": "CreativeWork",
          "name": "WFAnimation.com",
          "creator": {
            "@type": "Person",
            "name": "Robert de Freitas, Vincent Medoukali et Ludovic Girard"
          }
        },
        {
          "@type": "CreativeWork",
          "name": "PenOfChaos.com (Le Donjon de Naheulbeuk)",
          "creator": {
            "@type": "Person",
            "name": "John Lang (John POC)"
          }
        },
        {
          "@type": "CreativeWork",
          "name": "knarfworld.net (Les Aventuriers du Survivaure)",
          "creator": {
            "@type": "Person",
            "name": "Franck Guillois (Knarf)"
          }
        },
        {
          "@type": "CreativeWork",
          "name": "Newgrounds.com",
          "creator": {
            "@type": "Person",
            "name": "Thomas Charles Fulp (Tom Fulp)"
          }
        },
        {
          "@type": "CreativeWork",
          "name": "Radio Canada",
          "creator": {
            "@type": "Organization",
            "name": "Radio-Canada"
          }
        },
        {
          "@type": "CreativeWork",
          "name": "Battleon.com (Adventure Quest)",
          "creator": {
            "@type": "Person",
            "name": "Adam Bohn (Artix)"
          }
        },
        {
          "@type": "CreativeWork",
          "name": "Captain Naruto",
          "creator": {
            "@type": "Person",
            "name": "Adrien"
          }
        },
        {
          "@type": "CreativeWork",
          "name": "Naruto-MX",
          "creator": {
            "@type": "Organization",
            "name": "MX Team"
          }
        },
        {
          "@type": "CreativeWork",
          "name": "JapFlap",
          "creator": {
            "@type": "Organization",
            "name": "JapFlap Team"
          }
        },
        {
          "@type": "CreativeWork",
          "name": "WoNaruto",
          "creator": {
            "@type": "Organization",
            "name": "WoNaruto Team"
          }
        },
        {
          "@type": "CreativeWork",
          "name": "RPG Créative",
          "creator": {
            "@type": "Person",
            "name": "Samarium"
          }
        },
        {
          "@type": "CreativeWork",
          "name": "RPG Story",
          "creator": {
            "@type": "Organization",
            "name": "RPG Story Team"
          }
        }
      ]
    }
    </script>
    <title>Mes Favoris du vieux Web - Détails</title>
	<link rel="icon" type="image/x-icon" href="../favicon.ico">
<!--╔═══════════════════════════════════════════════════════════════════════════════════════════════════════╗    
    ║                                       ██ ACCESSING: CSS CORE ██                                       ║    
    ╚═══════════════════════════════════════════════════════════════════════════════════════════════════════╝-->
    <link rel="stylesheet" href="../coreSystem/interface.css">
    <link rel="stylesheet" href="../coreSystem/auth.css">
    <link rel="stylesheet" href="../coreSystem/modals.css">
    <link rel="stylesheet" href="../coreSystem/comments.css">
    <link rel="stylesheet" href="../coreSystem/notifications.css">
    <link rel="stylesheet" href="../coreSystem/profiles.css">
    <link rel="stylesheet" href="swf-player.css">
    <link rel="stylesheet" href="style.css?v=2026.08.20.03">
    <style>


        /* ── Video Modal ── */
        #videoModal {
            display: none;
            position: fixed;
            z-index: 99999;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.88);
            backdrop-filter: blur(8px);
            justify-content: center;
            align-items: center;
            opacity: 0;
            transition: opacity 0.3s ease;
        }

        #videoModal.visible {
            display: flex;
            opacity: 1;
        }

        #videoModalCard {
            position: relative;
            background: #111b29;
            border: 1px solid #1f2d3d;
            border-radius: 12px;
            width: 90%;
            max-width: 800px;
            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.6);
            overflow: hidden;
            display: flex;
            flex-direction: column;
            transform: scale(0.9);
            transition: transform 0.3s ease;
        }

        #videoModal.visible #videoModalCard {
            transform: scale(1);
        }

        #videoModalHeader {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 12px 20px;
            background: #0b1118;
            border-bottom: 1px solid #1f2d3d;
        }

        #videoModalTitle {
            color: #ecf0f1;
            font-family: Verdana, sans-serif;
            font-size: 14px;
            font-weight: bold;
        }

        #videoModalClose {
            background: none;
            border: none;
            color: #a0b4cc;
            font-size: 24px;
            cursor: pointer;
            line-height: 1;
            transition: color 0.2s;
        }

        #videoModalClose:hover {
            color: #fff;
        }

        #videoModalBody {
            background: #000;
            display: flex;
            justify-content: center;
            align-items: center;
            width: 100%;
            aspect-ratio: 16 / 9;
        }

        #videoPlayerFrame {
            width: 100%;
            height: 100%;
            display: block;
            border: none;
        }

        .playlist-track {
            padding: 4px 12px !important;
        }

        .floating-surf {
            position: fixed;
            bottom: 10px;
            right: 25px;
            width: 350px;
            height: auto;
            z-index: 2002;
            pointer-events: none;
            animation: floatEffect 3s ease-in-out infinite;
            filter: drop-shadow(0 5px 10px rgba(0, 0, 0, 0.15));
        }

        .floating-morla {
            position: fixed;
            bottom: 350px;
            right: 75px;
            width: 90px;
            height: auto;
            z-index: 2000;
            pointer-events: none;
            animation: floatEffect 5s ease-in-out infinite;
            animation-delay: -1.5s;
            filter: drop-shadow(0 3px 8px rgba(0, 0, 0, 0.12));
            opacity: 0.85;
        }

        .mediaplayer-container {
            position: fixed;
            bottom: 10px;
            right: 30px;
            z-index: 2010;
            animation: floatEffectMinor 5s ease-in-out infinite;
            pointer-events: none;
            display: flex;
            align-items: center;
            flex-direction: row;
            gap: 15px;
        }

        .floating-mediaplayer {
            width: 120px;
            height: auto;
            cursor: pointer;
            filter: drop-shadow(0 5px 15px rgba(0, 0, 0, 0.3));
            transition: all 0.2s ease-in-out;
            pointer-events: auto;
            display: block;
        }

        .floating-mediaplayer:hover {
            transform: scale(1.08) !important;
            filter: drop-shadow(0 8px 18px rgba(0, 0, 0, 0.4));
        }

        .floating-mediaplayer:active {
            transform: scale(0.96) !important;
            filter: drop-shadow(0 2px 5px rgba(0, 0, 0, 0.2));
        }



        .rotation-wrapper {
            transition: transform 0.3s ease;
        }

        .rotation-wrapper.rotating {
            animation: spinning 4s linear infinite;
        }

        @keyframes spinning {
            from {
                transform: rotate(0deg);
            }

            to {
                transform: rotate(360deg);
            }
        }

        .audio-monitor {
            width: 250px;
            height: 100px;
            background: transparent;
            border: none;
            margin: 0;
            display: none;
            overflow: visible;
            pointer-events: none;
        }

        .audio-monitor canvas {
            width: 100%;
            height: 70px; /* Reduced to leave space for text */
            display: block;
        }

        .track-box {
            width: 180px;
            height: 20px;
            margin: 5px -50px 5px auto;
            background: rgba(0, 0, 0, 0.8);
            border: 1px solid rgba(34, 255, 34, 0.5);
            border-radius: 10px;
            overflow: hidden;
            box-shadow: inset 0 0 8px rgba(0,0,0,0.8), 0 0 10px rgba(34, 255, 34, 0.1);
            position: relative;
            display: flex;
            align-items: center;
        }

        .track-display {
            color: #22ff22;
            font-family: 'Consolas', 'Courier New', monospace;
            font-size: 9px;
            text-transform: uppercase;
            letter-spacing: 1px;
            text-shadow: 0 0 5px rgba(0, 255, 0, 0.5);
            white-space: nowrap;
            animation: marquee 12s linear infinite;
            padding-left: 100%;
            height: 20px;
            line-height: 20px;
        }

        @keyframes marquee {
            0% { transform: translateX(0); }
            100% { transform: translateX(-100%); }
        }

        .floating-sims {
            position: fixed;
            bottom: 360px;
            right: 220px;
            width: 62px;
            height: auto;
            z-index: 2005;
            pointer-events: none;
            animation: floatEffect 3s ease-in-out infinite;
            filter: drop-shadow(0 5px 8px rgba(0, 0, 0, 0.15)) drop-shadow(0 0 10px rgba(0, 255, 0, 0.3));
        }

        .static-stickfigure {
            position: fixed;
            bottom: 145px;
            left: 25px;
            width: 80px;
            height: auto;
            z-index: 2001;
            pointer-events: none;
            transform: rotate(-15deg);
            filter: drop-shadow(0 5px 15px rgba(0, 0, 0, 0.2));
            opacity: 0.9;
        }

        @keyframes floatEffectMinor {

            0%,
            100% {
                transform: translateY(0) rotate(1deg);
            }

            50% {
                transform: translateY(-8px) rotate(-1deg);
            }
        }

        @keyframes floatEffect {

            0%,
            100% {
                transform: translateY(0) rotate(2deg);
            }

            50% {
                transform: translateY(-20px) rotate(-2deg);
            }
        }

        .side-column {
            position: fixed;
            top: 20px;
            bottom: 20px;
            width: 100px;
            background-image: url('colomn.webp');
            background-repeat: no-repeat;
            background-size: 100% 100%;
            z-index: 500;
            pointer-events: none;
            filter: drop-shadow(0 0 4px rgba(0, 0, 0, 0.1));
        }

        .column-left {
            left: 40px;
        }

        .column-right {
            right: 40px;
            transform: scaleX(-1);
        }

        body {
            font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
            background: linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.5)), #f0f2f5 url('background.webp') fixed;
            background-size: cover;
            color: #1a1a1a;
            padding: 30px 180px 0;
            margin: 0;
            line-height: 1.5;
        }

        header {
            max-width: 850px;
            margin: 0 auto 15px auto;
            padding-left: 0;
            display: flex;
            align-items: center;
            gap: 15px;
        }

        .header-logo {
            width: 150px;
            height: auto;
            flex-shrink: 0;
            filter: drop-shadow(0 5px 15px rgba(0, 0, 0, 0.1));
            animation: rotate3d 8s linear infinite;
            transform-style: preserve-3d;
        }

        @keyframes rotate3d {
            from {
                transform: rotateY(0deg);
            }

            to {
                transform: rotateY(360deg);
            }
        }

        .header-text {
            display: flex;
            flex-direction: column;
        }

        h1 {
            font-size: 48px;
            font-weight: 800;
            color: #2b5797;
            margin: 0;
            letter-spacing: -1px;
            line-height: 1.1;
        }

        /* Navigation Tabs */
        .museum-nav {
            max-width: 850px;
            margin: 0 auto 0 auto;
            display: flex;
            gap: 10px;
            position: sticky;
            top: 0;
            z-index: 1500;
            padding: 10px 0;
        }

        .nav-tab {
            flex: 1;
            justify-content: center;
            padding: 10px 8px;
            background: #e0e4eb;
            border: 1px solid #c8cedb;
            border-radius: 8px;
            color: #555;
            font-weight: 700;
            font-size: 13px;
            cursor: pointer;
            transition: all 0.2s;
            display: flex;
            align-items: center;
            gap: 4px;
            height: 40px;
            box-sizing: border-box;
        }

        .nav-tab.active {
            background: #2662dd;
            color: white;
            border-color: #2662dd;
            box-shadow: 0 4px 12px rgba(38, 98, 221, 0.25);
        }

        .nav-tab:hover:not(.active) {
            background: #d1d9e6;
            transform: translateY(-2px);
        }

        .category-section {
            max-width: 850px;
            margin: 0 auto 0 auto;
        }

        .category-title {
            font-size: 14px;
            color: #ffffff;
            text-transform: uppercase;
            letter-spacing: 1.5px;
            margin-bottom: 0;
            margin-left: 15px;
            display: inline-block;
            background: rgba(74, 74, 74, 0.85);
            border: none;
            border-radius: 6px 6px 0 0;
            padding: 5px 12px;
            font-weight: bold;
        }

        .site-list {
            display: flex;
            flex-direction: column;
            gap: 2px;
        }

        .site-entry {
            background: rgba(255, 255, 255, 0.85);
            border: 1px solid #d1d9e6;
            border-radius: 10px;
            padding: 6px;
            display: flex;
            flex-direction: row;
            gap: 15px;
            align-items: flex-start;
            transition: all 0.2s ease-in-out;
            position: relative;
            z-index: 600;
            cursor: pointer;
        }

        .site-gif-overlay {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            width: 150px;
            height: auto;
            z-index: 1000;
            filter: drop-shadow(0 5px 20px rgba(0, 0, 0, 0.3));
            pointer-events: none;
        }

        .site-gif-left {
            left: -110px;
        }

        .site-gif-right {
            right: -110px;
        }

        .site-entry:hover {
            z-index: 700;
        }

        @keyframes stupidBounceSquash {

            0%,
            20%,
            40%,
            60%,
            100% {
                transform: translateY(-50%) scale(1);
            }

            10% {
                transform: translateY(-75%) scale(1);
            }

            30% {
                transform: translateY(-75%) scale(1);
            }

            70% {
                transform: translateY(-40%) scale(1.1, 0.7);
            }

            80% {
                transform: translateY(-50%) scale(1);
            }
        }

        .stupid-logo-anim {
            animation: stupidBounceSquash 3s ease-in-out infinite;
        }

        .skeleton-anim {
            width: 130px !important;
            animation: skeletonLaugh 2s steps(15) infinite;
            transform-origin: bottom center;
        }

        @keyframes skeletonLaugh {

            0%,
            10%,
            20%,
            30%,
            40% {
                transform: translateY(-58%) scale(1, 1);
            }

            5%,
            15%,
            25%,
            35% {
                transform: translateY(-58%) scale(1.1, 0.9);
            }

            41%,
            100% {
                transform: translateY(-58%) scale(1, 1);
            }
        }

        .favicon {
            order: 1;
        }

        .site-name {
            order: 2;
        }

        .rating-stars {
            order: 4;
            color: #fbc02d;
            font-size: 18px;
            text-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
            margin-right: -10px;
        }

        .site-years {
            order: 3;
            font-size: 14px;
            color: #999;
            font-weight: bold;
            margin-left: 6px;
            font-family: 'Consolas', monospace;
            background: #f4f4f4;
            padding: 1px 4px;
            border-radius: 4px;
            border: 1px solid #ddd;
        }

        /* Always push stars to the right if they exist */
        .entry-header:has(.rating-stars) .rating-stars {
            margin-left: auto;
        }

        .preview-container {
            width: 210px;
            flex-shrink: 0;
            border: 1px solid #ccc;
            border-radius: 5px;
            overflow: hidden;
            background: #000;
            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
            position: relative;
        }

        .preview-img {
            width: 100%;
            height: 115px;
            object-fit: cover;
            object-position: top;
            display: block;
        }

        .entry-content {
            display: flex;
            flex-direction: column;
            gap: 6px;
            flex-grow: 1;
        }

        .entry-header {
            display: flex;
            align-items: center;
            gap: 15px;
        }

        .favicon {
            width: 28px;
            height: 28px;
            border-radius: 4px;
            background: #f8f9fa;
        }

        .site-name {
            font-size: 20px;
            font-weight: 700;
            color: #2b5797;
        }

        .site-subtitle {
            display: block;
            font-size: 11px;
            font-weight: normal;
            color: #2b5797;
            margin-top: 0px;
            line-height: 1.1;
        }

        .author-info {
            font-size: 11px;
            color: #2b5797;
            text-align: left;
            font-family: 'Tahoma', sans-serif;
            margin-top: 0px;
        }

        .url-group {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
        }

        .site-url {
            order: 5;
            font-size: 11px;
            color: #2e7d32;
            font-family: 'Consolas', monospace;
            background: #e8f5e9;
            padding: 5px 4px;
            border-radius: 6px;
            text-decoration: none;
            border: 1px solid #c8e6c9;
            transition: all 0.2s;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 95px;
        }

        .site-url:hover {
            background: #c8e6c9;
            transform: translateY(-1px);
        }

        .entry-header:has(.rating-stars) .site-url {
            margin-left: 0 !important;
        }

        .modern-url {
            color: #2b5797;
            background: #e1f5fe;
            border-color: #b3e5fc;
        }

        .offline-url {
            color: #c62828;
            background: #ffebee;
            border-color: #ffcdd2;
            cursor: default;
        }

        .offline-url:hover {
            background: #ffebee;
            transform: none;
        }

        .site-desc {
            font-size: 15px;
            color: #4a4a4a;
            margin: 0;
        }

        .personal-note {
            background: #fff9c4;
            border-left: 4px solid #fbc02d;
            padding: 10px 15px;
            font-size: 13px;
            font-style: italic;
            color: #5d4037;
            margin-top: 5px;
        }

        .play-overlay {
            position: absolute;
            bottom: 35%;
            left: 50%;
            transform: translate(-50%, 50%);
            width: 40px;
            height: 40px;
            background: rgba(0, 0, 0, 0.7);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            font-size: 20px;
            pointer-events: none;
        }

        .site-grid {
            display: flex;
            gap: 15px;
            margin-top: 5px;
        }

        .site-entry.mini {
            flex: 0 0 auto;
            flex-direction: row;
            padding: 8px 15px;
            gap: 10px;
            background: #fff;
            min-height: auto;
        }

        .site-entry.mini .entry-content {
            padding: 0;
            flex: 0 0 auto;
        }

        .site-entry.mini .entry-header {
            gap: 10px;
        }

        .site-entry.mini .site-name {
            font-size: 14px;
        }

        .site-entry.mini .favicon {
            width: 20px;
            height: 20px;
        }

        .rotating-earth {
            position: fixed;
            bottom: 0;
            left: 50%;
            transform: translate(-50%, 70%);
            width: 1400px;
            height: 1360px;
            z-index: -1;
            pointer-events: none;
            opacity: 0.85;
            animation: rotateEarth 450s linear infinite;
            filter: drop-shadow(0 0 110px rgba(0, 100, 255, 0.45));
        }

        .limewire-launcher-container {
            position: fixed;
            top: 100px;
            right: -90px;
            z-index: 550;
            pointer-events: none;
        }

        .limewire-rotation-wrapper {
            animation: slowRotate 35s linear infinite;
        }

        @keyframes slowRotate {
            0% { transform: rotate(0deg); }
            100% { transform: rotate(360deg); }
        }

        .limewire-launcher {
            width: 200px;
            height: 200px;
            cursor: pointer;
            transition: all 0.2s ease-in-out;
            filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.25));
            pointer-events: none;
            display: block;
        }

        .limewire-launcher:hover {
            transform: scale(1.1);
            filter: drop-shadow(0 6px 15px rgba(0, 0, 0, 0.3));
        }

        .limewire-launcher:active {
            transform: scale(0.92);
        }

        @keyframes rotateEarth {
            from {
                transform: translate(-50%, 70%) rotate(0deg);
            }

            to {
                transform: translate(-50%, 70%) rotate(360deg);
            }
        }

        /* ============================================
           BAS DE PAGE (FOOTER)
           ============================================ */
        .site-footer {
            width: 100%;
            margin-top: 10px;
            padding-bottom: 10px;
            text-align: center;
            position: relative;
            z-index: 5;
        }

        .footer-line {
            max-width: 850px;
            margin: 40px auto 0 auto;
            height: 2px;
            background: #c8cedb;
        }

        .footer-text {
            display: inline-block;
            font-family: 'Consolas', monospace;
            font-size: 13px;
            font-weight: bold;
            color: #2b5797;
            background: #e1f5fe;
            padding: 5px 15px;
            border-radius: 6px;
            border: 1px solid #b3e5fc;
            text-transform: uppercase;
            letter-spacing: 1px;
            text-decoration: none;
            transition: all 0.2s;
            opacity: 0.85;
            cursor: default;
        }

        .footer-text:hover {
            opacity: 1;
            background: #b3e5fc;
            transform: translateY(-1px);
            box-shadow: 0 4px 8px rgba(43, 87, 151, 0.1);
        }

        /* --- Windows XP Luna Button Style (Auth) --- */
        #auth-nav .btn {
            background: linear-gradient(to bottom, #7ba2f7 0%, #5b8bf7 5%, #4a7ff0 14%, #2662dd 28%, #2662dd 41%, #2662dd 57%, #1e4fc7 71%, #1a47b3 89%, #1640a1 100%) !important;
            border: 1px solid #003c74 !important;
            border-radius: 4px !important;
            color: #ffffff !important;
            font-family: 'Tahoma', 'Verdana', sans-serif !important;
            font-size: 11px !important;
            font-weight: bold !important;
            padding: 2px 15px !important;
            height: 23px !important;
            line-height: 18px !important;
            text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4) !important;
            box-shadow: inset 1px 1px 1px #ffffff, 
                        inset -1px -1px 1px rgba(0,0,0,0.1) !important;
            transition: none !important;
            text-transform: none !important;
            letter-spacing: normal !important;
            margin: 0 4px !important;
            cursor: pointer;
            box-sizing: border-box !important;
            display: inline-flex !important;
            align-items: center !important;
            justify-content: center !important;
        }

        #auth-nav .btn:hover {
            background: linear-gradient(to bottom, #7ba2f7 0%, #6b9cf5 5%, #5b8bf7 14%, #4a7ff0 28%, #3a6df0 41%, #2662dd 57%, #2662dd 71%, #1e4fc7 89%, #1a47b3 100%) !important;
            box-shadow: inset 1px 1px 1px #ffffff, 
                        inset -1px -1px 1px rgba(0,0,0,0.1),
                        0 0 2px #e59700 !important;
            border-color: #003c74 !important;
        }

        #auth-nav .btn:focus {
            outline: 1px dotted #ffffff !important;
            outline-offset: -4px !important;
        }

        #auth-nav .btn:active {
            background: linear-gradient(to bottom, #1640a1 0%, #1a47b3 11%, #1e4fc7 29%, #2662dd 43%, #2662dd 59%, #2662dd 72%, #4a7ff0 86%, #5b8bf7 95%, #7ba2f7 100%) !important;
            box-shadow: none !important;
            padding-top: 3px !important;
            padding-left: 16px !important;
        }

        /* Notifications & Profile Specific XP look */
        #auth-nav .btn-notifications {
            font-size: 13px !important;
            padding: 0 6px !important;
        }

        #auth-nav .btn-lang {
            background: linear-gradient(to bottom, #e3e3e3 0%, #d6d6d6 100%) !important;
            color: #333 !important;
            border-color: #707070 !important;
            text-shadow: none !important;
        }

        #auth-nav-container {
            position: relative;
            z-index: 10000;
        }

        #auth-nav .auth-nav {
            padding: 10px 20px 0 0 !important;
            background: transparent !important;
            box-shadow: none !important;
        }

        #auth-nav #login-btn {
            min-width: 90px;
        }

        #auth-nav #lang-toggle-btn {
            min-width: 45px;
        }

        /* Retro Page views counter */
        .page-views-counter {
            position: fixed;
            bottom: 10px;
            left: 90px; /* Centre de la colonne (40px + 100px / 2) */
            transform: translateX(-50%);
            display: inline-flex;
            align-items: center;
            gap: 8px;
            padding: 5px 10px;
            background: #d6d6d6;
            border: 2px inset #ffffff;
            box-shadow: 1px 1px 0 #000;
            font-family: 'Consolas', 'Courier New', monospace;
            font-size: 11px;
            font-weight: bold;
            color: #333333;
            z-index: 2005;
            user-select: none;
        }

        .page-views-counter .views-count {
            color: #00ff00;
            background: #000000;
            padding: 1px 6px;
            border: 1px inset #555555;
            letter-spacing: 1px;
            text-shadow: 0 0 3px rgba(0, 255, 0, 0.7);
        }

        /* Click Badge */
        .click-badge {
            position: absolute;
            bottom: 5px;
            right: 5px;
            z-index: 10;
            font-size: 10px;
            color: #555;
            background: #eef2f7;
            padding: 1px 5px;
            border-radius: 4px;
            border: 1px solid #c8cedb;
            display: inline-flex;
            align-items: center;
            gap: 3px;
            font-family: 'Consolas', 'Courier New', monospace;
            font-weight: bold;
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
        }

        .click-badge .click-count {
            font-weight: bold;
            color: #2b5797;
        }

        /* Prevent descriptions from being cut off by right overlays */
        .site-entry:has(.site-gif-right) .site-desc {
            padding-right: 60px;
        }



        /* ── SWF Thumbnails Grids & Cards ── */
        .swf-grid {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(98px, 1fr));
            gap: 8px;
            margin-top: 10px;
        }

        .swf-card {
            background: #fff;
            border: 1px solid #d1d9e6;
            border-radius: 8px;
            overflow: hidden;
            display: flex;
            flex-direction: column;
            cursor: pointer;
            transition: all 0.2s ease-in-out;
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
            position: relative;
        }

        .swf-card:hover {
            transform: translateY(-3px);
            border-color: #2b5797;
            box-shadow: 0 6px 15px rgba(43, 87, 151, 0.15);
        }

        .swf-thumb-container {
            width: 100%;
            aspect-ratio: 4 / 3;
            background: #000;
            position: relative;
            overflow: hidden;
        }

        .swf-thumb {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
            transition: transform 0.3s ease;
        }

        .swf-card:hover .swf-thumb {
            transform: scale(1.05);
        }

        .swf-play-overlay {
            position: absolute;
            top: 0; left: 0; right: 0; bottom: 0;
            background: rgba(0, 0, 0, 0.4);
            display: flex;
            align-items: center;
            justify-content: center;
            color: #fff;
            font-size: 24px;
            opacity: 0;
            transition: opacity 0.2s ease;
        }

        .swf-card:hover .swf-play-overlay {
            opacity: 1;
        }

        .swf-card-content {
            padding: 5px 6px;
            display: flex;
            flex-direction: column;
            gap: 4px;
            flex-grow: 1;
            background: #f8f9fa;
            border-top: 1px solid #eee;
        }

        .swf-title {
            font-family: Tahoma, sans-serif;
            font-size: 11px;
            font-weight: bold;
            color: #2b5797;
            line-height: 1.3;
            word-break: break-word;
        }

        .swf-card .click-badge {
            position: absolute;
            bottom: 4px;
            right: 4px;
            z-index: 5;
            font-size: 8px;
            padding: 1px 3px;
            background: rgba(0, 0, 0, 0.7);
            color: #ccc;
            border: 1px solid rgba(255, 255, 255, 0.15);
            border-radius: 3px;
            margin: 0;
            box-shadow: 0 1px 3px rgba(0,0,0,0.5);
            pointer-events: none;
            display: inline-flex;
            align-items: center;
            gap: 2px;
        }

        .swf-card .click-badge .click-count {
            color: #00ff00;
            font-weight: bold;
        }

        /* Accessibilité & Référencement (Masqué visuellement mais lu par les robots) */
        .sr-only {
            position: absolute;
            width: 1px;
            height: 1px;
            padding: 0;
            margin: -1px;
            overflow: hidden;
            clip: rect(0, 0, 0, 0);
            white-space: nowrap;
            border: 0;
        }
    </style>
    <!-- Ruffle Configuration -->
    <script>
        window.RufflePlayer = window.RufflePlayer || {};
        window.RufflePlayer.config = {
            "autoplay": "on",
            "unmuteOverlay": "hidden",
            "showSwfDownload": false
        };
    </script>
    <script defer src="https://unpkg.com/@ruffle-rs/ruffle"></script>
</head>
<!--╔═══════════════════════════════════════════════════════════════════════════════════════════════════════╗    
    ║                                      ██ ACCESSING: LOCAL PAGE ██                                      ║    
    ╚═══════════════════════════════════════════════════════════════════════════════════════════════════════╝-->
<body class="archive-body">
    <!-- Contenu sémantique exhaustif pour les moteurs de recherche (Googlebot) et lecteurs d'écran (100% invisible visuellement) -->
    <header class="sr-only">
        <h1>L'Archive du Vieux Web des Années 2000 - Sites Rétro, Jeux Flash, Sagas MP3 et Animations</h1>
        <p>L'Archive de Slaizen (slaizen.com) est un musée vivant et une archive interactive préservant le patrimoine de la culture Internet francophone et internationale des années 2000 (2000-2008), reconstruit depuis la Wayback Machine et jouable via émulateur Ruffle.</p>
        
        <section>
            <h2>Sites Web Cultes et Rétro Archivés</h2>
            <ul>
                <li><strong>Classiques du Web :</strong> LaPatate.com (Alexis Leclabart et Jonathan Marouani - la chanson de la patate), Perdu.com (Gilles Boccon-Gibod).</li>
                <li><strong>Humour Québécois :</strong> Tom et ses Chums (Édouard Albernhe-Tremblay / Eddie69), LeStupidShow.com (Jitan et Gitan Forcier - Les roux c'est méchant), Follerie.com (Tommy Lajoie).</li>
                <li><strong>Humour Français et Studios Flash :</strong> Le Démon du Rire (Durendal et Junior - reviews cinéma), WFAnimation.com (Robert de Freitas, Vincent Medoukali, Ludovic Girard - Mr Shibby).</li>
                <li><strong>Sagas MP3 et Donjons :</strong> PenOfChaos.com (John Lang / POC - Le Donjon de Naheulbeuk, Chaussette, Gurdil, Enoriel), knarfworld.net (Franck Guillois / Knarf - Les Aventuriers du Survivaure).</li>
                <li><strong>Portails Flash et Gaming :</strong> Newgrounds.com (Tom Fulp - Pico, Madness Combat, Alien Hominid), Radio Canada Jeunesse, Battleon.com (AdventureQuest par Artix / Adam Bohn).</li>
                <li><strong>Communautés et Mangas Naruto :</strong> Captain Naruto, Naruto-MX, JapFlap (scans et dossiers), WoNaruto.</li>
                <li><strong>Making et Création :</strong> RPG Créative (Samarium - vitrine RPG Maker francophone), RPG Story (tutoriels RPG Maker 2000, 2003, XP).</li>
            </ul>
        </section>

        <section>
            <h2>Animations Flash et Séries Légendaires</h2>
            <ul>
                <li><strong>Madness Combat (Krinkels / Newgrounds) :</strong> Madness 1, Madness 2, Madness 3, Madness 4, Madness 5, Madness Combat series complète.</li>
                <li><strong>Joe Cartoon :</strong> Frog in a Blender, Gerbil Microwave, Joe Zombie.</li>
                <li><strong>Classiques et Memes Rétro :</strong> Xiao Xiao (combats stickman de Zhang Lou), Badger Badger Mushroom, Numa Numa (Gary Brolsma), Salad Fingers (David Firth), Charlie the Unicorn.</li>
            </ul>
        </section>

        <section>
            <h2>Jeux Flash Rétro Gratuits (Jouables en ligne via émulateur Ruffle)</h2>
            <ul>
                <li><strong>Jeux Radio-Canada Jeunesse & Classiques Québécois :</strong> La Foire aux mystères (Foire au mystère), jeux Flash de la Zone Jeunesse Radio-Canada des années 2000, aventures interactives et nostalgie télévisuelle jeunesse québécoise.</li>
                <li><strong>Jeux Flash Cultes des Années 2000 :</strong> Jeux Newgrounds (Pico's School, Alien Hominid, Madness Interactive), jeux Flash d'action, de combat, de tir et d'arcade rétro.</li>
                <li><strong>Jeux Web & RPG Amateurs :</strong> Battleon / AdventureQuest (Artix Entertainment), mini-jeux et créations indépendantes RPG Maker 2000, 2003 et XP.</li>
            </ul>
        </section>

        <section>
            <h2>Sagas MP3, Sons MSN et Humour Audio</h2>
            <ul>
                <li><strong>Sagas MP3 Cultes :</strong> Le Donjon de Naheulbeuk, Les Aventuriers du Survivaure, La IIIème Légion, Banal Fantasy, Reflets d'Acide (JBX).</li>
                <li><strong>Sketchs et Humour :</strong> François Pérusse - Les 2 minutes du peuple (Le gars qui magasine, Caroline, Faut pas pousser mémé dans les orties, Le bloc-notes), Les capsules de Pérusse.</li>
                <li><strong>Sons MSN Messenger :</strong> Les Winks et sons Messenger Plus! Live (T'es qui toi, Wizz, Ta gueule, Hello, C'est qui l'patron).</li>
            </ul>
        </section>

        <section>
            <h2>Émoticônes MSN, Gifs Animés et Avatars Rétro</h2>
            <ul>
                <li><strong>Gifs et Emojis MSN :</strong> Packs d'émoticônes animés Forumactif, Smiley Central, packs Vampire vs Lycan, gifs de forums RP des années 2005.</li>
                <li><strong>Gifs Naruto :</strong> Sprites de jeux, pixel-arts, animations de combat, signes de mains (mudras).</li>
                <li><strong>Avatars Rétro :</strong> Collection légendaire des pingouins Tux personnalisés (Tux Ninja, Tux Spiderman, Tux Matrix, Tux Saint Seiya), photos et images humoristiques cultes de 2005.</li>
            </ul>
        </section>
    </header>

    <div id="auth-nav-container"></div>
    <div class="side-column column-left"></div>
    <div class="side-column column-right"></div>
    
    <!-- Retro Page views counter -->
    <div class="page-views-counter">
        <span class="views-label">
            <span class="lang-fr">VISITEURS :</span>
            <span class="lang-en">VISITORS:</span>
        </span>
        <span class="views-count" id="page-views-count">...</span>
    </div>
    <img src="earth.webp" alt="Earth" class="rotating-earth">
    <img src="morla.webp" alt="Morla" class="floating-morla">
    <img src="sims-crystal.gif" alt="Sims Crystal" class="floating-sims">
    <img src="surf.webp" alt="Surf" class="floating-surf">
    <img src="stickfigure.gif" alt="Stickfigure" class="static-stickfigure">
    <img src="logo_windows.webp" alt="Windows Logo" style="position: fixed; bottom: 45px; left: 45px; width: 75px; height: auto; transform: rotate(15deg); z-index: 2004; pointer-events: none; opacity: 0.9; filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.25));">
    <div class="limewire-launcher-container">
        <div class="limewire-rotation-wrapper">
            <img id="limewireLauncher" src="logo_limewire.webp" class="limewire-launcher"
                title="Limewire - Decorative Icon">
        </div>
    </div>

    <div class="mediaplayer-container">
        <div id="audioMonitor" class="audio-monitor">
            <canvas id="waveform"></canvas>
            <div class="track-box">
                <div id="trackDisplay" class="track-display">Chargement...</div>
            </div>
        </div>
        <div id="rotationWrapper" class="rotation-wrapper">
            <img src="logo_mediaplayer.webp" alt="Media Player" class="floating-mediaplayer" onclick="toggleMusic(this)"
                title="Activer/Désactiver la musique">
        </div>
    </div>
    <header>
        <img src="Internet-Explorer-Logo-2005.webp" alt="IE Logo" class="header-logo">
        <div class="header-text">
            <h1 style="display: inline-flex; align-items: center; margin: 0;">
                <div>
                    <span class="lang-fr" style="display: block;">L'Archive du vieux Web</span>
                    <span class="lang-en" style="display: block;">The Old Web Archive</span>
                </div>
                <img src="dialing_slaizen.com.gif" alt="Dialing" style="height: 38px; width: auto; vertical-align: middle; margin-left: 18px; transform: scaleX(-1);">
            </h1>
            <p style="color: #666; margin-top: 5px; font-size: 16px; line-height: 1.4;">
                <span class="lang-fr">Une archive personnelle de la culture Web de l'époque 2005-2008, reconstruite depuis la Wayback Machine et réuploadée sur slaizen.com pour préserver le vieux Web.</span>
                <span class="lang-en">A personal archive of Web culture from the 2005-2008 era, reconstructed from the Wayback Machine and re-uploaded to slaizen.com to preserve the old Web.</span>
            </p>
        </div>
    </header>


        <div class="museum-nav">
        <button class="nav-tab active" data-category="sites" onclick="showCategory('sites')">
            <img src="icon_websites.png" alt="Sites Web" width="16" height="16" style="vertical-align: middle; margin-right: 4px; flex-shrink: 0;">
            <span class="lang-fr">Sites Web</span>
            <span class="lang-en">Websites</span>
        </button>
        <button class="nav-tab" data-category="videos" onclick="showCategory('videos')">
            <img src="icon_videos.png" alt="Vidéos" width="16" height="16" style="vertical-align: middle; margin-right: 4px; flex-shrink: 0;">
            <span class="lang-fr">Vidéos</span>
            <span class="lang-en">Videos</span>
        </button>
        <button class="nav-tab" data-category="games" onclick="showCategory('games')">
            <img src="icon_games.png" alt="Jeux Flash" width="16" height="16" style="vertical-align: middle; margin-right: 4px; flex-shrink: 0;">
            <span class="lang-fr">Jeux Flash</span>
            <span class="lang-en">Flash Games</span>
        </button>
        <button class="nav-tab" data-category="animations" onclick="showCategory('animations')">
            <img src="icon_videos.png" alt="Animations Flash" width="16" height="16" style="vertical-align: middle; margin-right: 4px; flex-shrink: 0;">
            <span class="lang-fr">Animations Flash</span>
            <span class="lang-en">Flash Animations</span>
        </button>
        <button class="nav-tab" data-category="mp3" onclick="showCategory('mp3')">
            <img src="icon_mp3.png" alt="MP3s" width="16" height="16" style="vertical-align: middle; margin-right: 4px; flex-shrink: 0;">
            <span class="lang-fr">MP3s</span>
            <span class="lang-en">MP3s</span>
        </button>
        <button class="nav-tab" data-category="gifs" onclick="showCategory('gifs')">
            <img src="icon_msn.png" alt="Gifs" width="16" height="16" style="vertical-align: middle; margin-right: 4px; flex-shrink: 0;">
            <span class="lang-fr">Gifs</span>
            <span class="lang-en">Gifs</span>
        </button>
        <button class="nav-tab" data-category="images" onclick="showCategory('images')">
            <img src="icon_images.png" alt="Images" width="16" height="16" style="vertical-align: middle; margin-right: 4px; flex-shrink: 0;">
            <span class="lang-fr">Images</span>
            <span class="lang-en">Images</span>
        </button>
    </div>

    <!-- Dynamic Category Description -->
    <div class="category-description" style="max-width: 850px; margin: 0 auto 5px auto; color: #333; font-size: 14px; line-height: 1.5; background: rgba(255, 255, 255, 0.75); border-left: 4px solid #2662dd; padding: 12px 18px; border-radius: 0 8px 8px 0; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05); box-sizing: border-box; display: flex; align-items: center; gap: 10px;">
        <img src="icon_warning.png" alt="Warning" style="width: 16px; height: 16px; flex-shrink: 0;">
        <div>
            <span id="cat-desc-fr" class="lang-fr">Une archive personnelle de vieux sites web disparus, reconstruits depuis la Wayback Machine et réuploadés sur slaizen.com pour préserver le vieux Web.</span>
            <span id="cat-desc-en" class="lang-en">A personal archive of lost websites, reconstructed from the Wayback Machine and re-uploaded to slaizen.com to preserve the old Web.</span>
        </div>
    </div>

    <div id="promo-banner-standard" style="max-width: 850px; margin: 0 auto 10px auto; display: flex; justify-content: center; gap: 0;">
        <!-- Section gauche : Smileys -->
        <div style="display: flex; align-items: center; gap: 8px; background: #fff; padding: 5px 12px;">
            <img src="smiley-central_fog.gif" alt="Smiley Fog" style="width: 65px; height: auto;">
            <embed src="165.swf" type="application/x-shockwave-flash" width="80" height="80">
            <img src="smiley-central_angry.gif" alt="Smiley Angry" style="width: 65px; height: auto;">
            <embed src="163.swf" type="application/x-shockwave-flash" width="80" height="80">
        </div>
        <!-- Section droite : Promo -->
        <div style="display: flex; flex-direction: column; align-items: center; justify-content: center; background: #000; width: 320px; padding: 10px 15px; gap: 8px;">
            <span style="color: #ffe600; font-family: 'Tahoma', sans-serif; font-size: 16px; font-weight: bold; text-align: center;">Get the next generation of Smiley !</span>
            <button style="background: linear-gradient(to bottom, #a8c8ff 0%, #2662dd 35%, #2662dd 100%); color: #fff; border: none; border-radius: 20px; padding: 8px 28px; font-family: 'Tahoma', sans-serif; font-size: 14px; font-weight: bold; cursor: pointer;">click here</button>
        </div>
        <!-- Étiquette Publicité verticale -->
        <div style="writing-mode: vertical-rl; font-family: 'Tahoma', sans-serif; font-size: 10px; font-weight: bold; color: #555; text-transform: uppercase; letter-spacing: 2px; padding: 0 8px; user-select: none; line-height: 1.2; border-left: 1px dashed #c8cedb; display: flex; align-items: center; justify-content: center; background: rgba(255, 255, 255, 0.65);">
            <span class="lang-fr">PUBLICITÉ</span>
            <span class="lang-en">ADS</span>
        </div>
    </div>
    <div id="promo-banner-limewire" style="width: fit-content; margin: 0 auto 10px auto; display: none; justify-content: center; align-items: center; gap: 0;">
        <img src="ads-limewire.gif" alt="Limewire Ad" style="width: 658px; max-width: 100%; height: auto; display: block; margin: 0; box-shadow: 0 4px 10px rgba(0,0,0,0.1); border-radius: 4px;">
        <!-- Étiquette Publicité verticale -->
        <div style="writing-mode: vertical-rl; font-family: 'Tahoma', sans-serif; font-size: 10px; font-weight: bold; color: #555; text-transform: uppercase; letter-spacing: 2px; padding: 0 8px; user-select: none; line-height: 1.2; border-left: 1px dashed #c8cedb; display: flex; align-items: center; justify-content: center; align-self: stretch; background: rgba(255, 255, 255, 0.65);">
            <span class="lang-fr">PUBLICITÉ</span>
            <span class="lang-en">ADS</span>
        </div>
    </div>

    <!-- Sites Web -->
    <div id="sites-content" class="content">
        <div id="sites-list"></div>
    </div>
    <!-- Vidéos Content -->
    <div id="videos-content" class="content" style="display: none;">
        <section class="category-section">
            <h2 class="category-title">
                <span class="lang-fr">Vidéos Rétro 📺</span>
                <span class="lang-en">Retro Videos 📺</span>
            </h2>
            <div id="retro-videos-list" class="site-list"></div>
        </section>
    </div>
    <!-- Jeux Flash -->
    <div id="games-content" class="content" style="display: none;">
        <section class="category-section">
            <h2 class="category-title">
                <span class="lang-fr">Jeux Flash 🎮</span>
                <span class="lang-en">Flash Games 🎮</span>
            </h2>
            <div id="games-list" class="site-list"></div>
        </section>
    </div>
    <!-- Animations Flash -->
    <div id="animations-content" class="content" style="display: none;">
        <section class="category-section">
            <h2 class="category-title">
                <span class="lang-fr">Animations Flash 🎬</span>
                <span class="lang-en">Flash Animations 🎬</span>
            </h2>
            <div id="animations-list" class="site-list"></div>
        </section>
    </div>
    <!-- MP3 -->
    <div id="mp3-content" class="content" style="display: none;">
        <div class="gif-sub-tabs" style="display: flex; gap: 15px; justify-content: center; max-width: 850px; margin: 0 auto 20px auto;">
            <div class="gif-sub-tab active" id="tab-mp3-msn" onclick="switchMp3SubTab('msn')" style="flex: 1; text-align: center; background: rgba(255, 255, 255, 0.85); border: 2px solid #2b5797; border-radius: 10px; padding: 15px; cursor: pointer; font-weight: bold; color: #2b5797; transition: all 0.2s ease; font-size: 18px;">
                <span class="lang-fr">Messenger Plus Sound</span>
                <span class="lang-en">Messenger Plus Sound</span>
            </div>
            <div class="gif-sub-tab" id="tab-mp3-saga" onclick="switchMp3SubTab('saga')" style="flex: 1; text-align: center; background: rgba(255, 255, 255, 0.85); border: 1px solid #d1d9e6; border-radius: 10px; padding: 15px; cursor: pointer; font-weight: bold; color: #555; transition: all 0.2s ease; font-size: 18px;">
                <span class="lang-fr">Saga mp3</span>
                <span class="lang-en">Saga mp3</span>
            </div>
            <div class="gif-sub-tab" id="tab-mp3-humour" onclick="switchMp3SubTab('humour')" style="flex: 1; text-align: center; background: rgba(255, 255, 255, 0.85); border: 1px solid #d1d9e6; border-radius: 10px; padding: 15px; cursor: pointer; font-weight: bold; color: #555; transition: all 0.2s ease; font-size: 18px;">
                <span class="lang-fr">Sketch et Humour</span>
                <span class="lang-en">Sketch and Humor</span>
            </div>
        </div>

        <!-- Sub Content: Messenger Plus Sound -->
        <div id="sub-content-mp3-msn" class="category-section">
            <div id="mp3-msn-list" class="site-list"></div>
        </div>

        <!-- Sub Content: Saga mp3 -->
        <div id="sub-content-mp3-saga" class="category-section" style="display: none;">
            <div id="mp3-saga-list" class="site-list"></div>
        </div>

        <!-- Sub Content: Sketch et Humour -->
        <div id="sub-content-mp3-humour" class="category-section" style="display: none;">
            <div id="mp3-humour-list" class="site-list"></div>
        </div>
    </div>

    <!-- Images (MSN & Personal gifs) -->
    <div id="gifs-content" class="content" style="display: none;">
        <!-- Section: Gifs MSN -->
        <section class="category-section">
            <h2 class="category-title">
                <span class="lang-fr">Gifs MSN</span>
                <span class="lang-en">MSN Gifs</span>
            </h2>
        </section>

        <div class="avatar-selectors" style="max-width: 850px; margin: 0 auto;">
            <!-- Selector: MSN Gifs -->
            <div class="site-entry" id="tab-gif-msn" onclick="switchGifSubCategory('tab-gif-msn', 'msn')" style="cursor: pointer; display: flex; align-items: center; gap: 20px; padding: 15px; background: rgba(255, 255, 255, 0.85); border: 1px solid #d1d9e6; border-radius: 10px; transition: all 0.2s ease; margin-bottom: 10px;">
                <img src="img/gif/msn/boyfatlaughing_slaizen.com.gif" style="width: 60px; height: 60px; object-fit: contain; flex-shrink: 0;" alt="MSN Preview">
                <div style="flex: 1; text-align: left;">
                    <div style="font-size: 16px; font-weight: bold; color: #2b5797; margin-bottom: 4px; display: flex; align-items: center; gap: 8px;">
                        <span class="lang-fr">Gifs MSN Messenger</span>
                        <span class="lang-en">MSN Messenger Gifs</span>
                        <span class="click-badge" style="font-size: 10px; font-weight: normal; color: #555; background: rgba(0,0,0,0.05); padding: 2px 6px; border-radius: 4px; display: inline-flex; align-items: center; gap: 3px; margin-left: 8px;">🖱️ <span class="click-count" data-site="gif_msn">0</span></span>
                    </div>
                    <p style="font-size: 12px; line-height: 1.4; color: #555; margin: 0;">
                        <span class="lang-fr">Une collection de GIFs MSN nostalgiques que j'ai vus passer moi-même à l'époque.</span>
                        <span class="lang-en">A collection of nostalgic MSN GIFs that I personally saw back in the day.</span>
                    </p>
                </div>
            </div>
            <!-- Sub Content: Gifs MSN -->
            <div id="sub-content-gif-msn" style="display: none; margin-bottom: 10px;">
                <div class="site-entry" style="cursor: default; display: block; padding: 15px; max-width: 850px; margin: 0 auto 10px auto;">
                    <div class="entry-content" style="width: 100%; padding-left: 0; gap: 0;">
                        <div id="gifs-msn-list" class="gif-grid" style="display: grid; grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); gap: 12px; margin-top: 5px;">
                            <!-- Dynamically loaded -->
                        </div>
                    </div>
                </div>
            </div>

            <!-- Selector: Smileys Forumactif -->
            <div class="site-entry" id="tab-gif-forumactif" onclick="switchGifSubCategory('tab-gif-forumactif', 'forumactif')" style="cursor: pointer; display: flex; align-items: center; gap: 20px; padding: 15px; background: rgba(255, 255, 255, 0.85); border: 1px solid #d1d9e6; border-radius: 10px; transition: all 0.2s ease; margin-bottom: 10px;">
                <img src="https://illiweb.com/fa/i/smiles/icon_lol.gif" style="width: 60px; height: 60px; object-fit: contain; flex-shrink: 0;" alt="Forumactif Preview">
                <div style="flex: 1; text-align: left;">
                    <div style="font-size: 16px; font-weight: bold; color: #2b5797; margin-bottom: 4px; display: flex; align-items: center; gap: 8px;">
                        <span class="lang-fr">Smileys Forumactif</span>
                        <span class="lang-en">Forumactif Smileys</span>
                        <span class="click-badge" style="font-size: 10px; font-weight: normal; color: #555; background: rgba(0,0,0,0.05); padding: 2px 6px; border-radius: 4px; display: inline-flex; align-items: center; gap: 3px; margin-left: 8px;">🖱️ <span class="click-count" data-site="gif_forumactif">0</span></span>
                    </div>
                    <p style="font-size: 12px; line-height: 1.4; color: #555; margin: 0;">
                        <span class="lang-fr">La collection classique de smileys par défaut des forums Forumactif.</span>
                        <span class="lang-en">The classic default smiley collection from Forumactif forums.</span>
                    </p>
                </div>
            </div>
            <!-- Sub Content: Smileys Forumactif -->
            <div id="sub-content-gif-forumactif" style="display: none; margin-bottom: 10px;">
                <div class="site-entry" style="cursor: default; display: block; padding: 15px; max-width: 850px; margin: 0 auto 10px auto;">
                    <div class="entry-content" style="width: 100%; padding-left: 0; gap: 0;">
                        <div id="gifs-forumactif-list" class="gif-grid" style="display: grid; grid-template-columns: repeat(auto-fill, minmax(48px, 1fr)); gap: 10px; margin-top: 5px; justify-items: center;">
                            <!-- Dynamically loaded -->
                        </div>
                    </div>
                </div>
            </div>

            <!-- Selector: Vampire vs Lycan -->
            <div class="site-entry" id="tab-gif-vampire" onclick="switchGifSubCategory('tab-gif-vampire', 'vampire')" style="cursor: pointer; display: flex; align-items: center; gap: 20px; padding: 15px; background: rgba(255, 255, 255, 0.85); border: 1px solid #d1d9e6; border-radius: 10px; transition: all 0.2s ease; margin-bottom: 10px;">
                <img src="https://2img.net/u/1312/26/09/74/smiles/05072523.gif" style="width: 60px; height: 60px; object-fit: contain; flex-shrink: 0;" alt="Vampire Preview">
                <div style="flex: 1; text-align: left;">
                    <div style="font-size: 16px; font-weight: bold; color: #2b5797; margin-bottom: 4px; display: flex; align-items: center; gap: 8px;">
                        <span class="lang-fr">Vampire vs Lycan</span>
                        <span class="lang-en">Vampire vs Lycan</span>
                        <span class="click-badge" style="font-size: 10px; font-weight: normal; color: #555; background: rgba(0,0,0,0.05); padding: 2px 6px; border-radius: 4px; display: inline-flex; align-items: center; gap: 3px; margin-left: 8px;">🖱️ <span class="click-count" data-site="gif_vampire">0</span></span>
                    </div>
                    <p style="font-size: 12px; line-height: 1.4; color: #555; margin: 0;">
                        <span class="lang-fr">Les emoji personnalisés ajoutés à mon ancien forum RP Vampire vs Lycan.</span>
                        <span class="lang-en">Custom emojis from my old Vampire vs Lycan RP forum.</span>
                    </p>
                </div>
            </div>
            <!-- Sub Content: Vampire vs Lycan -->
            <div id="sub-content-gif-vampire" style="display: none; margin-bottom: 10px;">
                <div class="site-entry" style="cursor: default; display: block; padding: 15px; max-width: 850px; margin: 0 auto 10px auto;">
                    <div class="entry-content" style="width: 100%; padding-left: 0; gap: 0;">
                        <div id="gifs-vampire-list" class="gif-grid" style="display: grid; grid-template-columns: repeat(auto-fill, minmax(48px, 1fr)); gap: 10px; margin-top: 5px; justify-items: center;">
                            <!-- Dynamically loaded -->
                        </div>
                    </div>
                </div>
            </div>

            <!-- Selector: GIFs Personnels -->
            <div class="site-entry" id="tab-gif-personnal" onclick="switchGifSubCategory('tab-gif-personnal', 'personnal')" style="cursor: pointer; display: flex; align-items: center; gap: 20px; padding: 15px; background: rgba(255, 255, 255, 0.85); border: 1px solid #d1d9e6; border-radius: 10px; transition: all 0.2s ease; margin-bottom: 10px;">
                <img src="https://illiweb.com/fa/i/smiles/icon_cool.gif" style="width: 60px; height: 60px; object-fit: contain; flex-shrink: 0;" alt="Personal Preview">
                <div style="flex: 1; text-align: left;">
                    <div style="font-size: 16px; font-weight: bold; color: #2b5797; margin-bottom: 4px; display: flex; align-items: center; gap: 8px;">
                        <span class="lang-fr">GIFs Personnels</span>
                        <span class="lang-en">Personal GIFs</span>
                        <span class="click-badge" style="font-size: 10px; font-weight: normal; color: #555; background: rgba(0,0,0,0.05); padding: 2px 6px; border-radius: 4px; display: inline-flex; align-items: center; gap: 3px; margin-left: 8px;">🖱️ <span class="click-count" data-site="gif_personnal">0</span></span>
                    </div>
                    <p style="font-size: 12px; line-height: 1.4; color: #555; margin: 0;">
                        <span class="lang-fr">Ce sont des packs de gifs que j'ai retrouvés gravés sur un vieux CD.</span>
                        <span class="lang-en">These are GIF packs that I found burned on an old CD.</span>
                    </p>
                </div>
            </div>
            <!-- Sub Content: GIFs Personnels -->
            <div id="sub-content-gif-personnal" style="display: none; margin-bottom: 10px;">
                <div class="site-entry" style="cursor: default; display: block; padding: 15px; max-width: 850px; margin: 0 auto 10px auto;">
                    <div class="entry-content" style="width: 100%; padding-left: 0; gap: 0;">
                        <div id="gifs-personnal-list" class="gif-grid" style="display: grid; grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); gap: 12px; margin-top: 5px;">
                            <!-- Dynamically loaded -->
                        </div>
                    </div>
                </div>
            </div>
            <!-- Selector: Smiley Central -->
            <div class="site-entry" id="tab-gif-smiley-central" onclick="switchGifSubCategory('tab-gif-smiley-central', 'smiley-central')" style="cursor: pointer; display: flex; align-items: center; gap: 20px; padding: 15px; background: rgba(255, 255, 255, 0.85); border: 1px solid #d1d9e6; border-radius: 10px; transition: all 0.2s ease; margin-bottom: 10px;">
                <img src="https://illiweb.com/fa/i/smiles/icon_confused.png" style="width: 60px; height: 60px; object-fit: contain; flex-shrink: 0;" alt="Smiley Central Preview">
                <div style="flex: 1; text-align: left;">
                    <div style="font-size: 16px; font-weight: bold; color: #2b5797; margin-bottom: 4px; display: flex; align-items: center; gap: 8px;">
                        <span class="lang-fr">Smiley Central</span>
                        <span class="lang-en">Smiley Central</span>
                        <span class="click-badge" style="font-size: 10px; font-weight: normal; color: #555; background: rgba(0,0,0,0.05); padding: 2px 6px; border-radius: 4px; display: inline-flex; align-items: center; gap: 3px; margin-left: 8px;">🖱️ <span class="click-count" data-site="gif_smiley_central">0</span></span>
                    </div>
                    <p style="font-size: 12px; line-height: 1.4; color: #555; margin: 0;">
                        <span class="lang-fr">Les célèbres émoticônes de Smiley Central très populaires sur MSN Messenger dans les années 2000.</span>
                        <span class="lang-en">The famous Smiley Central emoticons that were highly popular on MSN Messenger in the 2000s.</span>
                    </p>
                </div>
            </div>
            <!-- Sub Content: Smiley Central -->
            <div id="sub-content-gif-smiley-central" style="display: none; margin-bottom: 10px;">
                <div class="site-entry" style="cursor: default; display: block; padding: 15px; text-align: center; font-style: italic; color: #666; max-width: 850px; margin: 0 auto 10px auto;">
                    <span class="lang-fr">Section Smiley Central vide pour le moment.</span>
                    <span class="lang-en">Smiley Central section is empty for now.</span>
                </div>
            </div>
        </div>

        <!-- Section: Gifs Naruto -->
        <section class="category-section">
            <h2 class="category-title">
                <span class="lang-fr">Gifs Naruto</span>
                <span class="lang-en">Naruto Gifs</span>
            </h2>
        </section>

        <div class="avatar-selectors" style="max-width: 850px; margin: 0 auto;">
            <!-- Selector: Collection Border (Gif Anime (with border)) -->
            <div class="site-entry" id="tab-gif-naruto-border" onclick="switchGifSubCategory('tab-gif-naruto-border', 'naruto-border')" style="cursor: pointer; display: flex; align-items: center; gap: 20px; padding: 15px; background: rgba(255, 255, 255, 0.85); border: 1px solid #d1d9e6; border-radius: 10px; transition: all 0.2s ease; margin-bottom: 10px;">
                <img src="img/gif/naruto/border/shikamaru02_slaizen.com.gif" style="width: 60px; height: 60px; object-fit: contain; flex-shrink: 0;" alt="Border Preview">
                <div style="flex: 1; text-align: left;">
                    <div style="font-size: 16px; font-weight: bold; color: #2b5797; margin-bottom: 4px; display: flex; align-items: center; gap: 8px;">
                        <span class="lang-fr">Gif Anime (with border)</span>
                        <span class="lang-en">Gif Anime (with border)</span>
                        <span class="click-badge" style="font-size: 10px; font-weight: normal; color: #555; background: rgba(0,0,0,0.05); padding: 2px 6px; border-radius: 4px; display: inline-flex; align-items: center; gap: 3px; margin-left: 8px;">🖱️ <span class="click-count" data-site="gif_naruto_border">0</span></span>
                    </div>
                    <p style="font-size: 12px; line-height: 1.4; color: #555; margin: 0;">
                        <span class="lang-fr">Des bordures et séparateurs animés sur le thème de Naruto.</span>
                        <span class="lang-en">Animated borders and separators on the Naruto theme.</span>
                    </p>
                </div>
            </div>
            <!-- Sub Content: Collection Border -->
            <div id="sub-content-gif-naruto-border" style="display: none; margin-bottom: 10px;">
                <div class="site-entry" style="cursor: default; display: block; padding: 15px; max-width: 850px; margin: 0 auto 10px auto;">
                    <div class="entry-content" style="width: 100%; padding-left: 0; gap: 0;">
                        <div id="gifs-naruto-border-list" class="gif-grid" style="display: grid; grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); gap: 12px; margin-top: 5px; justify-items: center;">
                            <!-- Dynamically loaded -->
                        </div>
                    </div>
                </div>
            </div>

            <!-- Selector: GIFs Naruto (Gif anime) -->
            <div class="site-entry" id="tab-gif-naruto-main" onclick="switchGifSubCategory('tab-gif-naruto-main', 'naruto-main')" style="cursor: pointer; display: flex; align-items: center; gap: 20px; padding: 15px; background: rgba(255, 255, 255, 0.85); border: 1px solid #d1d9e6; border-radius: 10px; transition: all 0.2s ease; margin-bottom: 10px;">
                <img src="img/gif/naruto/anime/naruto27_slaizen.com.gif" style="width: 60px; height: 60px; object-fit: contain; flex-shrink: 0;" alt="Anime Preview">
                <div style="flex: 1; text-align: left;">
                    <div style="font-size: 16px; font-weight: bold; color: #2b5797; margin-bottom: 4px; display: flex; align-items: center; gap: 8px;">
                        <span class="lang-fr">Gif anime</span>
                        <span class="lang-en">Gif anime</span>
                        <span class="click-badge" style="font-size: 10px; font-weight: normal; color: #555; background: rgba(0,0,0,0.05); padding: 2px 6px; border-radius: 4px; display: inline-flex; align-items: center; gap: 3px; margin-left: 8px;">🖱️ <span class="click-count" data-site="gif_naruto_main">0</span></span>
                    </div>
                    <p style="font-size: 12px; line-height: 1.4; color: #555; margin: 0;">
                        <span class="lang-fr">Ma galerie de GIFs Naruto nostalgiques d'époque.</span>
                        <span class="lang-en">My gallery of nostalgic Naruto GIFs.</span>
                    </p>
                </div>
            </div>
            <!-- Sub Content: GIFs Naruto -->
            <div id="sub-content-gif-naruto-main" style="display: none; margin-bottom: 10px;">
                <div class="site-entry" style="cursor: default; display: block; padding: 15px; max-width: 850px; margin: 0 auto 10px auto;">
                    <div class="entry-content" style="width: 100%; padding-left: 0; gap: 0;">
                        <div id="gifs-naruto-list" class="gif-grid" style="display: grid; grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); gap: 12px; margin-top: 5px;">
                            <!-- Dynamically loaded -->
                        </div>
                    </div>
                </div>
            </div>

            <!-- Selector: Collection Chibi -->
            <div class="site-entry" id="tab-gif-naruto-chibi" onclick="switchGifSubCategory('tab-gif-naruto-chibi', 'naruto-chibi')" style="cursor: pointer; display: flex; align-items: center; gap: 20px; padding: 15px; background: rgba(255, 255, 255, 0.85); border: 1px solid #d1d9e6; border-radius: 10px; transition: all 0.2s ease; margin-bottom: 10px;">
                <img src="https://2img.net/u/2614/22/98/93/smiles/sasuke.gif" style="width: 60px; height: 60px; object-fit: contain; flex-shrink: 0;" alt="Chibi Preview">
                <div style="flex: 1; text-align: left;">
                    <div style="font-size: 16px; font-weight: bold; color: #2b5797; margin-bottom: 4px; display: flex; align-items: center; gap: 8px;">
                        <span class="lang-fr">Floating Heads</span>
                        <span class="lang-en">Floating Heads</span>
                        <span class="click-badge" style="font-size: 10px; font-weight: normal; color: #555; background: rgba(0,0,0,0.05); padding: 2px 6px; border-radius: 4px; display: inline-flex; align-items: center; gap: 3px; margin-left: 8px;">🖱️ <span class="click-count" data-site="gif_naruto_chibi">0</span></span>
                    </div>
                    <p style="font-size: 12px; line-height: 1.4; color: #555; margin: 0;">
                        <span class="lang-fr">Les versions Chibi animées des personnages de Naruto.</span>
                        <span class="lang-en">Animated Chibi versions of Naruto characters.</span>
                    </p>
                </div>
            </div>
            <!-- Sub Content: Collection Chibi -->
            <div id="sub-content-gif-naruto-chibi" style="display: none; margin-bottom: 10px;">
                <div class="site-entry" style="cursor: default; display: block; padding: 15px; max-width: 850px; margin: 0 auto 10px auto;">
                    <div class="entry-content" style="width: 100%; padding-left: 0; gap: 0;">
                        <div id="gifs-naruto-chibi-list" class="gif-grid" style="display: grid; grid-template-columns: repeat(auto-fill, minmax(48px, 1fr)); gap: 10px; margin-top: 5px; justify-items: center;">
                            <!-- Dynamically loaded -->
                        </div>
                    </div>
                </div>
            </div>

            <!-- Selector: Collection Signe / Perso -->
            <div class="site-entry" id="tab-gif-naruto-signe" onclick="switchGifSubCategory('tab-gif-naruto-signe', 'naruto-signe')" style="cursor: pointer; display: flex; align-items: center; gap: 20px; padding: 15px; background: rgba(255, 255, 255, 0.85); border: 1px solid #d1d9e6; border-radius: 10px; transition: all 0.2s ease; margin-bottom: 10px;">
                <img src="https://2img.net/u/2614/22/98/93/smiles/tigre.gif" style="width: 60px; height: 60px; object-fit: contain; flex-shrink: 0;" alt="Signe Preview">
                <div style="flex: 1; text-align: left;">
                    <div style="font-size: 16px; font-weight: bold; color: #2b5797; margin-bottom: 4px; display: flex; align-items: center; gap: 8px;">
                        <span class="lang-fr">Hand Sign</span>
                        <span class="lang-en">Hand Sign</span>
                        <span class="click-badge" style="font-size: 10px; font-weight: normal; color: #555; background: rgba(0,0,0,0.05); padding: 2px 6px; border-radius: 4px; display: inline-flex; align-items: center; gap: 3px; margin-left: 8px;">🖱️ <span class="click-count" data-site="gif_naruto_signe">0</span></span>
                    </div>
                    <p style="font-size: 12px; line-height: 1.4; color: #555; margin: 0;">
                        <span class="lang-fr">Les signes de mains et portraits de personnages pour le forum RPG.</span>
                        <span class="lang-en">Hand signs and character avatars for the RP forum.</span>
                    </p>
                </div>
            </div>
            <!-- Sub Content: Collection Signe / Perso -->
            <div id="sub-content-gif-naruto-signe" style="display: none; margin-bottom: 10px;">
                <div class="site-entry" style="cursor: default; display: block; padding: 15px; max-width: 850px; margin: 0 auto 10px auto;">
                    <div class="entry-content" style="width: 100%; padding-left: 0; gap: 0;">
                        <div id="gifs-naruto-signe-list" class="gif-grid" style="display: grid; grid-template-columns: repeat(auto-fill, minmax(48px, 1fr)); gap: 10px; margin-top: 5px; justify-items: center;">
                            <!-- Dynamically loaded -->
                        </div>
                    </div>
                </div>
            </div>

            <!-- Selector: Collection Pixels (pixels characters) -->
            <div class="site-entry" id="tab-gif-naruto-pixel" onclick="switchGifSubCategory('tab-gif-naruto-pixel', 'naruto-pixel')" style="cursor: pointer; display: flex; align-items: center; gap: 20px; padding: 15px; background: rgba(255, 255, 255, 0.85); border: 1px solid #d1d9e6; border-radius: 10px; transition: all 0.2s ease; margin-bottom: 10px;">
                <img src="img/gif/naruto/pixels/run-naruto_slaizen.com.gif" style="width: 60px; height: 60px; object-fit: contain; flex-shrink: 0;" alt="Pixel Preview">
                <div style="flex: 1; text-align: left;">
                    <div style="font-size: 16px; font-weight: bold; color: #2b5797; margin-bottom: 4px; display: flex; align-items: center; gap: 8px;">
                        <span class="lang-fr">Pixels Characters</span>
                        <span class="lang-en">Pixels Characters</span>
                        <span class="click-badge" style="font-size: 10px; font-weight: normal; color: #555; background: rgba(0,0,0,0.05); padding: 2px 6px; border-radius: 4px; display: inline-flex; align-items: center; gap: 3px; margin-left: 8px;">🖱️ <span class="click-count" data-site="gif_naruto_pixel">0</span></span>
                    </div>
                    <p style="font-size: 12px; line-height: 1.4; color: #555; margin: 0;">
                        <span class="lang-fr">Petites icônes, pixel-arts et emojis rétro de Naruto.</span>
                        <span class="lang-en">Small retro icons, pixel-arts and emojis of Naruto.</span>
                    </p>
                </div>
            </div>
            <!-- Sub Content: Collection Pixels -->
            <div id="sub-content-gif-naruto-pixel" style="display: none; margin-bottom: 10px;">
                <div class="site-entry" style="cursor: default; display: block; padding: 15px; max-width: 850px; margin: 0 auto 10px auto;">
                    <div class="entry-content" style="width: 100%; padding-left: 0; gap: 0;">
                        <div id="gifs-naruto-pixel-list" class="gif-grid" style="display: grid; grid-template-columns: repeat(auto-fill, minmax(48px, 1fr)); gap: 10px; margin-top: 5px; justify-items: center;">
                            <!-- Dynamically loaded -->
                        </div>
                    </div>
                </div>
            </div>

            <!-- Selector: Collection Sprites (Games Sprites) -->
            <div class="site-entry" id="tab-gif-naruto-sprite" onclick="switchGifSubCategory('tab-gif-naruto-sprite', 'naruto-sprite')" style="cursor: pointer; display: flex; align-items: center; gap: 20px; padding: 15px; background: rgba(255, 255, 255, 0.85); border: 1px solid #d1d9e6; border-radius: 10px; transition: all 0.2s ease; margin-bottom: 10px;">
                <img src="img/gif/naruto/sprites/naruto_slaizen.com.gif" style="width: 60px; height: 60px; object-fit: contain; flex-shrink: 0;" alt="Sprite Preview">
                <div style="flex: 1; text-align: left;">
                    <div style="font-size: 16px; font-weight: bold; color: #2b5797; margin-bottom: 4px; display: flex; align-items: center; gap: 8px;">
                        <span class="lang-fr">Games Sprites</span>
                        <span class="lang-en">Games Sprites</span>
                        <span class="click-badge" style="font-size: 10px; font-weight: normal; color: #555; background: rgba(0,0,0,0.05); padding: 2px 6px; border-radius: 4px; display: inline-flex; align-items: center; gap: 3px; margin-left: 8px;">🖱️ <span class="click-count" data-site="gif_naruto_sprite">0</span></span>
                    </div>
                    <p style="font-size: 12px; line-height: 1.4; color: #555; margin: 0;">
                        <span class="lang-fr">Sprites d'animation et de combat des jeux rétro Naruto.</span>
                        <span class="lang-en">Animation and battle sprites from retro Naruto games.</span>
                    </p>
                </div>
            </div>
            <!-- Sub Content: Collection Sprites -->
            <div id="sub-content-gif-naruto-sprite" style="display: none; margin-bottom: 10px;">
                <div class="site-entry" style="cursor: default; display: block; padding: 15px; max-width: 850px; margin: 0 auto 10px auto;">
                    <div class="entry-content" style="width: 100%; padding-left: 0; gap: 0;">
                        <div id="gifs-naruto-sprite-list" class="gif-grid" style="display: grid; grid-template-columns: repeat(auto-fill, minmax(48px, 1fr)); gap: 10px; margin-top: 5px; justify-items: center;">
                            <!-- Dynamically loaded -->
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Images Gallery -->
    <div id="images-content" class="content" style="display: none;">
        <!-- Section: Avatar -->
        <section class="category-section">
            <h2 class="category-title">
                <span class="lang-fr">Avatars</span>
                <span class="lang-en">Avatars</span>
            </h2>
        </section>

        <!-- Sub Content: Avatar -->
        <div id="sub-content-img-avatar">
            <!-- 2 Vertical blocks for Avatars selection -->
            <!-- 2 Vertical blocks for Avatars selection -->
            <div class="avatar-selectors" style="max-width: 850px; margin: 0 auto;">
                <!-- Card Tux -->
                <div class="site-entry" id="tab-avatar-tux" onclick="switchAvatarSubTab('tux')" style="cursor: pointer; display: flex; align-items: center; gap: 20px; padding: 15px; background: rgba(255, 255, 255, 0.85); border: 1px solid #d1d9e6; border-radius: 10px; transition: all 0.2s ease; margin-bottom: 10px;">
                    <img src="img/avatar/tux/tux-v1_ninja_slaizen.com.png" style="width: 60px; height: 60px; object-fit: contain; flex-shrink: 0;" alt="Tux Preview">
                    <div style="flex: 1; text-align: left;">
                        <div style="font-size: 16px; font-weight: bold; color: #2b5797; margin-bottom: 4px; display: flex; align-items: center; gap: 8px;">
                            <span class="lang-fr">Avatar Tux 🐧</span>
                            <span class="lang-en">Tux Avatars 🐧</span>
                            <span class="click-badge" style="font-size: 10px; font-weight: normal; color: #555; background: rgba(0,0,0,0.05); padding: 2px 6px; border-radius: 4px; display: inline-flex; align-items: center; gap: 3px; margin-left: 8px;">🖱️ <span class="click-count" data-site="img_avatar_tux">0</span></span>
                        </div>
                        <p style="font-size: 12px; line-height: 1.4; color: #555; margin: 0;">
                            <span class="lang-fr">La célèbre collection d'avatars de Tux personnalisés (Spiderman, Saint Seiya, Matrix, etc.).</span>
                            <span class="lang-en">The famous collection of customized Tux avatars (Spiderman, Saint Seiya, Matrix, etc.).</span>
                        </p>
                    </div>
                </div>

                <!-- Content for Avatar Tux -->
                <div id="sub-content-avatar-tux" style="display: none; margin-bottom: 10px;">
                    <div class="site-entry" style="cursor: default; display: block; padding: 15px; max-width: 850px; margin: 0 auto 10px auto;">
                        <div class="entry-content" style="width: 100%; padding-left: 0; gap: 0;">
                            <div class="entry-header" style="margin-bottom: 0px;">
                                <span class="site-name" style="font-size: 18px; font-weight: bold; color: #2b5797;">
                                    <span class="lang-fr">Avatar Tux 🐧</span>
                                    <span class="lang-en">Tux Avatars 🐧</span>
                                </span>
                            </div>
                            <p style="font-size: 13px; line-height: 1.5; color: #333; margin-top: 10px; margin-bottom: 15px;">
                                <span class="lang-fr">Les avatars Tux personnalisés représentent la mascotte officielle de Linux, Tux, costumée ou modifiée pour incarner divers personnages célèbres de la culture pop, de films, de jeux vidéo ou d'animes. Très populaires dans les années 2000, ils étaient largement utilisés comme images de profil sur les forums de discussion.</span>
                                <span class="lang-en">Custom Tux avatars feature the official Linux mascot, Tux, dressed up or modified to represent various famous pop culture, movie, video game, or anime characters. Highly popular in the 2000s, they were widely used as profile pictures on internet discussion forums.</span>
                            </p>
                            <!-- Grille des 4 Tux phares -->
                            <div id="tux-top-list" class="gif-grid" style="display: grid; grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); gap: 12px; margin-top: 15px; margin-bottom: 15px;">
                                <!-- Dynamically loaded -->
                            </div>
                            <!-- Description CD 2005 -->
                            <p class="site-desc" style="font-size: 13px; line-height: 1.5; color: #555; margin-bottom: 10px; font-style: italic;">
                                <span class="lang-fr">Note : À l'époque, j'étais fasciné par la personnalisation des avatars Tux. Sans même connaître leur provenance, je les voyais partout sur les forums. Ces 4 là ont été retrouvés gravés sur l'un de mes CD en 2005.</span>
                                <span class="lang-en">Note: Back then, I was fascinated by the customizability of Tux avatars. Without even knowing their origin, I saw them everywhere on forums. These 4 were found burned on one of my CDs in 2005.</span>
                            </p>
                            <p style="font-size: 12px; margin-bottom: 25px;">
                                <span class="lang-fr">Source du projet : <a href="https://github.com/maekind/tux-avatar-project" target="_blank" style="color: #2b5797; text-decoration: underline;">Tux Avatar Project on GitHub</a></span>
                                <span class="lang-en">Project source: <a href="https://github.com/maekind/tux-avatar-project" target="_blank" style="color: #2b5797; text-decoration: underline;">Tux Avatar Project on GitHub</a></span>
                            </p>
                            
                            <!-- Section Tux Version 1 -->
                            <h3 style="font-size: 15px; font-weight: bold; color: #2b5797; margin-top: 20px; margin-bottom: 10px;">
                                <span class="lang-fr">Tux Version 1</span>
                                <span class="lang-en">Tux Version 1</span>
                            </h3>
                            <div id="tux-v1-list" class="gif-grid" style="display: grid; grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); gap: 12px; margin-bottom: 25px;">
                                <!-- Dynamically loaded -->
                            </div>

                            <!-- Section Tux Version 2 -->
                            <h3 style="font-size: 15px; font-weight: bold; color: #2b5797; margin-top: 20px; margin-bottom: 10px;">
                                <span class="lang-fr">Tux Version 2</span>
                                <span class="lang-en">Tux Version 2</span>
                            </h3>
                            <div id="tux-v2-list" class="gif-grid" style="display: grid; grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); gap: 12px;">
                                <!-- Dynamically loaded -->
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Card Forumactif -->
                <div class="site-entry" id="tab-avatar-forumactif" onclick="switchAvatarSubTab('forumactif')" style="cursor: pointer; display: flex; align-items: center; gap: 20px; padding: 15px; background: rgba(255, 255, 255, 0.85); border: 1px solid #d1d9e6; border-radius: 10px; transition: all 0.2s ease; margin-bottom: 15px;">
                    <img src="img/avatar/forumactif/Cinema_f_12_slaizen.com.jpg" style="width: 60px; height: 60px; object-fit: contain; flex-shrink: 0;" alt="Forumactif Preview">
                    <div style="flex: 1; text-align: left;">
                        <div style="font-size: 16px; font-weight: bold; color: #2b5797; margin-bottom: 4px; display: flex; align-items: center; gap: 8px;">
                            <span class="lang-fr">Avatar Forumactif 🛡️</span>
                            <span class="lang-en">Forumactif Avatars 🛡️</span>
                            <span class="click-badge" style="font-size: 10px; font-weight: normal; color: #555; background: rgba(0,0,0,0.05); padding: 2px 6px; border-radius: 4px; display: inline-flex; align-items: center; gap: 3px; margin-left: 8px;">🖱️ <span class="click-count" data-site="img_avatar_forumactif">0</span></span>
                        </div>
                        <p style="font-size: 12px; line-height: 1.4; color: #555; margin: 0;">
                            <span class="lang-fr">La collection classique d'avatars rétro intégrés par défaut sur les forums Forumactif.</span>
                            <span class="lang-en">The classic collection of retro avatars integrated by default on Forumactif forums.</span>
                        </p>
                    </div>
                </div>

                <!-- Content for Avatar Forumactif -->
                <div id="sub-content-avatar-forumactif" style="display: none; margin-bottom: 10px;">
                    <div class="site-entry" style="cursor: default; display: block; padding: 15px; max-width: 850px; margin: 0 auto 10px auto;">
                        <div class="entry-content" style="width: 100%; padding-left: 0; gap: 0;">
                            <div class="entry-header" style="margin-bottom: 0px;">
                                <span class="site-name" style="font-size: 18px; font-weight: bold; color: #2b5797;">
                                    <span class="lang-fr">Avatar Forumactif 🛡️</span>
                                    <span class="lang-en">Forumactif Avatars 🛡️</span>
                                </span>
                            </div>
                            <p class="site-desc" style="font-size: 13px; line-height: 1.5; color: #555; margin-bottom: 25px; font-style: italic;">
                                <span class="lang-fr">La collection classique d'avatars qui étaient proposés par défaut sur les forums Forumactif de l'époque.</span>
                                <span class="lang-en">The classic collection of default avatars that were offered on Forumactif forums back in the day.</span>
                            </p>
                            
                            <div id="forumactif-avatars-list">
                                <!-- Dynamically loaded -->
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- Section: Wallpaper -->
        <section class="category-section" style="margin-top: 15px;">
            <h2 class="category-title">
                <span class="lang-fr">Wallpapers</span>
                <span class="lang-en">Wallpapers</span>
            </h2>
        </section>
        <div id="sub-content-img-wallpaper" style="max-width: 850px; margin: 0 auto 10px auto;">
            <div class="site-entry" style="cursor: default; display: block; padding: 15px; text-align: center; font-style: italic; color: #666;">
                <span class="lang-fr">Section Wallpaper vide pour le moment.</span>
                <span class="lang-en">Wallpaper section is empty for now.</span>
            </div>
        </div>

        <!-- Section: Humour -->
        <section class="category-section" style="margin-top: 15px;">
            <h2 class="category-title">
                <span class="lang-fr">Humour</span>
                <span class="lang-en">Humor</span>
            </h2>
        </section>
        
        <!-- Card Humour Rétro -->
        <div class="avatar-selectors" style="max-width: 850px; margin: 0 auto 10px auto;">
            <div class="site-entry" id="tab-avatar-humour" onclick="switchAvatarSubTab('humour')" style="cursor: pointer; display: flex; align-items: center; gap: 20px; padding: 15px; background: rgba(255, 255, 255, 0.85); border: 1px solid #d1d9e6; border-radius: 10px; transition: all 0.2s ease;">
                <img src="img/humor/beanbaby_slaizen.com.jpg" style="width: 60px; height: 60px; object-fit: contain; flex-shrink: 0;" alt="Humour Preview">
                <div style="flex: 1; text-align: left;">
                    <div style="font-size: 16px; font-weight: bold; color: #2b5797; margin-bottom: 4px; display: flex; align-items: center; gap: 8px;">
                        <span class="lang-fr">Humour Rétro 🎭</span>
                        <span class="lang-en">Retro Humor 🎭</span>
                        <span class="click-badge" style="font-size: 10px; font-weight: normal; color: #555; background: rgba(0,0,0,0.05); padding: 2px 6px; border-radius: 4px; display: inline-flex; align-items: center; gap: 3px; margin-left: 8px;">🖱️ <span class="click-count" data-site="img_humour">0</span></span>
                    </div>
                    <p style="font-size: 12px; line-height: 1.4; color: #555; margin: 0;">
                        <span class="lang-fr">Images drôles et insolites d'époque issues de mes archives de 2005.</span>
                        <span class="lang-en">Funny and unusual images from back in the day from my 2005 archives.</span>
                    </p>
                </div>
            </div>
        </div>

        <!-- Content for Humour Rétro -->
        <div id="sub-content-img-humour" style="display: none; max-width: 850px; margin: 0 auto;">
            <div class="site-entry" style="cursor: default; display: block; padding: 15px;">
                <div class="entry-content" style="width: 100%; padding-left: 0; gap: 0;">
                    <div class="entry-header" style="margin-bottom: 0px;">
                        <span class="site-name" style="font-size: 18px; font-weight: bold; color: #2b5797;">
                            <span class="lang-fr">Humour Rétro 🎭</span>
                            <span class="lang-en">Retro Humor 🎭</span>
                        </span>
                    </div>
                    <p class="site-desc" style="font-size: 13px; line-height: 1.5; color: #555; margin-bottom: 8px;">
                        <span class="lang-fr">Ce sont des images drôles et insolites qu'on voyait beaucoup circuler à l'époque, issues de mes archives de 2005.</span>
                        <span class="lang-en">These are funny and unusual images that circulated a lot back in the day, from my 2005 archives.</span>
                    </p>
                    <div id="humor-images-list" class="gif-grid" style="display: grid; grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); gap: 12px; margin-top: 15px;">
                        <!-- Dynamically loaded -->
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- ── Video Modal ── -->
    <div id="videoModal" onclick="handleVideoModalClick(event)">
        <div id="videoModalCard">
            <div id="videoModalHeader">
                <span id="videoModalTitle">Vidéo</span>
                <button id="videoModalClose" onclick="closeVideoModal()">&#215;</button>
            </div>
            <div id="videoModalBody" style="position: relative;">
                <div id="videoPartSelector" style="display: none; padding: 30px 10px; text-align: center; flex-direction: column; gap: 15px; align-items: center; justify-content: center; height: 100%; box-sizing: border-box; background: #fff;">
                    <p style="font-family: Tahoma, sans-serif; font-size: 14px; font-weight: bold; color: #2b5797; margin: 0 0 10px 0;">
                        <span class="lang-fr">Choisissez la partie à visionner :</span>
                        <span class="lang-en">Choose the part to watch:</span>
                    </p>
                    <div style="display: flex; gap: 15px; justify-content: center; width: 100%;">
                        <button id="btnPart1" class="btn-retro" style="padding: 10px 20px; font-family: Tahoma, sans-serif; font-size: 12px; font-weight: bold; cursor: pointer; background: #2b5797; color: white; border: 1px solid #1e3f7a; border-radius: 4px; flex: 1; max-width: 150px; transition: background 0.2s;">
                            <span class="lang-fr">Partie 1</span>
                            <span class="lang-en">Part 1</span>
                        </button>
                        <button id="btnPart2" class="btn-retro" style="padding: 10px 20px; font-family: Tahoma, sans-serif; font-size: 12px; font-weight: bold; cursor: pointer; background: #2b5797; color: white; border: 1px solid #1e3f7a; border-radius: 4px; flex: 1; max-width: 150px; transition: background 0.2s;">
                            <span class="lang-fr">Partie 2</span>
                            <span class="lang-en">Part 2</span>
                        </button>
                    </div>
                </div>
                <iframe id="videoPlayerFrame" src="" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen style="width: 100%; height: 100%;"></iframe>
            </div>
        </div>
    </div>

    <!-- Image Modal -->
    <div id="imageModal" style="display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.85); z-index: 10000; justify-content: center; align-items: center; cursor: pointer; padding: 20px; box-sizing: border-box;" onclick="this.style.display='none'">
        <!-- Navigation Arrows -->
        <button id="imageModalPrev" onclick="navigateGallery(-1); event.stopPropagation();" style="display: none; position: absolute; left: 20px; top: 50%; transform: translateY(-50%); background: rgba(0,0,0,0.5); border: 1px solid rgba(255,255,255,0.3); border-radius: 50%; width: 50px; height: 50px; color: white; font-size: 28px; cursor: pointer; justify-content: center; align-items: center; user-select: none; transition: all 0.2s; z-index: 10002;" onmouseenter="this.style.background='rgba(255,255,255,0.2)'" onmouseleave="this.style.background='rgba(0,0,0,0.5)'">&#10094;</button>
        <button id="imageModalNext" onclick="navigateGallery(1); event.stopPropagation();" style="display: none; position: absolute; right: 20px; top: 50%; transform: translateY(-50%); background: rgba(0,0,0,0.5); border: 1px solid rgba(255,255,255,0.3); border-radius: 50%; width: 50px; height: 50px; color: white; font-size: 28px; cursor: pointer; justify-content: center; align-items: center; user-select: none; transition: all 0.2s; z-index: 10002;" onmouseenter="this.style.background='rgba(255,255,255,0.2)'" onmouseleave="this.style.background='rgba(0,0,0,0.5)'">&#10095;</button>

        <div style="position: relative; max-width: 90%; max-height: 90%; display: flex; flex-direction: column; align-items: center; justify-content: center;" onclick="event.stopPropagation()">
            <span style="position: absolute; top: -35px; right: 0; color: white; font-size: 35px; cursor: pointer; font-family: Arial, sans-serif; line-height: 1; user-select: none;" onclick="document.getElementById('imageModal').style.display='none'">&times;</span>
            <img id="imageModalSrc" src="" style="max-width: 100%; max-height: 80vh; object-fit: contain; border: 3px solid white; border-radius: 4px; display: block; box-shadow: 0 5px 25px rgba(0,0,0,0.5);">
            <div id="imageModalTitle" style="color: white; text-align: center; margin-top: 12px; font-family: Tahoma, sans-serif; font-size: 14px; font-weight: bold; text-shadow: 1px 1px 3px rgba(0,0,0,0.8);"></div>
        </div>
    </div>

    <!-- Section Top Clics -->
    <div class="site-entry" id="top-clicks-section" style="cursor: default; display: block; padding: 15px; max-width: 850px; margin: 30px auto 20px auto;">
        <div class="entry-content" style="width: 100%; padding-left: 0; gap: 0;">
            <div class="entry-header" style="margin-bottom: 12px; justify-content: flex-start;">
                <span class="site-name" style="font-size: 18px; font-weight: bold; color: #2b5797;">
                    <span class="lang-fr">🏆 Top Clics de l'Archive</span>
                    <span class="lang-en">🏆 Archive Top Clicks</span>
                </span>
            </div>
            <div id="top-clicks-container" style="display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 15px;">
                <!-- Les sections Top seront générées dynamiquement ici en JS -->
            </div>
        </div>
    </div>

    <footer class="site-footer">
        <div class="footer-line"></div>
        <p class="footer-text" data-fr="© 2025 Slaizen Archive | Tout droits réservés"
            data-en="© 2025 Slaizen Archive | All rights reserved">
            © 2025 Slaizen Archive | Tout droits réservés
        </p>
    </footer>
    <!-- Scripts Supabase -->
    <script defer src="https://cdn.jsdelivr.net/npm/@supabase/supabase-js@2"></script>
    <script defer src="../coreSystem/supabase.js"></script>
    <script defer src="../coreSystem/security.js"></script>

    <!-- Chargeur du menu d'authentification (doit être chargé avant auth.js) -->
    <script defer src="../coreSystem/auth-nav-loader.js"></script>

    <!-- Chargeur des modales (doit être chargé avant les autres scripts) -->
    <script defer src="../coreSystem/modals-loader.js"></script>

    <!-- Scripts modulaires séparés -->
    <script defer src="../coreSystem/profiles-config.js"></script>
    <script defer src="../coreSystem/profiles.js"></script>
    <script defer src="../coreSystem/auth.js"></script>
    <script defer src="../coreSystem/avatars.js"></script>
    <script defer src="../coreSystem/comments.js"></script>
    <script defer src="../coreSystem/notifications.js"></script>
    <script defer src="../coreSystem/app.js"></script>
    <script defer src="../coreSystem/founder.js"></script>
    <script defer src="../coreSystem/tracking.js"></script>
    <script defer src="swf-player.js"></script>

    <!-- i18n.js doit être chargé en dernier pour initialiser les traductions -->
    <script defer src="../coreSystem/i18n.js"></script>
    <script defer charset="utf-8" src="archive-data.js?v=2026.08.20.26"></script>
    <script defer charset="utf-8" src="gifs-data.js?v=2026.08.20.15"></script>
    <script defer src="archive.js?v=2026.08.21.03"></script>
</body>

</html>
<!--╔═══════════════════════════════════════════════════════════════════════════════════════════════════════╗    
    ║                      ██ FIRST CREATED: 2025-04-24 ██ LAST UPDATED: 2026-04-24 ██                      ║    
    ╚═══════════════════════════════════════════════════════════════════════════════════════════════════════╝-->
<!--╔═══════════════════════════════════════════════════════════════════════════════════════════════════════╗    
    ║ ██ INTRUSION DETECTED ██                                                                              ║    
    ║ ██ UNAUTHORIZED ACCESS ATTEMPT LOGGED ██                                                              ║    
    ╚═══════════════════════════════════════════════════════════════════════════════════════════════════════╝-->
<!--╔═══════════════════════════════════════════════════════════════════════════════════════════════════════╗    
    ║ ██ TERMINATING CONNECTION ██                                                                          ║    
    ║ ██ DISCONNECTING FROM SLAIZEN.COM ██                                                                  ║    
    ║ ██ CONNECTION CLOSED ██                                                                               ║    
    ║                                                                                                       ║    
    ║ ██ YOU ARE NOW LEAVING THE UNDER-GRID ██                                                              ║    
    ╚═══════════════════════════════════════════════════════════════════════════════════════════════════════╝    
  ███████ ██       █████  ██ ███████ ███████ ███    ██     ██    ███ ███████ ███████ ██  █████       ██ ███████  
  ██      ██      ██   ██ ██    ███  ██      ████   ██     ██   ████      ██  ███    ██ ██   ██      ██      ██  
  ███████ ██      ███████ ██   ███   █████   ██ ██  ██     ██  ██ ██   █████   ███   ██ ███████      ██ ███████  
       ██ ██      ██   ██ ██  ███    ██      ██  ██ ██     ██ ██  ██      ██    ███  ██ ██   ██      ██ ██       
  ███████ ███████ ██   ██ ██ ███████ ███████ ██   ████     ████   ██ ███████ ███████ ██ ██   ██ ███████ ███████  
-->═══════════════════════════════════════════════════════════════════════════════════╝-->
<!--╔═══════════════════════════════════════════════════════════════════════════════════════════════════════╗    
    ║ ██ INTRUSION DETECTED ██                                                                              ║    
    ║ ██ UNAUTHORIZED ACCESS ATTEMPT LOGGED ██                                                              ║    
    ╚═══════════════════════════════════════════════════════════════════════════════════════════════════════╝-->
<!--╔═══════════════════════════════════════════════════════════════════════════════════════════════════════╗    
    ║ ██ TERMINATING CONNECTION ██                                                                          ║    
    ║ ██ DISCONNECTING FROM SLAIZEN.COM ██                                                                  ║    
    ║ ██ CONNECTION CLOSED ██                                                                               ║    
    ║                                                                                                       ║    
    ║ ██ YOU ARE NOW LEAVING THE UNDER-GRID ██                                                              ║    
    ╚═══════════════════════════════════════════════════════════════════════════════════════════════════════╝    
  ███████ ██       █████  ██ ███████ ███████ ███    ██     ██    ███ ███████ ███████ ██  █████       ██ ███████  
  ██      ██      ██   ██ ██    ███  ██      ████   ██     ██   ████      ██  ███    ██ ██   ██      ██      ██  
  ███████ ██      ███████ ██   ███   █████   ██ ██  ██     ██  ██ ██   █████   ███   ██ ███████      ██ ███████  
       ██ ██      ██   ██ ██  ███    ██      ██  ██ ██     ██ ██  ██      ██    ███  ██ ██   ██      ██ ██       
  ███████ ███████ ██   ██ ██ ███████ ███████ ██   ████     ████   ██ ███████ ███████ ██ ██   ██ ███████ ███████  
-->