fix(story-mode): on a phone LIVE sits beside the title, not on a fourth bar row

With three reading levels the third bar row (the levels and Save image)
is full at 390px, and a running turn's LIVE pill wrapped onto a fourth
row (the bar went from 170 to 222px). On a phone LIVE now sits on the
title row, where the session name gives way to it; the bar stays at
three rows either way.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>

src/web/public/story-mode.css

@@ -263,11 +263,15 @@ body.story-open {
   .story-save {
     order: 3;
   }
-  /* Three reading levels and Save image share one row at 390px. */
+  /* Three reading levels and Save image share one row at 390px; LIVE goes up beside the title,
+     where the session name gives way to it (on the third row it wrapped to a fourth). */
   .story-seg-btn {
     padding: 6px 7px 5px;
     font-size: 15px !important;
   }
+  .story-live {
+    order: 0;
+  }
 }
 
 /* Main: the sheet and the wire */