Emoji Animal Guess

Cinevva's analyzer read this game's design doc and its source, then wrote the brief below. "Make your own" hands it to the game creator as your opening message, so you start from a real spec rather than a one-line idea.

Create a responsive browser quiz game titled “Emoji Animal Guess.” Use a centered quiz shell, with a top header containing the large title on the left and four rounded translucent stat pills on the right: “Score,” “Streak,” “Best,” and “Accuracy.” The page should fill the viewport with a dark navy radial-gradient background, lighter near the top and very dark at the edges. Place the quiz in a large dark translucent card with a subtle light border, rounded corners, and a soft shadow.

At the start of each game, build a shuffled set of 100 questions from a large animal question bank (if the bank has more than 100 entries, use 100 randomly selected entries). Each question contains an animal name, a two-emoji clue, and four answer choices; shuffle the four choices independently. Include a broad animal vocabulary such as lion, tiger, elephant, monkey, panda, penguin, dolphin, owl, rabbit, frog, bee, cow, chicken, dog, cat, horse, zebra, giraffe, kangaroo, koala, polar bear, camel, shark, whale, octopus, crab, lobster, snail, turtle, snake, crocodile, bat, wolf, fox, bear, pig, sheep, goat, deer, moose, squirrel, hedgehog, mouse, hamster, parrot, peacock, swan, flamingo, duck, goose, turkey, eagle, hawk, crow, raven, toucan, seal, walrus, otter, beaver, capybara, hippo, rhino, buffalo, bison, donkey, llama, alpaca, leopard, cheetah, jaguar, gorilla, sloth, ant, butterfly, spider, scorpion, dragonfly, moth, jellyfish, squid, shrimp, starfish, seahorse, goldfish, clownfish, pufferfish, salmon, tuna, camel spider, chameleon, iguana, gecko, alligator, armadillo, anteater, tapir, raccoon, skunk, badger, ferret, weasel, and mink. Use recognizable clue pairs from the source design, for example Lion “👑🦁”, Tiger “🐅🌿”, Elephant “🐘💦”, Monkey “🐒🍌”, Panda “🐼🎍”, Penguin “🐧🧊”, Dolphin “🐬🌊”, Parrot “🦜🏴‍☠️”, Peacock “🦚✨”, Toucan “🦜🌴”, and Duck “🦆🍞”. Every question’s four choices must include exactly one correct animal and three plausible distractors.

The card’s normal question view should show a small progress label such as “Question 1 of 100,” a very large centered emoji clue, and the centered prompt “Which animal do these emoji describe?” Below it, display four large answer buttons in a two-column grid. Buttons use a vivid purple vertical gradient, white bold text, rounded corners, and a slight upward movement/brightness effect on hover. On narrow screens, switch the answer grid to one column. Support mouse clicks and touch/tap.

When an answer is selected, prevent additional selections. Disable all four answer buttons, highlight the correct answer with a green gradient, and if the selected answer was wrong, highlight that selected button with a red gradient. A correct answer adds 10 points, increments correct answers and the current streak, and updates the best streak; display green feedback text “Correct!”. A wrong answer increments incorrect answers, resets the streak to zero, and displays red feedback in the form “Wrong — it was [correct animal].” Update the stat pills immediately. Accuracy is the rounded percentage of answered questions that are correct, initially 0%.

Below the feedback, provide a yellow “Next” button and a translucent outlined “Restart” button. Next starts disabled and only becomes enabled after an answer; clicking it advances to the next question and resets the question view. Restart immediately resets score, correct/wrong counts, streak, best streak, question index, and generates a newly shuffled 100-question quiz. Make the action buttons rounded, bold, and responsive; on mobile stack them vertically and make them full width.

After all 100 questions, replace the card contents with a centered completion screen: a “Quiz complete” label, large “🏆🐾” emoji, heading “Final Results,” text stating “You finished all 100 questions,” and a two-column summary grid (one column on mobile) containing Score, Correct, Wrong, Best Streak, Accuracy, and Last Answer. Add a yellow “Play Again” button that starts a fresh shuffled quiz. Keep the header stats visible and updated on the summary screen. Use clean sans-serif typography, high contrast, playful card-based styling, and no external images or game canvas; emoji are the visual clues.