<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" />
    
    <!-- iOS PWA Meta Tags -->
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
    <meta name="apple-mobile-web-app-title" content="Everwo" />
    <meta name="apple-touch-fullscreen" content="yes" />
    
    <!-- iOS Push Notification Support -->
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="mobile-web-app-capable" content="yes" />
    
    <title>Everwo - Student Community Platform | Connect, Collaborate & Grow</title>
    <meta name="description" content="Everwo – The ultimate student community platform to connect, collaborate, and grow together. Join thousands of students building meaningful connections and sharing knowledge." />
    <meta name="author" content="Everwo" />
    <meta name="keywords" content="student community, university networking, student platform, academic collaboration, student connections, campus social network, student engagement" />
    
    <!-- Open Graph Meta Tags for Social Media -->
    <meta property="og:title" content="Everwo - Student Community Platform" />
    <meta property="og:description" content="Connect, collaborate, and grow with students worldwide. The ultimate platform for building meaningful academic and professional relationships." />
    <meta property="og:type" content="website" />
    <meta property="og:url" content="https://everwo.com" />
    <meta property="og:image" content="https://everwo.com/logo3.jpg" />
    <meta property="og:image:width" content="1200" />
    <meta property="og:image:height" content="630" />
    <meta property="og:image:alt" content="Everwo - Student Community Platform" />
    <meta property="og:site_name" content="Everwo" />
    <meta property="og:locale" content="en_US" />
    
    <!-- Twitter Card Meta Tags -->
    <meta name="twitter:card" content="summary_large_image" />
    <meta name="twitter:title" content="Everwo - Student Community Platform" />
    <meta name="twitter:description" content="Connect, collaborate, and grow with students worldwide. The ultimate platform for building meaningful academic and professional relationships." />
    <meta name="twitter:image" content="https://everwo.com/logo3.jpg" />
    <meta name="twitter:image:alt" content="Everwo - Student Community Platform" />
    
    <!-- Additional SEO Meta Tags -->
    <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1" />
    <meta name="googlebot" content="index, follow" />
    <link rel="canonical" href="https://everwo.com/" />
    <link rel="canonical" href="https://www.everwo.com/" />
    
    <!-- Structured Data (JSON-LD) -->
    <script type="application/ld+json">
    {
      "@context": "https://schema.org",
      "@type": "WebSite",
      "name": "Everwo",
      "description": "The ultimate student community platform to connect, collaborate, and grow together",
      "url": "https://everwo.com",
      "potentialAction": {
        "@type": "SearchAction",
        "target": "https://everwo.com/search?q={search_term_string}",
        "query-input": "required name=search_term_string"
      },
      "publisher": {
        "@type": "Organization",
        "name": "Everwo",
        "logo": {
          "@type": "ImageObject",
          "url": "https://everwo.com/logo3.jpg"
        }
      }
    }
    </script>
    
    <script type="application/ld+json">
    {
      "@context": "https://schema.org",
      "@type": "Organization",
      "name": "Everwo",
      "url": "https://everwo.com",
      "logo": "https://everwo.com/logo3.jpg",
      "description": "Student community platform for networking and collaboration",
      "sameAs": [
        "https://everwo.com"
      ]
    }
    </script>
    
    <!-- Critical CSS for above-the-fold content - Inline to prevent render blocking -->
    <style>
      /* Critical CSS for immediate rendering */
      body { margin: 0; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif; }
      #root { min-height: 100vh; background: #000; }
      .loading-spinner { 
        min-height: 100vh; 
        display: flex; 
        flex-direction: column; 
        align-items: center; 
        justify-content: center; 
        background: #000; 
      }
      .loading-logo { 
        -o-object-fit: contain; 
           object-fit: contain; 
        animation: pulse 2s infinite; 
        margin-bottom: 1.5rem; 
        width: 200px; 
        height: 164px; 
        max-width: 90vw; 
        max-height: 40vh; 
      }
      .loading-text { color: #fff; font-size: 1.125rem; margin-top: 0.5rem; }
      @keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }
      
      /* Prevent layout shift */
      img { max-width: 100%; height: auto; }
      
      /* Optimize for mobile */
      @media (max-width: 768px) {
        .loading-logo { width: 150px; height: 123px; }
      }
      
      /* Additional critical styles to reduce render blocking */
      .min-h-screen { min-height: 100vh; }
      .flex { display: flex; }
      .flex-col { flex-direction: column; }
      .items-center { align-items: center; }
      .justify-center { justify-content: center; }
      .bg-black { background-color: #000; }
      .text-white { color: #fff; }
      .text-lg { font-size: 1.125rem; }
      .mt-2 { margin-top: 0.5rem; }
      .mb-6 { margin-bottom: 1.5rem; }
      .object-contain { -o-object-fit: contain; object-fit: contain; }
      .animate-pulse { animation: pulse 2s infinite; }
      
      /* Additional critical styles for faster rendering */
      .w-full { width: 100%; }
      .h-full { height: 100%; }
      .relative { position: relative; }
      .absolute { position: absolute; }
      .fixed { position: fixed; }
      .top-0 { top: 0; }
      .left-0 { left: 0; }
      .right-0 { right: 0; }
      .bottom-0 { bottom: 0; }
      .z-50 { z-index: 50; }
      .hidden { display: none; }
      .block { display: block; }
      .inline-block { display: inline-block; }
      .text-center { text-align: center; }
      .font-bold { font-weight: 700; }
      .font-semibold { font-weight: 600; }
      .text-sm { font-size: 0.875rem; }
      .text-xs { font-size: 0.75rem; }
      .rounded { border-radius: 0.25rem; }
      .rounded-lg { border-radius: 0.5rem; }
      .shadow { box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06); }
      .shadow-lg { box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); }
      
      /* Critical message spacing fix for PWA consistency */
      .space-y-1 > * + * { margin-top: 0.25rem !important; }
      .mb-2 { margin-bottom: 0.25rem !important; }
      .messages-list-container { gap: 0.25rem !important; }
      .message-item { margin-bottom: 0.25rem !important; }
      
      /* Critical reply text opacity fix */
      .reply-preview-text { opacity: 0.7 !important; }
      
      /* Critical grid layout fix */
      .connections-grid { 
        display: grid; 
        grid-template-columns: repeat(2, 1fr); 
        gap: 1rem; 
        width: 100%;
        margin: 0;
        padding: 0;
      }
      @media (min-width: 768px) { .connections-grid { grid-template-columns: repeat(3, 1fr); gap: 1rem; } }
      @media (min-width: 1024px) { .connections-grid { grid-template-columns: repeat(4, 1fr); gap: 1rem; } }
      
      /* Critical button alignment fix */
      .profile-card { 
        display: flex; 
        flex-direction: column; 
        min-height: 260px; 
        height: 100%; 
        background: #121212;
        border: 1px solid rgba(255, 255, 255, 0.15);
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
        transition: all 0.3s ease-in-out;
        overflow: hidden;
        word-wrap: break-word;
        word-break: break-word;
        cursor: pointer;
        -webkit-user-select: none;
           -moz-user-select: none;
                user-select: none;
        opacity: 0.9;
      }
      
      /* Request card styling - horizontal layout */
      .request-card {
        display: flex;
        flex-direction: row;
        background: #121212;
        border: 1px solid rgba(255, 255, 255, 0.15);
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
        transition: all 0.3s ease-in-out;
        overflow: hidden;
        word-wrap: break-word;
        word-break: break-word;
        width: 100%;
        max-width: 100%;
        padding: 0.5rem !important;
        border-radius: 0.5rem !important;
        opacity: 0.9;
      }
      
      /* Make request cards smaller */
      .request-card .w-12.h-12.md\:w-14.md\:h-14 {
        width: 3.5rem !important;
        height: 3.5rem !important;
      }
      
      @media (min-width: 768px) {
        .request-card .w-12.h-12.md\:w-14.md\:h-14 {
          width: 4rem !important;
          height: 4rem !important;
        }
      }
      
      /* Smaller text in request cards */
      .request-card .text-sm.md\:text-base {
        font-size: 0.8rem !important;
      }
      
      @media (min-width: 768px) {
        .request-card .text-sm.md\:text-base {
          font-size: 0.9rem !important;
        }
      }
      
      /* Even smaller text for status and labels */
      .request-card .text-xs {
        font-size: 0.55rem !important;
      }
      
      .request-card .text-\[10px\] {
        font-size: 0.5rem !important;
      }
      
      /* Larger university name text */
      .request-card .text-sm {
        font-size: 0.875rem !important;
      }
      
      /* Ensure university name appears inline with username */
      .request-card h3 {
        display: flex !important;
        align-items: center !important;
        flex-wrap: wrap !important;
        gap: 0.25rem !important;
        justify-content: flex-start !important;
        width: 100% !important;
      }
      
      .request-card h3 span {
        display: inline !important;
        white-space: nowrap !important;
        flex-shrink: 0 !important;
        margin-left: 0.25rem !important;
      }
      
      /* Prevent university name from being pushed to the right */
      .request-card .flex.flex-col.flex-1.min-w-0 {
        justify-content: flex-start !important;
        align-items: flex-start !important;
      }
      
      /* Reduce spacing in request cards */
      .request-card .space-x-3 {
        gap: 0.25rem !important;
      }
      
      .request-card .gap-2 {
        gap: 0.25rem !important;
      }
      
      .request-card .gap-1 {
        gap: 0.125rem !important;
      }
      
      .request-card .gap-0\.5 {
        gap: 0.0625rem !important;
      }
      
      .request-card .mb-1 {
        margin-bottom: 0.0625rem !important;
      }
      
      .request-card .mb-0 {
        margin-bottom: 0 !important;
      }
      
      /* Reduce vertical gaps between text elements */
      .request-card .flex.flex-col > * + * {
        margin-top: 0.0625rem !important;
      }
      
      /* Smaller buttons in request cards */
      .request-card button {
        padding: 0.25rem 0.5rem !important;
        font-size: 0.75rem !important;
      }
      
      .request-card .w-4.h-4 {
        width: 0.875rem !important;
        height: 0.875rem !important;
      }
      
      /* Ensure request cards don't overflow */
      .request-card * {
        overflow-wrap: break-word;
        word-break: break-word;
        max-width: 100%;
      }
      
      /* Prevent text overflow in request cards */
      .request-card .truncate {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
      }
      
      /* Ensure flex items don't shrink too much */
      .request-card .flex-shrink-0 {
        flex-shrink: 0;
      }
      
      .request-card .min-w-0 {
        min-width: 0;
      }
      
      /* Add left margin to profile info section to move content away from cross button */
      .request-card .flex.items-center.space-x-3.flex-1.min-w-0 {
        margin-left: 1rem !important;
      }
      
      .profile-card * { overflow-wrap: break-word; word-break: break-word; max-width: 100%; }
      .profile-card .username { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
      .profile-card .interest-tag { 
        max-width: 70px; 
        overflow: hidden; 
        text-overflow: ellipsis; 
        white-space: nowrap; 
        font-size: 0.5rem !important;
        padding: 0.25rem 0.5rem !important;
      }
      
      @media (min-width: 768px) {
        .profile-card .interest-tag {
          font-size: 0.625rem !important;
        }
      }
              .college-badge { 
          max-width: 80px !important; 
          font-size: 0.5rem !important;
          padding: 0.25rem 0.5rem !important;
        }
        
        @media (min-width: 768px) {
          .college-badge {
            max-width: 100px !important;
            font-size: 0.625rem !important;
          }
        }
              .profile-card .mt-auto { margin-top: auto !important; }
        
        /* Sleek request button styling */
        .profile-card button {
          border-radius: 9999px !important;
          box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
          transition: all 0.2s ease-in-out !important;
          border: none !important;
          font-weight: 700 !important;
          letter-spacing: 0.025em !important;
        }
        
        .profile-card button:hover {
          box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
          transform: translateY(-1px) !important;
        }
        
        .profile-card button:active {
          transform: translateY(0) !important;
          box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1) !important;
        }
              .profile-card:hover { transform: none; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3); }
      
      /* Critical tabs spacing fix */
      .connections-tabs { width: 100%; margin: 0; padding: 0; }
              .connections-tabs [data-radix-tabs-content] { margin: 0; padding: 0; }
        
        /* Custom request button color */
        .profile-card button.bg-\[#d4d4d4\] {
          background-color: #d4d4d4 !important;
        }
        
        .profile-card button.bg-\[#d4d4d4\]:hover {
          background-color: #c0c0c0 !important;
        }
        
        /* Smaller university toggle styling */
        .connections-tabs .scale-75 {
          transform: scale(0.75) !important;
          transform-origin: center !important;
        }
        
        /* Smaller search input text */
        .profile-input {
          font-size: 0.875rem !important;
        }
        
        .profile-input::-moz-placeholder {
          font-size: 0.875rem !important;
        }
        
        .profile-input::placeholder {
          font-size: 0.875rem !important;
        }
        
        /* Tab opacity styling */
        .connections-tabs [data-radix-tabs-trigger] {
          opacity: 0.8 !important;
          transition: opacity 0.2s ease-in-out !important;
        }
        
        .connections-tabs [data-radix-tabs-trigger][data-state="active"] {
          opacity: 1 !important;
        }
        
        .connections-tabs [data-radix-tabs-trigger]:hover {
          opacity: 0.9 !important;
        }
      
      /* Critical college badge fix */
      .college-badge { position: absolute; top: 0.25rem; right: 0.25rem; max-width: 50px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; z-index: 10; }
      @media (min-width: 768px) { .college-badge { max-width: 60px; } }
    </style>
    
    <!-- Performance optimizations for mobile -->
    <link rel="preconnect" href="https://fonts.googleapis.com" />
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    <link rel="preconnect" href="https://vqgpbdwmfvbfkgevldwd.supabase.co" crossorigin />
    <link rel="dns-prefetch" href="https://fonts.googleapis.com" />
    <link rel="dns-prefetch" href="https://fonts.gstatic.com" />
    <link rel="dns-prefetch" href="https://vqgpbdwmfvbfkgevldwd.supabase.co" />
    
    <!-- Preload critical resources with high priority -->
    <link rel="preload" href="/assets/index-D1Jv72eo.css" as="style" fetchpriority="high">
    
    <!-- Preload optimized logo for mobile -->
    <link rel="preload" href="/smallogo.jpg" as="image" media="(max-width: 768px)" fetchpriority="high">
    <link rel="preload" href="/smallogo.jpg" as="image" fetchpriority="high">
    
    <!-- Resource hints for faster loading -->
    <!-- Removed TypeScript resource hints that were causing MIME type errors -->
    
    <!-- Optimized font loading - Load fonts asynchronously to prevent render blocking -->
    <link rel="preload" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" as="style" onload="this.onload=null;this.rel='stylesheet'">
    <noscript><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap"></noscript>
    
    <!-- PWA Meta Tags -->
    <meta name="theme-color" content="#000000" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
    <meta name="apple-mobile-web-app-title" content="Everwo" />
    <meta name="mobile-web-app-capable" content="yes" />
    <meta name="msapplication-TileColor" content="#000000" />
    <meta name="msapplication-tap-highlight" content="no" />
    
    <!-- PWA Icons -->
    <link rel="icon" type="image/x-icon" href="/favicon.ico" />
    <link rel="icon" type="image/png" sizes="32x32" href="/logo.png" />
    <link rel="icon" type="image/png" sizes="16x16" href="/logo.png" />
    <link rel="apple-touch-icon" href="/logo3.jpg" />
    <link rel="manifest" href="/manifest.json" />
    
    <!-- Performance monitoring -->
    <script>
      // Performance monitoring
      if ('PerformanceObserver' in window) {
        const observer = new PerformanceObserver((list) => {
          for (const entry of list.getEntries()) {
            if (entry.entryType === 'largest-contentful-paint') {
              console.log('LCP:', entry.startTime);
            }
          }
        });
        observer.observe({ entryTypes: ['largest-contentful-paint'] });
      }
    </script>
    <script type="module" crossorigin src="/js/index-BlybwhAC.js"></script>
    <link rel="modulepreload" crossorigin href="/js/heic2any-hqjC4FT0.js">
    <link rel="modulepreload" crossorigin href="/js/vendor-D9Tvg2v-.js">
    <link rel="modulepreload" crossorigin href="/js/realtime-XO0IDzkn.js">
    <link rel="modulepreload" crossorigin href="/js/ui-components-gocz4vUl.js">
    <link rel="modulepreload" crossorigin href="/js/utils-BH0JBsOa.js">
    <link rel="modulepreload" crossorigin href="/js/icons-BbrCrnq2.js">
    <link rel="modulepreload" crossorigin href="/js/router-CAp4TN0-.js">
    <link rel="modulepreload" crossorigin href="/js/supabase-BYGbszwc.js">
    <link rel="stylesheet" crossorigin href="/css/index-R1GXd3sc.css">
  </head>
  <body>
    <div id="root">
      <!-- Loading fallback for better perceived performance -->
      <div class="loading-spinner">
        <span class="loading-text">Loading...</span>
      </div>
    </div>
    
    <!-- SEO-friendly content for search engines -->
    <noscript>
      <div style="padding: 20px; text-align: center; background: #000; color: #fff; min-height: 100vh; display: flex; flex-direction: column; justify-content: center; align-items: center;">
        <h1 style="font-size: 2.5rem; margin-bottom: 1rem;">Welcome to Everwo</h1>
        <p style="font-size: 1.2rem; margin-bottom: 2rem; max-width: 600px; line-height: 1.6;">
          The ultimate student community platform where students connect, collaborate, and grow together. 
          Join thousands of students building meaningful academic and professional relationships.
        </p>
        <div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 2rem; max-width: 800px; margin: 2rem 0;">
          <div style="background: rgba(255,255,255,0.1); padding: 1.5rem; border-radius: 12px;">
            <h3 style="margin-bottom: 1rem; color: #fff;">Connect with Peers</h3>
            <p style="color: #ccc;">Build meaningful connections with students from your university and beyond.</p>
          </div>
          <div style="background: rgba(255,255,255,0.1); padding: 1.5rem; border-radius: 12px;">
            <h3 style="margin-bottom: 1rem; color: #fff;">Share Knowledge</h3>
            <p style="color: #ccc;">Share thoughts, experiences, and insights with your academic community.</p>
          </div>
          <div style="background: rgba(255,255,255,0.1); padding: 1.5rem; border-radius: 12px;">
            <h3 style="margin-bottom: 1rem; color: #fff;">Find Opportunities</h3>
            <p style="color: #ccc;">Discover jobs, internships, and collaboration opportunities.</p>
          </div>
        </div>
        <p style="font-size: 1rem; color: #ccc; margin-top: 2rem;">
          Please enable JavaScript to experience the full Everwo platform.
        </p>
      </div>
    </noscript>
    
    <!-- Load CSS asynchronously to prevent render blocking -->
    <script>
      // Load CSS asynchronously
      function loadCSS(href) {
        const link = document.createElement('link');
        link.rel = 'stylesheet';
        link.href = href;
        link.media = 'print';
        link.onload = function() {
          this.media = 'all';
        };
        document.head.appendChild(link);
      }
      
      // Load main CSS file asynchronously
      loadCSS('/assets/index-D1Jv72eo.css');
    </script>
    
    
    <!-- Inject environment variables for Cloudflare Pages -->
    <script>
      // For Cloudflare Pages environment variable compatibility
      window.__SUPABASE_URL__ = 'https://vqgpbdwmfvbfkgevldwd.supabase.co/';
      window.__SUPABASE_ANON_KEY__ = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6InZxZ3BiZHdtZnZiZmtnZXZsZHdkIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NDk2NjA1MjksImV4cCI6MjA2NTIzNjUyOX0.bZUHA16pn6alhPQZch55Qa' + 'nuud0zE5RzX9OjXaszbf0';
      console.log('🔧 Environment variables injected for Cloudflare Pages');
    </script>
    
    <!-- Service Worker Registration -->
    <script>
      if ('serviceWorker' in navigator) {
        window.addEventListener('load', () => {
          navigator.serviceWorker.register('/sw.js')
            .then((registration) => {
              console.log('SW registered: ', registration);
              
              // Listen for force reload messages from service worker
              navigator.serviceWorker.addEventListener('message', (event) => {
                // Temporarily disabled to prevent automatic reloads
                // if (event.data && event.data.type === 'FORCE_RELOAD') {
                //   console.log('🔄 Force reloading due to service worker update');
                //   window.location.reload(true);
                // }
              });
            })
            .catch((registrationError) => {
              console.log('SW registration failed: ', registrationError);
            });
        });
      }
    </script>
    
    <!-- URL rewriting for Cloudflare Pages -->
    <script type="text/javascript">
      (function (l) {
        if (l.search[1] === "/") {
          var decoded = l.search
            .slice(1)
            .split("&")
            .map(function (s) {
              return s.replace(/~and~/g, "&");
            })
            .join("?");
          window.history.replaceState(
            null,
            null,
            l.pathname.slice(0, -1) + decoded + l.hash
          );
        }
      })(window.location);
    </script>
  </body>
</html>
