<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <!-- Force no-cache for debugging and critical updates -->
  <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
  <meta http-equiv="Pragma" content="no-cache" />
  <meta http-equiv="Expires" content="0" />
  <title>Sidex | Pro Esports Trading</title>
  <link rel="icon" type="image/png" href="/logo.png" />

  <!-- Fonts -->
  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  <link
    href="https://fonts.googleapis.com/css2?family=Exo+2:ital,wght@0,400;0,700;0,800;0,900;1,700;1,800;1,900&family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;700&family=Russo+One&family=Share+Tech+Mono&family=Orbitron:wght@400;700&display=swap"
    rel="stylesheet">

  <!-- Tailwind CSS -->
  <script src="https://cdn.tailwindcss.com"></script>
  <script>
    tailwind.config = {
      theme: {
        extend: {
          colors: {
            sidex: {
              bg: '#000000',
              panel: '#0B0E11', // Trading view panel color
              border: '#1E2329', // Trading view border color
              cyan: '#00F0FF',
              cyanDim: 'rgba(0, 240, 255, 0.1)',
              text: '#EAECEF',
              muted: '#848E9C',
              green: '#0ECB81', // Binance/Propex Green
              red: '#F6465D',   // Binance/Propex Red
            }
          },
          fontFamily: {
            sans: ['Inter', 'sans-serif'],
            display: ['"Exo 2"', 'sans-serif'],
            mono: ['JetBrains Mono', 'monospace'],
          },
          boxShadow: {
            'glow': '0 0 20px rgba(0, 240, 255, 0.2)',
          },
          backgroundImage: {
            'grid-pattern': "linear-gradient(to right, #111 1px, transparent 1px), linear-gradient(to bottom, #111 1px, transparent 1px)",
          }
        }
      }
    }
  </script>
  <style>
    body {
      background-color: #000000;
      color: #EAECEF;
    }

    ::-webkit-scrollbar {
      width: 4px;
      height: 4px;
    }

    ::-webkit-scrollbar-track {
      background: #0B0E11;
    }

    ::-webkit-scrollbar-thumb {
      background: #2B3139;
      border-radius: 2px;
    }

    ::-webkit-scrollbar-thumb:hover {
      background: #00F0FF;
    }

    .clip-skew {
      clip-path: polygon(10% 0, 100% 0, 100% 100%, 0% 100%);
    }
  </style>

  <script src="/charting_library/charting_library.standalone.js"></script>

  <!-- Social Media & Open Graph -->
  <meta property="og:type" content="website" />
  <meta property="og:url" content="https://devs.sidex.fun/" />
  <meta property="og:title" content="Sidex | Pro Esports Trading" />
  <meta property="og:description" content="Trade crypto futures with advanced charts, real-time data, and professional tools." />
  <meta property="og:image" content="https://devs.sidex.fun/logo.png" />

  <!-- Twitter -->
  <meta name="twitter:card" content="summary" />
  <meta name="twitter:title" content="Sidex | Pro Esports Trading" />
  <meta name="twitter:description" content="Trade crypto futures with advanced charts, real-time data, and professional tools." />
  <meta name="twitter:image" content="https://devs.sidex.fun/logo.png" />
  <script type="importmap">
{
  "imports": {
    "react": "https://esm.sh/react@18.2.0",
    "react/": "https://esm.sh/react@18.2.0/",
    "react-dom": "https://esm.sh/react-dom@18.2.0",
    "react-dom/client": "https://esm.sh/react-dom@18.2.0/client",
    "react-dom/": "https://esm.sh/react-dom@18.2.0/",
    "lucide-react": "https://esm.sh/lucide-react@0.344.0?deps=react@18.2.0",
    "recharts": "https://esm.sh/recharts@2.12.7?deps=react@18.2.0,react-dom@18.2.0"
  }
}
</script>
  <script type="module" crossorigin src="/assets/index-Desfr1pb.js"></script>
  <link rel="modulepreload" crossorigin href="/assets/react-vendor-zG0ZZq4u.js">
  <link rel="modulepreload" crossorigin href="/assets/ui-vendor-CS7Ke0Fk.js">
  <link rel="modulepreload" crossorigin href="/assets/solana-vendor-Bl1imXQr.js">
  <link rel="stylesheet" crossorigin href="/assets/index-D214F7I0.css">
</head>

<body>
  <div id="root"></div>
</body>

</html>