fix: keep drawing canvas usable in narrow viewports

[electrohyun]

Summary

Keep the drawing canvas usable on short, narrow viewports by allowing the mobile page to scroll and reserving enough vertical space for the board and player panels. Reposition the brand below the fixed target badge so the header controls remain distinct at phone widths.

Extend the drawing-game browser verifier with a 375 × 667 layout check for both Smocket and real Socket.IO. It covers canvas height, board containment, header overlap, and access to the delivery record through document scrolling.

Related issue

Closes #482

Checklist

• Tests added or updated
• Behavior verified against real socket.io

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment

Project	Deployment	Actions	Updated
smocket	Skipped		Sep 3, 2026 3:03am UTC

[coderabbitai]

Warning

Review limit reached

Next included review available in 47 minutes.

Check out review usage here.

View limit details

Limit details: You’ve used the included review currently available.

You've used all free OSS reviews for now. Wait for the free limit to reset to keep reviewing this public repository.

Learn how review limits work.

Review configuration:

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Team

Run ID: 9e1c84a8-dc19-4029-aba7-b79210a0801e

📥 Commits

Reviewing files that changed from the base of the PR and between 0d3ea2c and a019bda.

📒 Files selected for processing (2)

• examples/drawing-game/src/style.css
• examples/drawing-game/verify.mjs

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}