docs: change css for footnotes and links in headers

Set up footnotes to look different from running text by adding a light
dotted border, inline margins and a smaller font size.

The underline under a link located in a header (h1...h4) is too far
down given the increase in font size. Snug it up to the text by adding
a negative text-underline-offset.

Author: rouilj

doc/_static/style.css

@@ -190,6 +190,8 @@ div[class^=highlight-], div[class^=highlight-] * { width:
     text-decoration-color: darkgrey;
 }
 
+:is(h1,h2,h3,h4) > :link:hover { text-underline-offset: -0.1em; }
+
 a.toc-backref { color: #000000; }
 
 .header h1 { margin-left: 1em; }
@@ -480,6 +482,13 @@ div.file_insert { /* use to insert COPYING into license.txt */
 
 table.valign-top tbody td { vertical-align: top; }
 
+.footnote-list {
+  border: lightgrey dotted 2px;
+  font-size: smaller;
+  margin-inline: 2em;
+  padding-inline: 1em;
+}
+
 /* consider highlighting header element that is a target */
 /*
 :target > :is(h1,h2,h3,h4,h5,h6) {

website/www/_static/style.css

@@ -190,6 +190,8 @@ div[class^=highlight-], div[class^=highlight-] * { width:
     text-decoration-color: darkgrey;
 }
 
+:is(h1,h2,h3,h4) > :link:hover { text-underline-offset: -0.1em; }
+
 a.toc-backref { color: #000000; }
 
 .header h1 { margin-left: 1em; }
@@ -480,6 +482,13 @@ div.file_insert { /* use to insert COPYING into license.txt */
 
 table.valign-top tbody td { vertical-align: top; }
 
+.footnote-list {
+  border: lightgrey dotted 2px;
+  font-size: smaller;
+  margin-inline: 2em;
+  padding-inline: 1em;
+}
+
 /* consider highlighting header element that is a target */
 /*
 :target > :is(h1,h2,h3,h4,h5,h6) {