index.html

<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <link rel="icon" type="image/svg+xml" href="./favicon.svg" />
    <!-- `viewport-fit=cover` lets the layout reach under the notch; the
         safe-area insets in theme.css keep controls out from under it. -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover, interactive-widget=resizes-content" />
    <meta name="theme-color" content="#1A1033" />

    <!-- Add to Home Screen: launches chromeless, like an app. -->
    <link rel="manifest" href="./manifest.webmanifest" />
    <link rel="apple-touch-icon" href="./apple-touch-icon.png" />
    <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="our dates" />

    <!-- The site is private by way of auth, but there is no reason to help
         anyone find it in the first place. -->
    <meta name="robots" content="noindex, nofollow" />

    <!-- No Google Fonts. The faces ship inside the bundle (see src/main.tsx):
         loading them from Google hands every visitor's IP address to Google
         before they've agreed to anything, which EU courts have ruled a GDPR
         breach. It also means the pixel type works offline. -->

    <!-- Before first paint, or a phone that chose another theme shows the
         default palette for a frame. Deliberately inline and dependency-free:
         it has to run ahead of the stylesheet. Not validated here — an
         unknown value matches no CSS block, and useTheme corrects it. -->
    <script>
      try {
        var t = localStorage.getItem('dateideas:theme')
        if (t) document.documentElement.setAttribute('data-theme', t)
      } catch (e) {}
    </script>

    <title>our dates</title>
  </head>
  <body>
    <div id="root"></div>
    <script type="module" src="/src/main.tsx"></script>
  </body>
</html>