<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    
    <!-- 🔥 CORS Policy Headers - สำคัญสำหรับแก้ปัญหา Cross-Origin-Opener-Policy -->
    <meta http-equiv="Cross-Origin-Opener-Policy" content="same-origin-allow-popups">
    
    <!-- 🛡️ Security Headers (เฉพาะที่ใช้ใน meta ได้) -->
    <meta http-equiv="Referrer-Policy" content="strict-origin-when-cross-origin">
    
    <!-- App Theme -->
    <meta name="msapplication-TileColor" content="#3b82f6">
    <meta name="theme-color" content="#3b82f6">
    
    <!-- App Title -->
    <title>Gotchy! Manage your Collection!</title>
    
    <!-- SEO Meta -->
    <meta name="description" content="จัดการคอลเลคชั่นของสะสมของคุณอย่างมืออาชีพ - Gotchy! Manage your collection!">
    <meta name="keywords" content="Gunpla, Collection, Management, Gotchy, Gundam, Model Kit">
    <meta name="author" content="Gotchy Team">
    
    <!-- 📱 Open Graph Meta for Facebook/Social Media -->
    <meta property="og:title" content="Gotchy! Manage your Collection!">
    <meta property="og:description" content="จัดการคอลเลคชั่นของสะสมของคุณอย่างมืออาชีพ">
    <meta property="og:type" content="website">
    <meta property="og:locale" content="th_TH">
    <meta property="og:image" content="https://gotchy.app/assets/gotchy-face-og.jpg">
    <meta property="og:image:width" content="1200">
    <meta property="og:image:height" content="630">
    <meta property="og:image:alt" content="Gotchy - Collection Manager Logo">
    <meta property="og:url" content="https://gotchy.app">
    <meta property="og:site_name" content="Gotchy Collection Manager">
    
    <!-- 🐦 Twitter Card Meta -->
    <meta name="twitter:card" content="summary_large_image">
    <meta name="twitter:title" content="Gotchy! Manage your Collection!">
    <meta name="twitter:description" content="จัดการคอลเลคชั่น Gunpla ของคุณอย่างมืออาชีพ">
    <meta name="twitter:image" content="https://gotchy.app/assets/gotchy-face-og.jpg">
    <meta name="twitter:image:alt" content="Gotchy - Gunpla Collection Manager Logo">
    
    <!-- 🚀 Performance Optimization - Preconnect to Firebase & Google -->
    <link rel="preconnect" href="https://accounts.google.com">
    <link rel="preconnect" href="https://www.googleapis.com">
    <link rel="preconnect" href="https://firebase.googleapis.com">
    <link rel="preconnect" href="https://firebaseapp.com">
    
    <!-- DNS Prefetch for faster loading -->
    <link rel="dns-prefetch" href="//accounts.google.com">
    <link rel="dns-prefetch" href="//www.googleapis.com">
    <link rel="dns-prefetch" href="//firebase.googleapis.com">
    <link rel="dns-prefetch" href="//firebaseapp.com">
    
    <!-- 📱 PWA Support (future-ready) -->
    <link rel="manifest" href="/assets/manifest-prW7ycW2.json">
    <meta name="mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="default">
    <meta name="apple-mobile-web-app-title" content="Gotchy">
    
    <!-- Favicon (optional - เพิ่มได้ตามต้องการ) -->
    <link rel="icon" type="image/svg+xml" href="/favicon.svg">
    <link rel="icon" type="image/png" href="/favicon.png">
    <script type="module" crossorigin src="/assets/index-C1hqBslX.js"></script>
    <link rel="modulepreload" crossorigin href="/assets/vendor-react-DJG_os-6.js">
    <link rel="modulepreload" crossorigin href="/assets/vendor-router-S5CChp6a.js">
    <link rel="modulepreload" crossorigin href="/assets/vendor-firebase-DKSo-kCd.js">
    <link rel="modulepreload" crossorigin href="/assets/vendor-ui-DA1AChTg.js">
    <link rel="stylesheet" crossorigin href="/assets/index-CF9lBOC3.css">
  </head>
  <body>
    <div id="root"></div>
    
    <!-- 🔥 Inline Script สำหรับ CORS Debugging (เฉพาะ Development) -->
    <script>
      // ตรวจสอบ CORS support (ใช้ได้ทุก environment)
      if (typeof window !== 'undefined' && window.location.hostname === 'localhost') {
        console.log('🔍 [GOTCHY] CORS Headers Check:', {
          'Cross-Origin-Opener-Policy': document.querySelector('meta[http-equiv="Cross-Origin-Opener-Policy"]')?.content || 'Not set',
          'Cross-Origin-Embedder-Policy': document.querySelector('meta[http-equiv="Cross-Origin-Embedder-Policy"]')?.content || 'Not set',
          userAgent: navigator.userAgent.split(' ')[0],
          timestamp: new Date().toISOString()
        });
      }
      
      // Global error handler สำหรับ CORS errors
      window.addEventListener('error', (event) => {
        if (event.message?.includes('Cross-Origin') || event.message?.includes('CORS')) {
          console.warn('🚨 [GOTCHY] CORS Error Detected:', {
            message: event.message,
            filename: event.filename,
            lineno: event.lineno
          });
        }
      });
      
      // Unhandled promise rejection handler
      window.addEventListener('unhandledrejection', (event) => {
        if (event.reason?.message?.includes('Cross-Origin') || event.reason?.message?.includes('CORS')) {
          console.warn('🚨 [GOTCHY] CORS Promise Rejection:', {
            reason: event.reason?.message,
            stack: event.reason?.stack?.split('\n').slice(0, 3).join('\n')
          });
        }
      });
    </script>
  </body>
</html>