<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    
    <!-- Theme Script: Must run before any content renders to prevent flash -->
    <script>
      (function() {
        try {
          const theme = localStorage.getItem('drillsense-theme') || 'system';
          const getSystemTheme = () => window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
          const resolvedTheme = theme === 'system' ? getSystemTheme() : theme;
          document.documentElement.classList.add(resolvedTheme);
        } catch (e) {
          // Fallback to light theme if localStorage is unavailable
          document.documentElement.classList.add('light');
        }
      })();
    </script>
    
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0" />
    <title>Datum DrillSense</title>
    <meta name="description" content="Analyze drill cutting images and manage well projects with Datum DrillSense." />
    
    <!-- Critical performance optimizations -->
    <link rel="dns-prefetch" href="https://js-agent.newrelic.com">
    <link rel="dns-prefetch" href="https://bam.nr-data.net">
    <link rel="dns-prefetch" href="https://mskxosylzvfabfjsbyvz.supabase.co">
    <link rel="dns-prefetch" href="https://vercel.live">
    <link rel="dns-prefetch" href="https://fonts.googleapis.com">
    <link rel="dns-prefetch" href="https://fonts.gstatic.com">
    
    <!-- Preconnect to critical third-party origins -->
    <link rel="preconnect" href="https://mskxosylzvfabfjsbyvz.supabase.co" crossorigin>
    <link rel="preconnect" href="https://fonts.googleapis.com" crossorigin>
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    
    <!-- Load Inter font from Google Fonts with display swap for performance -->
    <link rel="preload" as="style" onload="this.onload=null;this.rel='stylesheet'" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap">
    <noscript><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap"></noscript>
    
    <!-- Critical CSS to prevent FOUC -->
    <style>
      /* Critical loading styles */
      html { 
        scroll-behavior: smooth; 
        -webkit-text-size-adjust: 100%; 
        -moz-text-size-adjust: 100%; 
             text-size-adjust: 100%; 
      }
      
      body { 
        margin: 0; 
        font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif; 
        -webkit-font-smoothing: antialiased; 
        -moz-osx-font-smoothing: grayscale; 
        font-feature-settings: 'rlig' 1, 'calt' 1;
      }
      
      #root { 
        min-height: 100vh; 
        min-height: 100svh; 
        display: flex; 
        flex-direction: column; 
      }
      
      /* Prevent form validation FOUC - red boxes */
      input:invalid, textarea:invalid, select:invalid {
        box-shadow: none !important;
        border-color: inherit !important;
      }
      
      /* Critical loading state */
      .app-loading {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: #ffffff;
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 9999;
      }
      
      .loading-skeleton {
        background: linear-gradient(90deg, #f3f4f6 25%, #e5e7eb 50%, #f3f4f6 75%);
        background-size: 200% 100%;
        animation: loading 1.5s infinite;
      }
      
      @keyframes loading {
        0% { background-position: 200% 0; }
        100% { background-position: -200% 0; }
      }
    </style>
    
    <!-- Favicon -->
    <link rel="icon" type="image/x-icon" href="/favicon.ico" />
    
    <!-- Preload critical chunks for better loading -->
    <link rel="modulepreload" href="/assets/main-CbbrjtBW.tsx">
    <link rel="modulepreload" href="/assets/App-DUc-dAP9.tsx">
    <script type="module" crossorigin src="/js/index-BomVyYk0.js"></script>
    <link rel="modulepreload" crossorigin href="/js/vendor-react-DNdZ6i0N.js">
    <link rel="modulepreload" crossorigin href="/js/vendor-ui-WxfNJQ7M.js">
    <link rel="modulepreload" crossorigin href="/js/vendor-data-BByba1aa.js">
    <link rel="modulepreload" crossorigin href="/js/vendor-auth-BFamDIVY.js">
    <link rel="modulepreload" crossorigin href="/js/vendor-charts-CnEWICre.js">
    <link rel="stylesheet" crossorigin href="/css/style-CgZ8mTd-.css">
  </head>
  <body>
    <div id="root">
      <div class="app-loading">
        <div style="display: flex; align-items: center; gap: 12px;">
          <div class="loading-skeleton" style="width: 40px; height: 40px; border-radius: 8px;"></div>
          <div>
            <div class="loading-skeleton" style="width: 120px; height: 16px; border-radius: 4px; margin-bottom: 8px;"></div>
            <div class="loading-skeleton" style="width: 80px; height: 12px; border-radius: 4px;"></div>
          </div>
        </div>
      </div>
    </div>
    
    <!-- Initialize New Relic early but non-blocking -->
    <script>
      window.NREUM||(NREUM={}),__nr_require=function(e,n,t){function r(t){if(!n[t]){var i=n[t]={exports:{}};e[t][0].call(i.exports,function(n){var i=e[t][1][n];return r(i||n)},i,i.exports)}return n[t].exports}if("function"==typeof __nr_require)return __nr_require;for(var i=0;i<t.length;i++)r(t[i]);return r}({1:[function(e,n,t){function r(){}function i(e,n,t){return function(){return o(e,[f.now()].concat(u(arguments)),n?null:this,t),n?void 0:this}}var o=e("handle"),a=e(8),u=e(9),c=e("ee").get("tracer"),f=e("loader"),s=NREUM;"undefined"==typeof window.newrelic&&(newrelic=s);var p=["setPageViewName","setCustomAttribute","setErrorHandler","finished","addToTrace","inlineHit","addRelease"],l="api-",d=l+"ixn-";a(p,function(e,n){s[n]=i(l+n,!0,"api")}),s.addPageAction=i(l+"addPageAction",!0),s.setCurrentRouteName=i(l+"routeName",!0),n.exports=newrelic,s.interaction=function(){return(new r).get()};var m=r.prototype={createTracer:function(e,n){var t={},r=this,i="function"==typeof n;return o(d+"tracer",[f.now(),e,t],r),function(){if(c.emit((i?"":"no-")+"fn-start",[f.now(),r,i],t),i)try{return n.apply(this,arguments)}catch(e){throw c.emit("fn-err",[arguments,this,e],t),e}finally{c.emit("fn-end",[f.now()],t)}}}};a("actionText,setName,setAttribute,save,ignore,onEnd,getContext,end,get".split(","),function(e,n){m[n]=i(d+n)}),newrelic.noticeError=function(e,n){"string"==typeof e&&(e=new Error(e)),o("err",[e,f.now(),!1,n])}},{}],2:[function(e,n,t){function r(e,n){var t=e.getEntries();t.forEach(function(e){"first-paint"===e.name?c("timing",["fp",Math.floor(e.startTime)]):"first-contentful-paint"===e.name&&c("timing",["fcp",Math.floor(e.startTime)])})}function i(e,n){var t=e.getEntries();t.length>0&&c("lcp",[t[t.length-1]])}function o(e){e.getEntries().forEach(function(e){e.hadRecentInput||c("cls",[e])})}function a(e){if(e instanceof f&&!s){var n=Math.round(e.timeStamp),t={type:e.type};n<=p.now()?t.fid=p.now()-n:n>p.offset&&n<=Date.now()?(n-=p.offset,t.fid=p.now()-n):n=p.now(),s=!0,c("timing",["fi",n,t])}}function u(e){c("pageHide",[p.now(),e])}if(!("init"in NREUM&&"page_view_timing"in NREUM.init&&"enabled"in NREUM.init.page_view_timing&&NREUM.init.page_view_timing.enabled===!1)){var c=e("handle"),f=e(10),s=!1,p=e("loader");if(e(11))if(e(12)){var l=new PerformanceObserver(r);l.observe({entryTypes:["paint"]})}if(e(13)){var d=new PerformanceObserver(i);d.observe({entryTypes:["largest-contentful-paint"]})}if(e(14)){var m=new PerformanceObserver(o);m.observe({type:"layout-shift",buffered:!0})}if(e(15)){var v=new PerformanceObserver(a);v.observe({type:"first-input",buffered:!0})}e(16)&&addEventListener("pagehide",u,!1)}},{}],"G9z0Bl":[function(e,n,t){function r(){function e(){return n}function n(){return window.NREUM.init}if("init"in window.NREUM){var t=window.NREUM.init;return{get:e,getGlobal:n}}throw new Error("init was not found in NREUM")}},{}],loader:[function(e,n,t){function r(){return s}function i(){var e=p.info=NREUM.info;if(e&&e.licenseKey&&e.applicationID&&c&&c.body){u(h,function(n,t){n in e||(e[n]=t)}),p.proto="https"===d.split(":")[0]||e.sslForHttp?"https://":"http://",a("mark",["onload",f()+p.offset],null,"api");var n=c.createElement("script");n.src=p.proto+e.agent,c.body.appendChild(n)}}if(!window.NREUM||!window.NREUM.version){var o=window.NREUM={init:r,info:NREUM.info,getToken:function(){return void 0},listeners:[]},a=e("handle"),u=e(9),c=document,f=e(8),s=e("G9z0Bl"),p=e(1),l=NREUM.o={ST:setTimeout,SI:setInterval,CT:clearTimeout,XHR:XMLHttpRequest,REQ:Request,EV:Event,PR:Promise,MO:MutationObserver};e(6),e(2),e(4),e(5);var d=(""+location).split("?")[0];p.il=i,setTimeout(i,0)}},{}]},{},["G9z0Bl"]);;NREUM.info={beacon:"bam.nr-data.net",errorBeacon:"bam.nr-data.net",licenseKey:"NRJS-d0558c1e5cd1f1765ba",applicationID:"1507743140",sa:1}
    </script>
    
  </body>
</html>
