🃏 FLIP 2 WIN

A Fun & Interactive Memory Card Matching Game

Flip the cards. Match the pairs. Test your memory. 🧠

---

📖 About

Flip 2 Win is a classic memory card matching game built with pure HTML, CSS, and JavaScript. No frameworks, no dependencies — just clean vanilla code.

Flip two cards at a time, find all matching pairs, and try not to run out of lives!

---

✨ Features

Feature	Description
🎴 Flip Animation	Smooth CSS card flip transitions
🔀 Randomized Shuffle	Cards are shuffled every new game
🎯 Score Tracking	Earn points for every matched pair
❤️ Lives System	Limited lives — match wisely!
🔄 Restart Option	Reset and play again anytime
⚡ Responsive UI	Clean, smooth, distraction-free interface

---

🎮 How to Play

Step 1 → Click a card to flip it
Step 2 → Flip a second card
Step 3 → Match? → Cards stay open + earn points ✅
Step 4 → No match? → Lose a life + cards flip back ❌
Step 5 → Match all pairs before lives run out to WIN 🏆

---

🛠️ Tech Stack

🏗️ Structure	🎨 Styling	⚡ Logic	🚀 Deployment
HTML5	CSS3	Vanilla JavaScript	Vercel

---

🏗️ System Architecture

User Click → Event Listener → Flip Card → Check Match
                                              │
                                    ┌─────────┴─────────┐
                                    ▼                     ▼
                              ✅ Match                ❌ No Match
                              Score++                  Lives--
                              Cards Stay               Cards Flip Back
                                    │                     │
                                    └─────────┬───────────┘
                                              ▼
                                     All Matched? → 🏆 WIN
                                     Lives = 0?   → 💀 GAME OVER

---

🧠 Core Concepts

Concept	Usage
🔀 Array Shuffle	Fisher-Yates algorithm for card randomization
🎯 Event Listeners	Click-based card flip interaction
⏱️ setTimeout	Delay before unmatched cards flip back
🧩 DOM Manipulation	Dynamic card rendering & state updates
🏗️ Game State	Score, lives, matched pairs tracking

---

📂 Project Structure

flip-2-win/
│
├── index.html          # Game layout & structure
├── style.css           # Styling, animations & responsiveness
├── script.js           # Game logic, shuffle, matching & state
└── README.md

---

🚀 Getting Started

# Clone the repository
git clone https://github.com/Anas-Sd/Flip-2-Win.git

# Navigate to the project
cd Flip-2-Win

# Open in browser
open index.html
# or simply double-click index.html

No dependencies. No build tools. Just open and play! 🎮

---

🔮 Roadmap

Status	Feature
✅	Core matching game
✅	Score & lives system
✅	Card shuffle & animations
🔜	⏱️ Timer mode
🔜	🏆 Leaderboard system
🔜	🔊 Sound effects
🔜	🎨 Difficulty levels (Easy / Medium / Hard)
🔜	📱 Enhanced mobile optimization

---

🤝 Contributing

Contributions are welcome!

1. Fork the repository
2. Create your feature branch → git checkout -b feature/NewFeature
3. Commit your changes → git commit -m 'Add NewFeature'
4. Push to the branch → git push origin feature/NewFeature
5. Open a Pull Request

📌 Please open an issue before major feature proposals.

---

📬 Contact

---

⚖️ License

Distributed under the MIT License. See LICENSE for details.

---

⭐ If you enjoyed playing, star the repo!

Made with ❤️ and 🧠 by Syed Anas