<!DOCTYPE html>
<html lang="en-US">
  <head>
    <meta charset="UTF-8" />
    <link rel="icon" type="image/png" href="/platform/logo-192.webp" />
    <link rel="apple-touch-icon" href="/platform/logo-192.webp" />
    <meta name="theme-color" content="hsl(40 24% 94%)" />
    <link rel="manifest" href="/platform/manifest.json" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
    <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="Workspace" />
    <meta name="mobile-web-app-capable" content="yes" />
    <meta name="format-detection" content="telephone=no" />
    <meta name="description" content="Secure Business Workspace" />
    
    <title>Workspace</title>
    <script>
      (function () {
        try {
          var THEME_COLOR_CACHE_KEY_PREFIX = 'zyta:theme-color-cache:';
          var DEFAULT_THEME_COLOR_LIGHT = 'hsl(40 24% 94%)';
          var DEFAULT_THEME_COLOR_DARK = 'hsl(222 28% 4%)';
          var raw = window.localStorage.getItem('Zyta-storage');
          var parsed = raw ? JSON.parse(raw) : null;
          var state = parsed && typeof parsed === 'object' ? parsed.state || {} : {};
          var root = document.documentElement;
          var isDarkMode = Boolean(state.isDarkMode);
          var motionPreference =
            state.motionPreference === 'reduced' ||
            state.motionPreference === 'full' ||
            state.motionPreference === 'system'
              ? state.motionPreference
              : 'system';
          var systemPrefersReduced =
            typeof window.matchMedia === 'function' &&
            window.matchMedia('(prefers-reduced-motion: reduce)').matches;
          var resolvedMotion =
            motionPreference === 'reduced'
              ? 'reduced'
              : motionPreference === 'full'
                ? 'full'
                : systemPrefersReduced
                  ? 'reduced'
                  : 'full';

          root.classList.toggle('dark', isDarkMode);
          root.dataset.themeMode = isDarkMode ? 'dark' : 'light';
          root.style.colorScheme = isDarkMode ? 'dark' : 'light';
          root.dataset.motionPreference = motionPreference;
          root.dataset.motion = resolvedMotion;

          var themeColorMeta = document.querySelector('meta[name="theme-color"]');
          if (themeColorMeta) {
            var themeColorCacheKey =
              THEME_COLOR_CACHE_KEY_PREFIX + window.location.hostname.toLowerCase();
            var cachedThemeColor = null;

            try {
              var cachedThemeColorRaw = window.localStorage.getItem(themeColorCacheKey);
              if (cachedThemeColorRaw) {
                var parsedThemeColorCache = JSON.parse(cachedThemeColorRaw);
                cachedThemeColor =
                  parsedThemeColorCache &&
                  typeof parsedThemeColorCache === 'object' &&
                  typeof parsedThemeColorCache[isDarkMode ? 'dark' : 'light'] === 'string'
                    ? parsedThemeColorCache[isDarkMode ? 'dark' : 'light']
                    : null;
              }
            } catch {
              cachedThemeColor = null;
            }

            themeColorMeta.setAttribute(
              'content',
              cachedThemeColor || (isDarkMode ? DEFAULT_THEME_COLOR_DARK : DEFAULT_THEME_COLOR_LIGHT)
            );
          }
        } catch {
          // Ignore malformed persisted state and continue with platform defaults.
        }
      })();
    </script>
    <!-- Automatic Clean-up for Local Development Caches (Service Worker Kill-Switch) -->
    <script>
      (function() {
        // ♻️ Immediate Recovery from Stale Asset Caches (HTML as JS)
        // This listener is inline to ensure it runs even if main.tsx fails to load.
        window.addEventListener('error', function(e) {
          var msg = (e.message || '').toLowerCase();
          var isHTMLatJS = msg.indexOf("unexpected token '<'") !== -1 || msg.indexOf("unexpected token <") !== -1;
          
          if (isHTMLatJS) {
            console.warn('♻️ [Zyta Recovery] Chunk Mismatch Detected (Received HTML instead of JS). Reloading...');
            var marker = 'zyta:recovery:last-reload';
            var now = Date.now();
            var last = Number(window.sessionStorage.getItem(marker) || '0');
            // Prevent infinite reload loops (minimum 15s gap)
            if (now - last > 15000) {
              window.sessionStorage.setItem(marker, String(now));
              window.location.reload();
            }
          }
        }, true);

        if (window.location.hostname === 'localhost' || window.location.hostname === '127.0.0.1') {
          if ('serviceWorker' in navigator) {
            navigator.serviceWorker.getRegistrations().then(registrations => {
              for (let registration of registrations) {
                registration.unregister().then(success => {
                  if (success) {
                    console.log('♻️ [Zyta Fix] Stale Service Worker Unregistered for Localhost');
                    window.location.reload();
                  }
                });
              }
            });
          }
        }
      })();
    </script>
    <script type="module" crossorigin src="/assets/index-z6gwY8f3.js"></script>
    <link rel="modulepreload" crossorigin href="/assets/v-react-Mnl3mNEh.js">
    <link rel="modulepreload" crossorigin href="/assets/vendor-OLD0VXdw.js">
    <link rel="modulepreload" crossorigin href="/assets/v-css-utils-Ce1ZTWB2.js">
    <link rel="modulepreload" crossorigin href="/assets/v-date-CA8QhFad.js">
    <link rel="modulepreload" crossorigin href="/assets/v-supabase-ext-Dy71pS2-.js">
    <link rel="modulepreload" crossorigin href="/assets/v-supabase-core-C88qp-16.js">
    <link rel="modulepreload" crossorigin href="/assets/v-toast-Ds9V4Z82.js">
    <link rel="modulepreload" crossorigin href="/assets/v-router-6cEVqHkZ.js">
    <link rel="modulepreload" crossorigin href="/assets/v-tanstack-OrU-38B3.js">
    <link rel="modulepreload" crossorigin href="/assets/v-query-DdN3X__S.js">
    <link rel="modulepreload" crossorigin href="/assets/v-state-CYutMOrS.js">
    <link rel="modulepreload" crossorigin href="/assets/v-icons-C1SNYr0B.js">
    <link rel="modulepreload" crossorigin href="/assets/v-radix-B7dDV8u5.js">
    <link rel="modulepreload" crossorigin href="/assets/v-motion-Coju56Sf.js">
    <link rel="modulepreload" crossorigin href="/assets/v-security-WWGBaZSV.js">
    <link rel="stylesheet" crossorigin href="/assets/vendor-D2r4GBif.css">
    <link rel="stylesheet" crossorigin href="/assets/index-pYvrYKiM.css">
  </head>

  <body>
    <div id="root">
      <!-- Static Fallback: Displayed if the React bundle fails to load (CDN outage, JS disabled) -->
      <noscript>
        <div style="font-family:'Inter',system-ui,sans-serif;text-align:center;padding:4rem 1rem;max-width:480px;margin:0 auto">
          <div style="font-size:2.5rem;margin-bottom:1rem">⚙️</div>
          <h1 style="font-size:1.5rem;font-weight:700;margin:0 0 0.5rem">Workspace is temporarily unavailable</h1>
          <p style="color:#6b7280;line-height:1.6;margin:0 0 1.5rem">
            This workspace requires JavaScript or may be experiencing restricted connectivity.
          </p>
          <button onclick="window.location.reload()" style="display:inline-block;padding:0.75rem 1.5rem;background:hsl(240 5% 15%);color:white;border:none;border-radius:0.75rem;font-weight:600;font-size:0.875rem;cursor:pointer">
            Retry Connection
          </button>
        </div>
      </noscript>
    </div>
  </body>
</html>
