[MsMarion]

Follow-up to the phone layout (#30): the other screen sizes. Same look, no new UI.

I looked at the live site at each size first. Findings:

Screen	Before	Now
Laptop 1366x768, tablet on its side 1180x820, ultrawide 3440x1440	fine	unchanged (desktop stage)
Tablet held upright 820x1180	a 1920 px stage shrunk to 43 percent, content in the top half, bottom half empty	the phone layout on a 640 px stage: lobby, game (camera + the sign to show), sign in, results all fill the width
Phone on its side 844x390	a 36 percent stage, sign-in a thin sliver	a "rotate your phone upright to play" notice with a "continue anyway" link

How it works

• One rule, computeLayout(width, height) in src/lib/layout.ts (unit tested for 30+ sizes), used by the stage, the game component and the CSS. A new compact: Tailwind variant follows the stage, so the styles and the code cannot disagree.
• Bug fixed on the way: the stage was overflow: hidden, which code can still scroll (focus, scrollIntoView). In testing, a click on START scrolled the whole stage up and to the left and cropped the page; on a tablet an input getting focus could do the same. It is now overflow: clip, which cannot be scrolled. There is a test that tries to scroll it.
• Not changed: songs/community still use the desktop stage on phones and tablets (they have no songs yet); the three-tab arch is hidden in the compact layout.

Tested

Unit 47/47 (computeLayout across phones, tablets, laptops, monitors, sideways phones, wide-and-short windows); tsc; 6 new browser tests (F-08 to F-13) plus the 7 phone tests pass locally with real hand tracking; matrix is 106 rows. Looked at the screenshots at each size.