From 3922f545dca7e14b5fa65bcc55a6e91f3af1a814 Mon Sep 17 00:00:00 2001
From: Greyson Parrelli <greyson@signal.org>
Date: Thu, 23 Jul 2026 07:47:51 -0400
Subject: [PATCH] Keep button layout stable.

---
 web/src/components/BattlePhase.tsx | 19 +++++++++++--------
 1 file changed, 11 insertions(+), 8 deletions(-)

diff --git a/web/src/components/BattlePhase.tsx b/web/src/components/BattlePhase.tsx
index 013edcf..094ec2a 100644
--- a/web/src/components/BattlePhase.tsx
+++ b/web/src/components/BattlePhase.tsx
@@ -339,7 +339,7 @@ export function BattlePhase({ view, send }: Props) {
             disabled={step === 0}
             title="Previous step"
           >
-            ◀
+            |◀
           </button>
           <button
             className="btn btn-ghost btn-sm"
@@ -347,7 +347,7 @@ export function BattlePhase({ view, send }: Props) {
             disabled={done}
             title={paused ? 'Play' : 'Pause'}
           >
-            {paused ? '▶' : '⏸'}
+            {paused || done ? '▶' : '⏸'}
           </button>
           <button
             className="btn btn-ghost btn-sm"
@@ -355,16 +355,19 @@ export function BattlePhase({ view, send }: Props) {
             disabled={done}
             title="Next step"
           >
-            ▶
+            ▶|
           </button>
           <span className="battle-step">
             {Math.min(step, events.length)} / {events.length}
           </span>
-          {!done && (
-            <button className="btn btn-ghost btn-sm" onClick={() => setStep(events.length)}>
-              Skip ⏭
-            </button>
-          )}
+          <button
+            className="btn btn-ghost btn-sm"
+            onClick={() => setStep(events.length)}
+            disabled={done}
+            title="Skip to the end"
+          >
+            Skip ⏭
+          </button>
         </div>
       </div>