From d494006e931f5a4434f95c268b1cf90f001013ba Mon Sep 17 00:00:00 2001
From: ashtonanderson <ashton@cs.toronto.edu>
Date: Sat, 7 Nov 2026 08:05:24 +0000
Subject: [PATCH] fix(play): start the desktop game page under the header, not
 centred

On a desktop, /play/maia centred the game vertically in a screen-tall
area, so it sat under a band of empty space: the board started 150 px
from the top in a 1280x720 window, 173 px at 1440x900, 195 px at
1920x1080 and 240 px at 2560x1440. It now starts at 80 px at every size,
as Hand and Brain's game already did. The phone layout and the tablet
widths, which use other layouts, are unchanged.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 src/components/Board/GameplayInterface.tsx | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/components/Board/GameplayInterface.tsx b/src/components/Board/GameplayInterface.tsx
index 75d6fcbd..48d540c3 100644
--- a/src/components/Board/GameplayInterface.tsx
+++ b/src/components/Board/GameplayInterface.tsx
@@ -212,7 +212,9 @@ export const GameplayInterface: React.FC<React.PropsWithChildren<Props>> = (
 
   const desktopLayout = (
     <>
-      <div className="flex h-full flex-1 flex-col justify-center gap-1 py-2 md:py-4">
+      {/* From the top, as on the analysis page: centred, the game sat under
+          a band of empty space (about 100px in a 900px-tall window). */}
+      <div className="flex h-full flex-1 flex-col justify-start gap-1 py-2 md:py-4">
         <div className="mx-auto mt-2 flex w-[90%] flex-row items-start justify-between gap-3">
           <div className="flex h-[75vh] max-h-[75vh] min-h-[75vh] w-[22rem] min-w-[22rem] max-w-[22rem] flex-shrink-0 flex-col overflow-hidden">
             <div className="flex h-full w-full flex-col overflow-hidden rounded-md border border-glass-border bg-glass backdrop-blur-md">