<!DOCTYPE html>
<html lang="{{ .Site.LanguageCode | default "en" }}">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>{{ if .IsHome }}{{ .Site.Title }}{{ else }}{{ .Title }} — {{ .Site.Title }}{{ end }}</title>
  <meta name="description" content="{{ with .Description }}{{ . }}{{ else }}{{ .Site.Params.description }}{{ end }}" />

  <meta property="og:title" content="{{ .Site.Title }}" />
  <meta property="og:description" content="{{ .Site.Params.description }}" />
  <meta property="og:type" content="website" />
  <meta property="og:url" content="{{ .Site.BaseURL }}" />

  <meta name="twitter:card" content="summary_large_image" />
  <meta name="twitter:title" content="{{ .Site.Title }}" />
  <meta name="twitter:description" content="{{ .Site.Params.description }}" />

  {{/* Preload the three self-hosted webfonts so the browser fetches
       them in parallel with the CSS, not after it. */}}
  <link rel="preload" href="{{ "fonts/fraunces-latin.woff2" | relURL }}" as="font" type="font/woff2" crossorigin>
  <link rel="preload" href="{{ "fonts/inter-latin.woff2" | relURL }}" as="font" type="font/woff2" crossorigin>
  <link rel="preload" href="{{ "fonts/jetbrains-mono-latin.woff2" | relURL }}" as="font" type="font/woff2" crossorigin>

  <link rel="stylesheet" href="{{ "css/style.css" | relURL }}" />
  <link rel="icon" type="image/svg+xml" href="{{ "favicon.svg" | relURL }}" />
  <link rel="alternate" type="text/plain" title="LLM-readable site description" href="{{ "llms.txt" | relURL }}" />

  {{/* Prevent FOUT: hide the body until webfonts are loaded, with a
       1500ms safety timeout so the page never stays blank forever. */}}
  <style>html.fonts-pending body { visibility: hidden; }</style>
  <script>
    (function () {
      var d = document;
      d.documentElement.classList.add('fonts-pending');
      var done = false;
      function reveal() {
        if (done) return;
        done = true;
        d.documentElement.classList.remove('fonts-pending');
      }
      if (d.fonts && d.fonts.ready && typeof d.fonts.ready.then === 'function') {
        d.fonts.ready.then(reveal);
      } else {
        reveal();
      }
      setTimeout(reveal, 1500);
    })();
  </script>
</head>
<body>
  {{ partial "header.html" . }}
  <main>
    {{ block "main" . }}{{ end }}
  </main>
  {{ partial "footer.html" . }}
</body>
</html>
