Add accessilbilty check and fixes

assets/css/_custom.css

@@ -1,6 +1,7 @@
 @import './_schedule.css';
 
 .header__intro_headline {
+  margin: 0;
   font: bold var(--fs-xxl) "Arial";
   padding-bottom: 10px;
 }
@@ -32,6 +33,7 @@ th, td {
         --color-header-bg: #242424;
         --color-text: #faf5f5;
         --color-link: #66f2ff;
+        --color-link-visited: #66f2ff;
         --color-footer-bg: #242424;
         --color-border: #faf5f5;
         --color-button: #141414;
@@ -49,7 +51,9 @@ th, td {
     .main-menu a:active {
         text-decoration: none;
     }
-    a {
+    /* Links in text keep their underline: the link colour alone is too close to the text colour. */
+    nav a,
+    .header a {
         text-decoration: none;
     }
 }
@@ -60,4 +64,44 @@ h2 a {
 
 .title-post-date {
   margin-left: 0em;
-}
+}
+/* Visible when focused with the keyboard; the visually-hidden class hides it otherwise. */
+.skip-link:focus {
+  position: absolute;
+  inset-block-start: 0.5rem;
+  inset-inline-start: 0.5rem;
+  z-index: 100;
+  padding: 0.5rem 1rem;
+  background: var(--color-button);
+  color: var(--color-button-text);
+}
+
+#main-content:focus {
+  outline: none;
+}
+
+/* Content images with their credit, see layouts/_markup/render-image.html. */
+.content-image {
+  margin: 1rem 0;
+
+  img {
+    display: block;
+    max-width: 100%;
+    height: auto;
+  }
+}
+
+span.content-image {
+  display: inline-block;
+  vertical-align: top;
+  max-width: 100%;
+  margin: 0 0.5rem 0.5rem 0;
+}
+
+.content-image__credit {
+  display: block;
+  margin-block-start: 0.25rem;
+  font-family: var(--ff-alt);
+  font-size: var(--fs-xs);
+  color: var(--color-text-meta);
+}

assets/css/_schedule.css

@@ -68,16 +68,16 @@
   }
 }
 
-/* Lined up with the time on the cards. */
+/* Lined up with the time on the cards, but in normal weight to stay in the background.
+   No transparency: it has to keep text contrast. */
 .schedule__hour-label {
   display: block;
   padding: calc(0.5rem + 0.25rem) 0.75rem 0.5rem calc(0.75rem + 3px);
   font-family: var(--ff-alt);
   font-size: var(--fs-s);
-  font-weight: bold;
+  font-weight: normal;
   font-variant-numeric: tabular-nums;
   color: var(--color-text-meta);
-  opacity: 0.45;
 }
 
 .schedule__day-title {
@@ -177,6 +177,11 @@
 }
 
 @container (width < 48rem) {
+  /* Keeps a focused card from scrolling under the sticky day picker. */
+  .schedule__title {
+    scroll-margin-block-start: 6rem;
+  }
+
   .schedule__picker:not([hidden]) {
     position: sticky;
     inset-block-start: 0;