Word Guess

This game is a single-page experience: the HTML provides the screen layout, CSS handles the visual styling, and JavaScript manages the round flow, scoring, hints, and external data.

+---------------------------+
| Browser UI (DOM / HTML)   |
| - Word display            |
| - Stats cards             |
| - Guess input + buttons   |
+-------------+-------------+
              |
              v
+---------------------------+
| Game Controller (JS)      |
| - state: currentWord      |
| - score / attempts        |
| - round lifecycle         |
| - hint and win logic      |
+------+------+-------------+
       |      |
       |      +----------------------------+
       |                                   |
       v                                   v
+---------------------+           +------------------------+
| Word Source Layer   |           | Persistence Layer     |
| - Wikipedia API    |           | - localStorage        |
| - fallback word list|          | - high score          |
+----------+----------+           +------------------------+
           |
           v
+---------------------+
| Definition Layer    |
| - Dictionary API    |
+---------------------+

Flow:
1. Start -> fetch words from Wikipedia
2. Queue words and pick the next one
3. Mask the word and render UI
4. Player guesses -> update score / hints / attempts
5. Win, lose, or skip -> move to next round

• UI layer: the visible page elements such as the masked word, stats, input box, and action buttons.
• Controller layer: the JavaScript functions that manage state, scoring, and game progression.
• Word sourcing: the game fetches candidate words from Wikipedia and falls back to a built-in list if needed.
• Definition lookup: the dictionary API provides a short definition for the current word.
• Persistence: the high score is saved in local storage so it survives refreshes.