The veil loses the blur, the shelf labels find a third voice

On nearest-neighbour art the backdrop blur read as a smear rather than depth,
so the caption sits on a plain gradient rising from the bottom edge instead —
solid where the words are, gone before it reaches the art.

And the section headings stop borrowing: the game bundles two faces and both
were already spoken for on this screen (Bangers is the screen title, Silkscreen
is the posters' own captions), so a shelf label in either sounded like
something else. They take the platform's interface face now — heavy, tracked,
upper case: chrome, which is what a shelf label is.

Scoped to the section HEADER while doing it. The posters live inside .mgroup
now, so the old bare descendant selector had been restyling every caption on
the wall — invisible only because it still named Silkscreen.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

index.html

@@ -473,18 +473,14 @@ if (location.hostname !== 'splatter-tennis.wuwi.one' && !window.Capacitor?.isNat
                    image-rendering: pixelated; border: 2px solid var(--line); color: inherit; font: inherit;
                    text-align: left; cursor: pointer; -webkit-tap-highlight-color: transparent;
                    position: relative; }
-  /* THE CAPTION'S VEIL (2026-08-31, Oliver: "eine blurry verlauf als hintergrund, von oben aus dem
-     nichts kommend"). A hard scrim gradient used to ride in the button's own background stack; this
-     is a BLURRED backdrop instead, masked so it begins as literally nothing at its top edge and
-     only becomes a surface where the words are. Art stays art at the top of the poster, the caption
-     gets something to sit on, and there is no box edge anywhere. */
+  /* THE CAPTION'S VEIL (2026-08-31). The blur went in and came straight back out — on
+     nearest-neighbour art it read as a smear, not as depth (Oliver: "sieht komisch aus"). What is
+     left is what he asked for instead: a gradient RISING FROM THE BOTTOM EDGE, solid where the
+     words are and gone by the time it reaches the art. Same job, no filter, no edge. */
   #modeList button.mode::after, #modeSub button.mode::after {
-    content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 50%;
-    backdrop-filter: blur(5px) saturate(0.85);
-    -webkit-backdrop-filter: blur(5px) saturate(0.85);
-    background: linear-gradient(180deg, rgba(8,12,9,0) 0%, rgba(8,12,9,0.42) 46%, rgba(8,12,9,0.8) 100%);
-    -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 44%);
-    mask-image: linear-gradient(180deg, transparent 0%, #000 44%);
+    content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 62%;
+    background: linear-gradient(0deg, rgba(6,10,8,0.94) 0%, rgba(6,10,8,0.86) 22%,
+                                     rgba(6,10,8,0.5) 58%, rgba(6,10,8,0) 100%);
     pointer-events: none; }
   /* the words and the chips ride ABOVE the veil — a pseudo-element is the last thing painted */
   #modeList .cb, #modeSub .cb { position: relative; z-index: 2; }
@@ -509,10 +505,20 @@ if (location.hostname !== 'splatter-tennis.wuwi.one' && !window.Capacitor?.isNat
      header is a header, and headers on this screen are left-aligned (the .hdr title, the posters'
      own captions) */
   #modeList .mgroup > header { margin: 0 0 11px; text-align: left; }
-  #modeList .mgroup b { display: block; font: 700 14px Silkscreen, monospace; letter-spacing: 2.5px;
-                   color: var(--acid); text-shadow: none; line-height: 1.2; }
-  #modeList .mgroup i { display: block; margin: 5px 0 0; font: 400 9px Silkscreen, monospace;
-                   font-style: normal; color: var(--dim); letter-spacing: 0.5px; text-shadow: none; }
+  /* A THIRD VOICE (2026-08-31, Oliver: "wechsle mal die schrift"). The game bundles exactly two
+     faces and both were taken on this screen — Bangers is the screen title, Silkscreen is the
+     posters' own captions — so a section heading in either was always going to sound like
+     something else. This is the UI's own voice: the platform's interface face, heavy, tracked
+     wide, upper case. It reads as chrome rather than as art, which is what a shelf label IS. */
+  /* SCOPED TO THE HEADER, not to the section: the posters live INSIDE .mgroup now, so a bare
+     descendant selector here restyled every caption on the wall (it stayed invisible while this
+     rule still named Silkscreen — the moment the family changed, the posters changed with it). */
+  #modeList .mgroup > header b { display: block; letter-spacing: 3px; color: var(--acid);
+                   text-shadow: none;
+                   font: 800 13px/1.25 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
+  #modeList .mgroup > header i { display: block; margin: 5px 0 0; letter-spacing: 0.6px;
+                   color: var(--dim); font-style: normal; text-shadow: none;
+                   font: 500 10.5px/1.35 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
   /* the canonical room is named in the primary's colour — the one that moves your career */
   #modeList .mgroup:first-child b { color: #f0a08e; }
   #modeList .mgroup button.mode:last-child { margin-bottom: 0; }