Add share previews for the index and the Green Man page

Index gets a front-page card as og.png. The Green Man page gets a
description, canonical link and Open Graph tags with its own image.

Co-Authored-By: Claude Fable 5.2 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01GrX9qMoNihcWLX3xoJhabw

greenman/index.html

@@ -5,6 +5,18 @@
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <title>Green Man Mask Kit</title>
 <link rel="icon" href="../favicon.svg">
+<meta name="description" content="A half-mask of oak leaves, acorns and bark, built to be worn with glasses. Full-size templates, print files, a build guide and a painting guide, free to download.">
+<link rel="canonical" href="https://builds.kestrelsnest.social/greenman/">
+<meta property="og:type" content="article">
+<meta property="og:site_name" content="Kestrel's Builds">
+<meta property="og:title" content="Green Man mask">
+<meta property="og:description" content="A half-mask of oak leaves, acorns and bark, built to be worn with glasses. Everything you need to make your own.">
+<meta property="og:url" content="https://builds.kestrelsnest.social/greenman/">
+<meta property="og:image" content="https://builds.kestrelsnest.social/greenman/og-image.jpg">
+<meta property="og:image:width" content="1200">
+<meta property="og:image:height" content="630">
+<meta property="og:image:alt" content="A Green Man half-mask worn with glasses: a crown of painted oak leaves above a bark brow ridge, with acorns at the temples and a leaf over the nose.">
+<meta name="twitter:card" content="summary_large_image">
 <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,600;12..96,700&family=Inter:wght@400;600;700&display=swap">
 <style>
 /* layout: one reading column of guide text; each step is a drawing beside its instructions, stacking on phones */