Make every passage long enough to be worth timing, and credit all of them

The dataset's median passage was 69 characters, about twelve words, which is
over in twelve seconds at an ordinary speed. Some packs were worse: shell had
a median of 46 and a shortest entry of 17. That is the reason packs felt
small. It was not the number of entries, which was 15 to 37 per pack, but the
length of each one.

Multiplayer had already hit this and worked around it: load_race_texts
filters to 120 characters or more. That filter left only 61 of 350 passages
eligible, 38 of them from two packs, so races repeated constantly and four
packs could never come up at all.

Both halves are fixed.

Content: 104 longer passages added across every pack. The command packs get
whole pipelines rather than single flags, which is how the tools are actually
used and what the explanations were always for. Prose packs get passages that
run 150 to 320 characters.

Selection: a floor of 120 characters. Prose packs draw from their long
entries where a pack holds at least five, so no pack is reduced to the same
few passages. The command packs chain consecutive entries into one drill,
which is the natural shape for them, and the explanations are collected so
each line is still described.

Measured over 400 draws per pack, every category now runs a median of 146 to
218 characters with a shortest draw of 120. The race pool went from 61 of 350
to 130 of 454.

Attribution: 24 passages had none and displayed nothing at all under the
text. They now say Unknown, which is the honest answer for a fact written for
the pack, and the pangram is credited as one. The results and typing screens
both fall back to Unknown rather than rendering an empty line, and the pack
name is shown beside the source.

Multiplayer results, three fixes:

- PB never appeared. A race has no mode of its own, so modeKey was undefined,
  so recordResult never ran. Races share one key, because the passage is
  whatever the server dealt and a per-passage best would never be beaten.
- Play Again started a solo test. A race carries standings and a solo run does
  not, so the results screen can tell them apart and now queues for another
  race. The end screen's own cleanup leaves the old room first.
- CONSISTENCY was the longest label on the screen and made the accuracy
  column wider than the WPM column opposite it. It reads CON.

RaceText carries the pack name so the results can show it for a race the same
way single player does.

24 Rust tests and 3 browser tests pass.

1 files changed, 61 insertions, 3 deletions

diff --git a/web/src/styles.css b/web/src/styles.css
index 376c074..b47f21a 100644
--- a/web/src/styles.css
+++ b/web/src/styles.css
@@ -9,7 +9,13 @@
     --caret-color: #00ff9d;
     --sub-color: #8b8e92;
     /* Unified top offset below fixed header/toggle */
-    --header-offset: 3.5rem;
+    /* Reserved height for the top advertising banner, and the amount the
+       header moves down when one is shown. --ad-banner-h is set on the root
+       element by mountTopAdBanner and is 0px whenever the banner is hidden,
+       so nothing below has to know whether a banner exists. */
+    --ad-banner-height: 6.5rem;
+    --ad-banner-h: 0px;
+    --header-offset: calc(3.5rem + var(--ad-banner-h));
     /* App padding variable so we can compensate where needed */
     --app-padding: 1rem;
     /* Room at the foot of every screen for the fixed footer and the corner
@@ -201,7 +207,7 @@ body {
 
 .logo {
     position: fixed;
-    top: 1rem;
+    top: calc(1rem + var(--ad-banner-h));
     left: 1rem;
     font-size: 1.2rem;
     color: var(--primary-color);
@@ -2251,7 +2257,7 @@ body::-webkit-scrollbar, .app::-webkit-scrollbar, #root::-webkit-scrollbar {
    themselves into it. */
 .top-rail {
     position: fixed;
-    top: 1rem;
+    top: calc(1rem + var(--ad-banner-h));
     right: 1rem;
     z-index: 100;
     display: flex;
@@ -3443,6 +3449,54 @@ body::-webkit-scrollbar, .app::-webkit-scrollbar, #root::-webkit-scrollbar {
 /* Reserved advertising space. See web/src/adSlot.js: this holds the space so
    a later ad tag cannot push the page around when it loads. Nothing is
    loaded into it today. */
+/* Across the top of the page, where a navigation bar usually goes. Fixed, so
+   it stays put while a long screen scrolls under it, and opaque, so the
+   content passing beneath does not show through. */
+/* The pack a passage came from, beside its source. Quieter than the
+   attribution itself, which is the thing being credited. */
+.attribution-pack {
+    margin-left: 0.6rem;
+    padding-left: 0.6rem;
+    border-left: var(--border-width) solid var(--border-color);
+    color: var(--sub-color);
+    font-size: 0.8em;
+    text-transform: uppercase;
+    letter-spacing: 1px;
+}
+
+.ad-banner-top {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    height: var(--ad-banner-height);
+    z-index: 90;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background: var(--background-color);
+    border-bottom: var(--border-width) solid var(--border-color);
+    box-sizing: border-box;
+}
+
+.ad-banner-top[hidden] {
+    display: none;
+}
+
+.ad-banner-inner {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 100%;
+    padding: 0 1rem;
+    box-sizing: border-box;
+}
+
+/* No top margin in the banner: the bar centres it already. */
+.ad-banner-inner .ad-slot {
+    margin: 0 auto;
+}
+
 .ad-slot {
     width: var(--ad-w);
     height: var(--ad-h);
@@ -3471,6 +3525,10 @@ body::-webkit-scrollbar, .app::-webkit-scrollbar, #root::-webkit-scrollbar {
         width: var(--ad-mobile-w);
         height: var(--ad-mobile-h);
     }
+
+    :root {
+        --ad-banner-height: 7rem;
+    }
 }