diff --git a/index.html b/index.html
index 6b6bfd2..0ae123e 100644
--- a/index.html
+++ b/index.html
@@ -230,8 +230,11 @@ if (location.hostname !== 'splatter-tennis.wuwi.one') {
                    filter: saturate(0.45) brightness(0.62); transition: filter 0.15s; }
   #modeList button.mode.on { border-color: var(--acid); filter: none; }
   #modeList b { text-shadow: 0 1px 0 #000, 0 0 6px rgba(0,0,0,0.9); }
-  #modeList i { color: var(--cream); opacity: 0.8; margin-bottom: 0;
-                   text-shadow: 0 1px 0 #000, 0 0 6px rgba(0,0,0,0.9); }
+  /* the subtitle carries the mode's one-line rules over busy art, so it gets WHITE at full
+     opacity, a size up from the court rows' 9px, and a solid black underlay — "barely readable"
+     at cream-on-crowd was the report from the first live look */
+  #modeList i { color: #fff; font-size: 10px; margin-bottom: 0;
+                   text-shadow: 0 1px 0 #000, 1px 0 0 #000, -1px 0 0 #000, 0 -1px 0 #000, 0 0 7px #000; }
   #courtList button.court { display: flex; align-items: center; gap: 11px; width: 100%;
                    margin: 0 0 8px; padding: 7px; background: var(--panel);
                    border: 2px solid var(--line); color: inherit; font: inherit; text-align: left;
@@ -440,6 +443,6 @@ if (location.hostname !== 'splatter-tennis.wuwi.one') {
     </div>
   </div>
 </div>
-<script type="module" src="src/main.js?v=230"></script>
+<script type="module" src="src/main.js?v=231"></script>
 </body>
 </html>