Improve visual gameplay with larger board and gridlines

[NpFSHjNdg8oZCVOuyJ6XyYxkGX70xFD9]

This PR changes the playing board by adding gridlines and increasing the size while maintaining a square shape. This matters because the previous UI only gave room for a small area of movement and it was not able to distinguish between tiles. I verified this by opening a live preview on the branch where changes were made. I expected the playing board to be significantly larger than the original and that it includes lines to differentiate between tiles. This is exactly what I observed.

Before:

After:

[Copilot]

Pull request overview

This PR enlarges the game board, enforces a square play area, and adds gridlines so tiles are visually distinguishable, improving gameplay clarity. It also adds alternative WASD controls and brings in documentation and licensing material for the Snake game.

Changes:

• Increased wrapper width and made the .play-board square via aspect-ratio, adding CSS gridline backgrounds aligned to the 30×30 grid.
• Extended input handling to support WASD controls in addition to arrow keys.
• Added a full index.html for the game UI, plus an Extra folder with a README (including code snippets) and an MIT license.

Reviewed changes

Copilot reviewed 2 out of 5 changed files in this pull request and generated no comments.

Show a summary per file

File	Description
Main/style.css	Enlarges the wrapper and enforces a square play area with gridlines to visually distinguish tiles.
Main/script.js	Adds WASD key handling to the direction-change logic to complement the existing arrow key controls.
Main/index.html	Defines the game layout (score area, board, modals) that hosts the enlarged play area and connects to the script and styles.
Extra/README.md	Provides documentation and example code for the Snake game, explaining gameplay and structure.
Extra/LICENSE	Adds an MIT license for the Snake game code, clarifying usage and redistribution rights.

Comments suppressed due to low confidence (1)

Main/script.js:46

• This change adds additional WASD controls, which is a behavioral change that isn’t mentioned in the PR description (which only talks about the board size and gridlines). To avoid surprises for reviewers and future readers of the history, consider updating the PR description (or commit message) to call out the new control scheme as well.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.