/* Ton CSS existant */
        :root {
          --gplay-bg: #fcfcfd;
          --gplay-bg-soft: #f5f6fa;
          --gplay-bg-card: #fff;
          --gplay-bg-accent: #f3f0ff;
          --gplay-surface: #f1f2f6;

          --gplay-primary: #1e293b;
          --gplay-secondary: #7c3aed;
          --gplay-accent: #ffb300;
          --gplay-orange: #ff7849;
          --gplay-info: #2563eb;
          --gplay-muted: #64748b;
          --gplay-border: #e5e7eb;
          --gplay-border-strong: #c7d2fe;

          --gplay-gradient: linear-gradient(90deg, #7c3aed 0%, #ffb300 100%);
          --gplay-gradient-accent: linear-gradient(90deg, #ffb300 0%, #ff7849 100%);
          --gplay-gradient-card: linear-gradient(135deg, #fff 0%, #f5f6fa 100%);

          --gplay-shadow-xs: 0 1px 3px 0 rgba(30,41,59,0.06);
          --gplay-shadow-sm: 0 2px 8px 0 rgba(30,41,59,0.10);
          --gplay-shadow-md: 0 8px 24px -4px rgba(30,41,59,0.13);
          --gplay-shadow-lg: 0 16px 40px -8px rgba(30,41,59,0.16);

          --gplay-blur: blur(8px);
          --gplay-transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1);
        }

        .category-gplay {
          background: var(--gplay-bg);
          border: 2px solid var(--gplay-border);
          border-radius: 28px;
          box-shadow: var(--gplay-shadow-lg);
          margin-bottom: 48px;
          transition: var(--gplay-transition);
          position: relative;
          overflow: hidden;
          backdrop-filter: var(--gplay-blur);
        }

        .category-gplay:hover {
          box-shadow: 0 0 0 4px #ffb30033, var(--gplay-shadow-lg);
          border-color: var(--gplay-accent);
          transform: translateY(-4px) scale(1.012);
        }

        .category-gplay::after {
          content: "";
          position: absolute;
          top: 0; left: 0; right: 0;
          height: 5px;
          background: var(--gplay-gradient);
          box-shadow: 0 0 18px #ffb30022;
          z-index: 10;
          animation: gplayPulse 4s infinite ease-in-out;
        }

        @keyframes gplayPulse {
          0%, 100% { opacity: 1; }
          50% { opacity: 0.7; }
        }

        @keyframes gplayBlink {
          0%, 50%, 100% { opacity: 1; }
          25%, 75% { opacity: 0.5; }
        }

        @keyframes floatImage {
          0%, 100% { transform: translateY(0px) rotate(0deg); }
          50% { transform: translateY(-10px) rotate(1deg); }
        }

        .category-gplay h1 {
          color: var(--gplay-primary);
          font-family: 'JetBrains Mono', 'Poppins', 'Segoe UI', Arial, sans-serif;
          font-weight: 900;
          font-size: 2.4rem;
          margin-bottom: 30px;
          letter-spacing: 1.5px;
          text-transform: uppercase;
          background: var(--gplay-gradient);
          -webkit-background-clip: text;
          -webkit-text-fill-color: transparent;
          filter: drop-shadow(0 3px 8px #ffb30011);
          position: relative;
          z-index: 2;
        }

        .category-gplay h1::before {
          content: "🎮 ";
          color: var(--gplay-accent);
          font-size: 0.9em;
          margin-right: 10px;
          animation: gplayBlink 1.8s infinite;
        }

        .category-gplay h2 {
          color: var(--gplay-secondary);
          font-family: 'Poppins', 'Inter', Arial, sans-serif;
          font-weight: 800;
          font-size: 1.5rem;
          margin: 38px 0 18px 0;
          padding-left: 22px;
          position: relative;
          text-transform: uppercase;
          letter-spacing: 1.1px;
          background: var(--gplay-gradient);
          -webkit-background-clip: text;
          -webkit-text-fill-color: transparent;
        }

        .category-gplay h2::before {
          content: "";
          position: absolute;
          left: 0; top: 50%;
          transform: translateY(-50%);
          width: 7px; height: 70%;
          background: var(--gplay-gradient-accent);
          border-radius: 4px;
          box-shadow: 0 0 10px #ffb30033;
        }

        .category-gplay .item-content {
          background: var(--gplay-bg-card);
          color: var(--gplay-primary);
          padding: 44px 32px 36px 32px;
          border-radius: 22px;
          font-family: 'Inter', 'Segoe UI', Arial, sans-serif;
          font-size: 1.07rem;
          line-height: 1.85;
          position: relative;
          box-shadow: var(--gplay-shadow-sm);
          z-index: 2;
        }

        .category-gplay .item-content p {
          margin-bottom: 22px;
          transition: color 0.18s, background 0.18s;
          text-align: justify;
          font-size: 1.11em;
          font-family: 'Inter', 'Segoe UI', Arial, sans-serif;
        }

        .category-gplay .item-content p:hover {
          color: var(--gplay-orange);
          background: linear-gradient(90deg, #fffbe6 0%, #f5f6fa 100%);
          border-radius: 8px;
          padding: 7px 10px;
          box-shadow: 0 2px 8px #ffb3000a;
        }

        blockquote {
          font-style: italic;
          color: var(--gplay-secondary);
          border-left: 6px solid var(--gplay-accent);
          padding: 22px 32px;
          margin: 32px 0;
          background: #f8fafc;
          border-radius: 14px;
          font-family: 'Inter', Arial, sans-serif;
          font-size: 1.15rem;
          position: relative;
          box-shadow: 0 2px 10px #ffb3000a;
        }

        blockquote::before {
          content: "❝";
          font-size: 2.5rem;
          color: var(--gplay-accent);
          position: absolute;
          top: 6px;
          left: 12px;
          opacity: 0.13;
          font-family: Georgia, serif;
        }

        .quote-text {
          font-size: 1.13em;
          font-weight: 600;
          display: block;
          margin-bottom: 8px;
          position: relative;
          z-index: 1;
        }

        hr {
          border: none;
          border-top: 2px dashed var(--gplay-accent);
          margin: 36px 0 32px 0;
          opacity: 0.7;
        }

        .image-gallery {
          display: flex;
          justify-content: center;
          margin: 40px 0;
        }

        .gallery-image {
          animation: floatImage 6s ease-in-out infinite;
          transition: all 0.3s ease;
          border-radius: 14px;
          box-shadow: 0 6px 28px rgba(124, 58, 237, 0.1);
        }

        .gallery-image:hover {
          animation-play-state: paused;
          transform: scale(1.05) rotate(2deg);
          box-shadow: 0 0 0 4px #ffb30099, 0 15px 40px rgba(124, 58, 237, 0.2);
        }

        figcaption {
          padding: 12px 15px;
          font-size: 1em;
          color: var(--gplay-secondary);
          text-align: center;
          line-height: 1.4;
        }

        .info-box {
          background: linear-gradient(90deg, #f5f6fa 80%, #fffbe6 100%);
          border: 2px solid var(--gplay-accent);
          border-left: 7px solid var(--gplay-secondary);
          padding: 26px 30px;
          border-radius: 16px;
          margin: 32px 0;
          font-family: 'Inter', Arial, sans-serif;
          box-shadow: 0 2px 10px #7c3aed08;
          font-size: 1.08em;
          position: relative;
        }

        .info-box::before {

          position: absolute;
          top: 10px;
          right: 18px;
          font-size: 1.4rem;
          opacity: 0.18;
        }

        .article-tags {
          margin-top: 38px;
          padding-top: 18px;
          border-top: 2px dashed var(--gplay-accent);
          display: flex;
          flex-wrap: wrap;
          gap: 13px;
        }

        .tag-item {
          background: #f5f6fa;
          color: var(--gplay-secondary);
          border: 2px solid #e0e7ef;
          padding: 10px 22px;
          border-radius: 20px;
          font-size: 1.01rem;
          font-weight: 700;
          text-decoration: none;
          transition: all 0.18s;
          display: inline-flex;
          align-items: center;
          gap: 7px;
          font-family: 'JetBrains Mono', monospace;
          text-transform: uppercase;
          letter-spacing: 0.3px;
        }

        .tag-item::before {
          content: "▲";
          font-weight: 900;
          color: var(--gplay-accent);
          margin-right: 4px;
        }

        .tag-item:hover {
          background: var(--gplay-accent);
          color: #fff;
          border-color: var(--gplay-accent);
          transform: translateY(-2px) scale(1.07);
          box-shadow: 0 0 0 2px #ffb30044;
        }

        /* Nouvelles classes pour améliorer la mise en page */
        .intro-section {
          background: linear-gradient(135deg, #f8fafc 0%, #e0f2fe 100%);
          border: 2px solid var(--gplay-info);
          border-radius: 20px;
          padding: 30px;
          margin: 30px 0;
          position: relative;
          box-shadow: 0 4px 20px rgba(37, 99, 235, 0.1);
        }

        .intro-section::before {

          position: absolute;
          top: 15px;
          right: 20px;
          font-size: 1.5rem;
          opacity: 0.2;
        }

        .story-highlight {
          background: linear-gradient(135deg, #fff7ed 0%, #fef3c7 100%);
          border: 2px solid var(--gplay-accent);
          border-radius: 18px;
          padding: 25px 30px;
          margin: 25px 0;
          position: relative;
          box-shadow: 0 4px 15px rgba(255, 179, 0, 0.1);
        }

        .story-highlight::before {

          position: absolute;
          top: 12px;
          right: 18px;
          font-size: 1.3rem;
          opacity: 0.3;
        }

        .gaming-stats {
          display: grid;
          grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
          gap: 20px;
          margin: 30px 0;
        }

        .stat-card {
          background: linear-gradient(135deg, #fef7ff 0%, #f3f0ff 100%);
          border: 2px solid var(--gplay-secondary);
          border-radius: 16px;
          padding: 20px;
          text-align: center;
          transition: transform 0.3s ease, box-shadow 0.3s ease;
        }

        .stat-card:hover {
          transform: translateY(-5px);
          box-shadow: 0 8px 25px rgba(124, 58, 237, 0.15);
        }

        .stat-number {
          font-family: 'JetBrains Mono', monospace;
          font-size: 2rem;
          font-weight: 900;
          color: var(--gplay-secondary);
          display: block;
          margin-bottom: 5px;
        }

        .stat-label {
          font-size: 0.9rem;
          color: var(--gplay-muted);
          text-transform: uppercase;
          letter-spacing: 0.5px;
          font-weight: 600;
        }

        .timeline-item {
          border-left: 4px solid var(--gplay-accent);
          padding-left: 20px;
          margin: 20px 0;
          position: relative;
        }

        .timeline-item::before {
          content: "";
          position: absolute;
          left: -8px;
          top: 8px;
          width: 12px;
          height: 12px;
          background: var(--gplay-accent);
          border-radius: 50%;
          box-shadow: 0 0 0 4px #fff, 0 0 0 6px var(--gplay-accent);
        }

        .timeline-year {
          font-family: 'JetBrains Mono', monospace;
          font-weight: 900;
          color: var(--gplay-secondary);
          font-size: 1.2rem;
          margin-bottom: 8px;
        }

        @media (max-width: 768px) {
          .category-gplay {
            margin: 10px;
            border-radius: 20px;
          }
          
          .category-gplay h1 {
            font-size: 1.8rem;
          }
          
          .category-gplay .item-content {
            padding: 25px 20px;
          }
          
          .gaming-stats {
            grid-template-columns: repeat(2, 1fr);
          }
        }