More random UI fixes.

web/src/components/BattlePhase.tsx

@@ -537,13 +537,19 @@ export function BattlePhase({ view, send, step, setStep }: Props) {
               ? { left: peek.rect.left }
               : { right: window.innerWidth - peek.rect.right }),
           }
+          // Your deck sits on the left of the board and fights from its right
+          // edge; the rival's sits on the right and fights from its left edge.
+          // Order each peek to match, so "first" always points toward the clash.
+          const mine = peek.seat === youSeat
+          const firstSide = mine ? 'right' : 'left'
           return createPortal(
             <div className={`deck-peek deck-peek-${peek.dir}`} style={style}>
               <div className="deck-peek-label">
-                {peek.seat === youSeat ? 'Your' : 'Opponent’s'} deck · {lineup.length} card
-                {lineup.length !== 1 ? 's' : ''} (first on the right)
+                {mine ? 'Your' : 'Opponent’s'} deck · {lineup.length} card
+                {lineup.length !== 1 ? 's' : ''} (first on the {firstSide})
               </div>
-              <div className="deck-peek-cards">
+              <div className={`deck-peek-cards first-${firstSide}`}>
+                <div className="deck-peek-first">⚔️ first</div>
                 {lineup.map((c, i) => (
                   <CardView key={c.id || i} card={c} size="sm" />
                 ))}