update ioccc.css

Now code, pre, mono font set starts with "Menlo, Monaco, Consolas"
before going to the other font defaults.

Established IOCCC defaults for body, pre, code, blockquote,
a (link, visited, focus, hover, active).

Added pandoc --standalone defaults for some property settings
that we NOT part of the "Establish IOCCC defaults" set above.

The assumption is that the tools that convert markdown to
HTML via pandoc will NOT use --standalone because we want
finer control over CSS.  Even so, there may be good reasons
to go with most of what pandoc recommends: unless we have
good reason to NOT do so.

Reduce font size to 90% (0.9em) for screen that is >= 401 pixels
AND <= 800 pixels wide.

Reduce font size to 80% (0.8em) for screen is <- 400 pixels wide.

Added print media property based on pandoc --standalone.

This is still rather experimental.

ioccc.css

@@ -359,7 +359,7 @@ template {
 }
 
 .mono {
-  font-family: "Lucida Console", "Courier New", monospace;
+  font-family: Menlo, Monaco, Consolas, "Lucida Console", "Courier New", monospace;
 }
 
 * {
@@ -371,7 +371,7 @@ h1, h2, h3, h4, h5, h6 {
 }
 
 pre, code {
-  font-family: "Lucida Console", "Courier New", monospace;
+  font-family: Menlo, Monaco, Consolas, "Lucida Console", "Courier New", monospace;
 }
 
 body {
@@ -380,15 +380,163 @@ body {
 
 /* Top level ===================================================================================== */
 
+/* Establish IOCCC defaults */
+
 * {
   box-sizing: border-box;
   background: whitesmoke;
 }
 
 body {
+  margin: 0 auto;
   padding: 10px;
+  hyphens: auto;
+  overflow-wrap: break-word;
+  text-rendering: optimizeLegibility;
+  font-kerning: normal;
 }
 
+pre, code {
+  margin: 1em 0;
+  hyphens: manual;
+  overflow-wrap: normal;
+  overflow: visible;
+  white-space: pre-wrap;
+}
+
+blockquote {
+  margin: 1em 0 1em 1.7em;
+  padding-left: 1em;
+  border-left: 2px solid #e6e6e6;
+  color: #606060;
+}
+
+a {
+  outline-color: transparent;
+  text-decoration: none;
+  padding: 2px 1px 0;
+}
+
+a:link {
+  color: blue;
+}
+
+a:visited {
+  color: purple;
+}
+
+a:focus, a:hover {
+  border-bottom: 1px solid;
+}
+
+a:active {
+  color: red;
+}
+
+/*
+ * Pandoc recommended defaults
+ *
+ * These values are produced by pandoc when converting markdown to HTML
+ * when using the --standalone option as of 2023 Nov 6.
+ *
+ * We removed pandoc --standalone CSS for:
+ *	code
+ *	pre
+ *	blockquote
+ *	a
+ *	a:visited
+ * because they are handled above in the Establish IOCCC defaults section.
+ */
+p {
+  margin: 1em 0;
+}
+img {
+  max-width: 100%;
+}
+svg {
+  height: auto;
+  max-width: 100%;
+}
+h1, h2, h3, h4, h5, h6 {
+  margin-top: 1.4em;
+}
+h5, h6 {
+  font-size: 1em;
+  font-style: italic;
+}
+h6 {
+  font-weight: normal;
+}
+ol, ul {
+  padding-left: 1.7em;
+  margin-top: 1em;
+}
+li > ol, li > ul {
+  margin-top: 0;
+}
+.sourceCode {
+ background-color: transparent;
+ overflow: visible;
+}
+hr {
+  background-color: #1a1a1a;
+  border: none;
+  height: 1px;
+  margin: 1em 0;
+}
+table {
+  margin: 1em 0;
+  border-collapse: collapse;
+  width: 100%;
+  overflow-x: auto;
+  display: block;
+  font-variant-numeric: lining-nums tabular-nums;
+}
+table caption {
+  margin-bottom: 0.75em;
+}
+tbody {
+  margin-top: 0.5em;
+  border-top: 1px solid #1a1a1a;
+  border-bottom: 1px solid #1a1a1a;
+}
+th {
+  border-top: 1px solid #1a1a1a;
+  padding: 0.25em 0.5em 0.25em 0.5em;
+}
+td {
+  padding: 0.125em 0.5em 0.25em 0.5em;
+}
+header {
+  margin-bottom: 4em;
+  text-align: center;
+}
+#TOC li {
+  list-style: none;
+}
+#TOC ul {
+  padding-left: 1.3em;
+}
+#TOC > ul {
+  padding-left: 0;
+}
+#TOC a:not(:hover) {
+  text-decoration: none;
+}
+span.smallcaps{font-variant: small-caps;}
+div.columns{display: flex; gap: min(4vw, 1.5em);}
+div.column{flex: auto; overflow-x: auto;}
+div.hanging-indent{margin-left: 1.5em; text-indent: -1.5em;}
+/* The extra [class] is a hack that increases specificity enough to override a similar rule in reveal.js */
+ul.task-list[class]{list-style: none;}
+ul.task-list li input[type="checkbox"] {
+  font-size: inherit;
+  width: 0.8em;
+  margin: 0 0.8em 0.2em -1.6em;
+  vertical-align: middle;
+}
+.display.math{display: block; text-align: center; margin: 0.5rem auto;}
+
 /* Header ======================================================================================== */
 
 /* Style the header */
@@ -533,13 +681,16 @@ body {
  * and adjust the defaults for a somewhat smaller screen.
  */
 @media screen and (max-width: 800px) {
+  body {
+    font-size: 0.9em;
+  }
   .header {
     padding: 0;
     border: 0;
     text-align: center;
   }
   .header h1 {
-    font-size: 2em;
+    font-size: 1.75em;
   }
   .header h2 {
     font-size: 1.5em;
@@ -572,6 +723,9 @@ body {
  * and adjust the defaults for a small screen.
  */
 @media screen and (max-width: 400px) {
+  body {
+    font-size: 0.8em;
+  }
   .header {
     padding: 0;
     border: 0;
@@ -611,3 +765,27 @@ body {
     font-size: 1em;
   }
 }
+
+/*
+ * When printing
+ *
+ * These values are produced by pandoc when converting markdown to HTML
+ * when using the --standalone option.
+ */
+@media print {
+  html {
+    background-color: white;
+  }
+  body {
+    background-color: transparent;
+    color: black;
+    font-size: 12pt;
+  }
+  p, h2, h3 {
+    orphans: 3;
+    widows: 3;
+  }
+  h2, h3, h4 {
+    page-break-after: avoid;
+  }
+}