<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>PANNG</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />

<!-- AdSense script — managed from Admin → Settings. Printed here (server-side) so Google can verify it. -->

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

  <!-- React + Babel-standalone: lets the site run app.jsx directly with no Node build step. -->
  <script src="https://cdnjs.cloudflare.com/ajax/libs/react/18.3.1/umd/react.production.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/18.3.1/umd/react-dom.production.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/7.24.7/babel.min.js"></script>
  <script>
    // We transform app.jsx ourselves (instead of using <script type="text/babel">) so we can force
    // the CLASSIC JSX runtime explicitly. The automatic runtime needs a bundler to resolve
    // "react/jsx-runtime", which doesn't exist here — forcing classic avoids that failure mode.
    fetch('frontend/app.jsx?v=' + Date.now())
      .then((r) => r.text())
      .then((source) => {
        const { code } = Babel.transform(source, {
          presets: [['react', { runtime: 'classic' }]],
          filename: 'app.jsx',
        });
        const script = document.createElement('script');
        script.textContent = code;
        document.body.appendChild(script);
      })
      .catch((err) => {
        document.getElementById('root').innerHTML =
          '<p style="font-family:sans-serif;color:#B23A2E;padding:24px;">Could not load the site frontend (frontend/app.jsx). ' + err + '</p>';
      });
  </script>
</body>
</html>
