Memory Match!

📖 What It Does

Memory Match is a browser-based card matching game built with HTML5, CSS, and Vanilla JavaScript. Players choose a difficulty, flip hidden cards, remember emoji positions, match pairs, and finish with a score based on speed and accuracy.

🎮 How to Use

Select Easy, Medium, or Hard to set the board size
Click any card to reveal the hidden emoji
Flip a second card and try to find the matching pair
Matched cards stay open and missed cards flip back
Use Hint to briefly reveal one available pair
Complete the board to see your time, moves, score, and stars

✨ Key Features

              
                  Difficulty Levels: Easy, Medium, and Hard
                  boards with different pair counts and layouts
                
                  Shuffled Deck: Fresh emoji pair order on every
                  new game
                
                  Scoring System: Match bonuses, missed-pair
                  penalties, and hint penalties
                
                  Game Feedback: Flip animation, match pulse,
                  wrong-pair shake, and hint highlight
                
                  Win Screen: Final time, moves, score, star
                  rating, replay action, and confetti celebration

🚀 Key JavaScript Concepts

              
                  State Management: Active difficulty, deck,
                  flipped cards, matches, score, moves, timer, and board lock
                
                  Array Methods: map, filter, flatMap, slice,
                  and Fisher-Yates shuffle for deck creation
                
                  DOM Rendering: Dynamic board generation from
                  the current card state
                
                  Timers: setInterval for elapsed time and
                  setTimeout for match, miss, hint, and confetti timing
                
                  Event Handling: Difficulty controls, card
                  clicks, restart, hint, popup, and replay actions

🎨 Design Features

Playful typography with a warm arcade-style card table
Color-coded difficulty buttons and stat counters
Rounded card grid with bright gradients and soft shadows
Responsive board sizing for desktop and mobile screens
Internal popup scrollbar styled inside the rounded modal

💻 Technologies Used

HTML5 CSS3 Vanilla JavaScript DOM API CSS Animations Responsive Design

🧠 Memory Match!

You Win!