Fix phone layout so name columns scroll sideways

Keep columns side-by-side with horizontal snap-scroll instead of
stacking the second column under the first on small screens.

static/index.html

@@ -137,8 +137,20 @@
       color: var(--muted); font-size: 0.92rem;
     }
     .who a { color: var(--accent); font-weight: 600; text-decoration: none; }
-    .boards { display: grid; gap: 0.85rem; margin-bottom: 0.85rem; }
-    @media (min-width: 860px) { .boards { grid-template-columns: 1fr 1fr; align-items: start; } }
+    .boards {
+      display: flex; gap: 0.85rem; margin-bottom: 0.85rem;
+      overflow-x: auto; -webkit-overflow-scrolling: touch;
+      scroll-snap-type: x mandatory; overscroll-behavior-x: contain;
+      padding-bottom: 0.25rem;
+    }
+    .boards > section {
+      flex: 0 0 auto;
+      width: min(18.5rem, calc(100vw - 2.5rem));
+      scroll-snap-align: start;
+    }
+    @media (min-width: 860px) {
+      .boards > section { flex: 1 1 0; width: auto; min-width: 16rem; }
+    }
     .col-head {
       display: flex; align-items: baseline; justify-content: space-between;
       gap: 0.5rem; margin-bottom: 0.35rem; padding-bottom: 0.45rem;