Updated readme file according to the changes made.

Author: hemaharshini-dev

README.md

@@ -12,7 +12,7 @@ Missions are grouped into three categories on the Hub:
 
 ### 🎭 Social Engineering
 #### 1. 🕵️ Phishing Detective
-*   **Adaptive Difficulty:** Timer adjusts based on your XP rank — 10s (Novice), 7s (Specialist), 5s (Elite Guardian). Difficulty badge shown in the AI label.
+*   **Adaptive Difficulty:** Timer adjusts based on your XP rank — 30s (Novice), 27s (Specialist), 25s (Elite Guardian). Difficulty badge shown in the AI label.
 *   **Timed Scenarios:** Countdown per question across 5 curated + 1 AI-generated scenario.
 *   **Header Inspection:** Click the sender address to reveal raw `Authentication-Results` and `X-Original-Sender` headers.
 *   **Hover-to-Reveal:** Preview destination URLs to spot domain spoofing (e.g., `amaz0n.in` vs `amazon.in`).
@@ -37,7 +37,7 @@ Missions are grouped into three categories on the Hub:
 
 #### 4. 🧩 Malware Escape
 *   **Incident Response:** Manage "System Health" during an active ransomware outbreak.
-*   **Terminal Interface:** Type commands (`isolate-network`, `run-antivirus`, `restore-backup`, etc.) into a live console.
+*   **Terminal Interface:** Type commands (`isolate-network`, `run-antivirus`, `restore-backup`, etc.) into a live console with a clearly separated Execute button.
 *   **Command History:** Use ↑/↓ arrow keys to navigate previous commands; Tab for auto-complete.
 *   **Glitch Effect:** The UI visually degrades when System Health drops below 40.
 *   **Safety Protocols:** Actionable security tips shown at mission end.
@@ -55,7 +55,7 @@ Missions are grouped into three categories on the Hub:
 *   **Completion Screen:** Deep Dive (Adobe 2013 breach, Collection #1 2019) and safety protocols shown at mission end.
 *   **XP Lock:** Requires 50 XP to unlock.
 
-#### 7. 🚨 Incident Response Simulator *(New)*
+#### 7. 🚨 Incident Response Simulator
 *   **Branching Scenario Tree:** Navigate a realistic multi-step corporate breach — from a phishing email through credential theft, ransomware deployment, and regulatory reporting.
 *   **Consequence Engine:** Every decision has an immediate consequence shown before the next scene loads. Wrong calls add to the Breach Damage meter.
 *   **Breach Damage Meter:** A 0–100% damage bar tracks cumulative harm from poor decisions across the scenario.
@@ -65,18 +65,18 @@ Missions are grouped into three categories on the Hub:
 *   **XP Lock:** Requires 100 XP to unlock.
 
 ### 🛠️ Tools & Knowledge
-#### 8. ⚡ Daily Challenge *(New)*
+#### 8. ⚡ Daily Challenge
 *   **One Question Per Day:** A single scenario-based question drawn from a 12-question pool (Phishing, Social Engineering, Password, Malware, Smishing, MFA, Dark Web, Quishing) — seeded deterministically so every player gets the same question each day.
 *   **30-Second Timer:** Faster correct answers earn more XP (up to 30 XP; wrong answers earn 5 XP).
 *   **Daily Leaderboard:** Top-10 scores for the current day stored in Firestore under `dailyScores/{dateKey}/players`.
 *   **Already-Played State:** Shows a live countdown to the next challenge if you've already completed today's question.
 *   **Explanation Panel:** After answering, the correct answer and a detailed explanation are revealed.
 
 #### 9. 📱 Smishing Simulator
-*   **Mobile Interface:** Identify malicious SMS messages within a realistic phone frame.
-*   **Drag-and-Drop:** Drag SMS bubbles into "Scam" or "Safe" bins, or use the on-screen buttons.
-*   **Quishing (QR Phishing):** Some messages contain mock QR codes — tap to reveal the hidden malicious URL before deciding.
-*   **Completion Screen:** Score summary, grade, Deep Dive (FluBot 2021, USPS scam wave) and safety protocols shown at mission end.
+*   **Two-Column Layout:** Phone frame on the left, Scam/Safe drop bins and feedback on the right — everything visible without scrolling.
+*   **Drag-and-Drop:** Drag SMS bubbles into "Scam" or "Safe" bins, or click the bins directly.
+*   **Quishing (QR Phishing):** Some messages contain mock QR codes — click "🔍 Click to reveal hidden URL" to inspect the destination before deciding. Safe links show `https://`, scam links use `http://` or suspicious domains.
+*   **Completion Screen:** Replaces the game layout entirely — shows score, grade, collapsible Deep Dive (FluBot 2021, USPS scam wave), and safety protocols. Title updates to "📱 Smishing Simulation Complete".
 
 #### 10. 🧪 Mission Creator
 *   **Custom Scenario Builder:** Fill in Sender, Subject, Body, and Link fields with a live email preview pane.
@@ -95,7 +95,7 @@ Missions are grouped into three categories on the Hub:
 
 *   **Frontend:** HTML5, CSS3 (Retro-Cyberpunk aesthetic with CRT effects, scanlines, and neon animations). Fully responsive with mobile media queries (`<600px`, `601–900px`).
 *   **Database & Auth:** **Firebase** (Firestore for XP/Leaderboard/Daily Scores and Firebase Auth for Email/Password + Google Sign-In).
-*   **Audio Engine:** **Web Audio API** for an immersive soundscape — procedurally generated success, error, and click sounds, plus a full ambient cyberpunk music engine with bass drone, mid pad, and rhythmic pulse.
+*   **Audio Engine:** **Web Audio API** — procedurally generated success, error, and click sounds, plus two selectable ambient music tracks (Cyberpunk and Dark Ambient) with reverb, arpeggios, kick/hihat rhythm, and LFO modulation.
 *   **Logic:** Modular ES6+ JavaScript.
 *   **AI Integration:** OpenRouter API (Mistral-7B) for live phishing scenario generation with a local fallback engine.
 *   **Adaptive Learning:** `adaptive.js` engine delivers difficulty scaling (timer, extra steps) and actionable safety protocols based on user XP rank.
@@ -108,27 +108,30 @@ Missions are grouped into three categories on the Hub:
 | :--- | :--- |
 | **XP & Leaderboard** | Earn XP for every successful mission and climb the global top-5 ranks (stored in Firestore). |
 | **Rank System** | Novice (0 XP) → Specialist (100 XP) → Elite Guardian (500 XP), with a progress bar. |
-| **Adaptive Difficulty** | Timer and scenario complexity scale with XP rank. Novice: 10s timer. Specialist: 7s + extra social engineering steps. Elite: 5s + extra steps. |
+| **Adaptive Difficulty** | Timer and scenario complexity scale with XP rank. Novice: 30s timer. Specialist: 27s + extra social engineering steps. Elite: 25s + extra steps. |
 | **Achievements / Badges** | Unlock badges: 🔰 Rookie (0 XP), 🔍 Detective (50 XP), 🛡️ Shield (200 XP), 👑 Elite (500 XP). |
 | **Mission Locks** | Dark Web (50 XP), AI Crime Lab (75 XP), Incident Response (100 XP), Mission Creator (150 XP). Locked missions show a 🔒 overlay with the required XP. |
-| **Unlock Toasts** | When you earn enough XP to unlock a mission or feature, an animated toast notification appears. |
+| **🔔 Notification Bell** | When you earn enough XP to unlock a mission or feature, a red badge appears on the 🔔 bell icon in the top bar. Click it to see all unlocks — no intrusive popups. Mark all as read to clear the badge. |
 | **Hard Mode** | Unlocked at 300 XP — all missions run at Elite difficulty. |
-| **Mission Completion Tracker** | Profile panel shows ✅/⬜ status for all 10 missions. |
+| **Mission Completion Tracker** | Profile page shows ✅/⬜ status for all 10 missions. |
 | **Unlocks Panel** | Progress bars in the profile show how close you are to each locked mission/feature. |
 | **Daily Challenge** | One question per day from a 12-scenario pool. Faster answers earn more XP. Daily leaderboard resets at midnight. |
 | **System Health** | Visual health bar during Malware Escape; triggers glitch effects at low health. |
 | **Trust Level** | Real-time gauge of psychological manipulation in Social Engineering. |
 | **Breach Damage Meter** | Tracks cumulative damage from poor decisions in Incident Response. |
 | **Safety Protocols** | Actionable, real-world security tips shown at mission end for all mission categories. |
 | **Deep Dives** | Real-world case studies shown on mission completion screens (Phishing, Social, AI, Malware, Password, Dark Web, Smishing). |
-| **Onboarding Tour** | 7-step guided tour on first login with spotlight overlay, progress dots, and skip/back/next controls. Replay anytime via the 🧭 Tour button. |
+| **Onboarding Tour** | 6-step guided tour on first login with spotlight overlay, progress dots, and skip/back/next controls. Replay anytime via the 🧭 Tour button. |
 | **How to Play Guide** | Modal shown on first login with mission overview, key features, and pro tips. Accessible anytime via the 🎮 Guide button. |
+| **👤 Profile Page** | Dedicated profile page (`profile.html`) with XP, rank, badges, mission tracker, unlocks progress, and global leaderboard — accessible via the 👤 Profile button in the top bar. |
 | **Share Score** | Share your rank, XP, and missions completed via the Web Share API or clipboard copy. |
 | **Activity Ticker** | Live scrolling feed on the Hub simulating global community activity. |
 | **High Contrast Mode** | Accessibility toggle persisted via `localStorage`. |
-| **Font Size Controls** | A/A/A buttons in the audio bar to switch between small, medium, and large text. Persisted via `localStorage`. |
-| **Audio Controls** | Persistent volume slider, mute button, and ambient music toggle (bottom-right corner, all pages). |
+| **⚙️ Settings Panel** | Gear icon (fixed, top-right) opens a panel with Font Size (Small/Medium/Large dropdown), Music Track selector, Volume slider, Mute button, and Music ON/OFF toggle. All settings persisted via `localStorage`. |
+| **Music Tracks** | Two selectable ambient tracks: ⚡ Cyberpunk (120 BPM minor pentatonic arpeggio + kick/hihat + reverb) and 🌑 Dark Ambient (slow evolving pads + sub-bass + occasional deep thuds). |
+| **Audio Controls** | Volume slider, mute button, music toggle, and track selector — all inside the ⚙️ Settings panel. |
 | **Breadcrumbs** | Auto-injected navigation trail on all mission pages. |
+| **Personalized Greeting** | Hub shows "Hi, [name]!" using `displayName` for Google users or the part before `@` for email/password users. |
 | **ARIA & Accessibility** | `aria-live`, `role="progressbar"`, `role="alert"`, `role="toolbar"`, `aria-label` attributes throughout. `focus-visible` styles and `prefers-reduced-motion` support in CSS. |
 
 ---
@@ -137,30 +140,31 @@ Missions are grouped into three categories on the Hub:
 
 ```text
 CyberArena/
-├── hub.html            # Mission Hub, User Profile, Achievements & Global Leaderboard
+├── hub.html            # Mission Hub — missions only, top bar with Profile & Bell
+├── profile.html        # Dedicated Profile page — XP, rank, badges, missions, unlocks, leaderboard
 ├── index.html          # Firebase Auth Portal (Email/Password + Google)
 ├── phishing.html       # Phishing Detective Mission
 ├── social.html         # Social Engineering Simulator
 ├── ai.html             # AI Crime Lab (Deepfake Detection)
 ├── malware.html        # Malware Escape (Terminal Interface)
 ├── password.html       # Password Strength, Entropy & MFA Lab
 ├── darkweb.html        # Breach Search & Risk Assessment Simulator
-├── smishing.html       # Mobile SMS & QR (Quishing) Simulator
+├── smishing.html       # Mobile SMS & QR (Quishing) Simulator — two-column layout
 ├── incident.html       # Incident Response Simulator (branching scenario tree)
 ├── daily.html          # Daily Challenge (one question/day + daily leaderboard)
 ├── creator.html        # Custom Phishing Mission Builder
 ├── wiki.html           # Cyber-Wiki Knowledge Base
 ├── css/
-│   └── style.css       # Neon-Cyberpunk UI Framework + mobile media queries + tour styles
+│   └── style.css       # Neon-Cyberpunk UI Framework + mobile media queries + tour styles + settings panel
 └── js/
     ├── firebase.js     # Firebase Config & Initialization
-    ├── auth.js         # Authentication Logic — addEventListener-based (no inline onclick)
+    ├── auth.js         # Authentication Logic — shows "Hi, name!" greeting on login
     ├── xp.js           # XP & Firestore Data Management (updateXP, getUserData)
-    ├── common.js       # Shared Navigation, Breadcrumbs, High Contrast, Font Size & Audio System
+    ├── common.js       # Shared Navigation, Breadcrumbs, High Contrast, ⚙️ Settings Panel & Audio Engine
     ├── audio.js        # Standalone Audio Module (ES6 export)
-    ├── adaptive.js     # Adaptive Difficulty Engine — timerSeconds, extraSteps, safetyProtocols
-    ├── tour.js         # 7-step Onboarding Tour — spotlight overlay, dots, localStorage persistence
-    ├── unlocks.js      # Mission/Feature Lock System — XP thresholds, lock overlays, unlock toasts
+    ├── adaptive.js     # Adaptive Difficulty Engine — timerSeconds (30/27/25), extraSteps, safetyProtocols
+    ├── tour.js         # 6-step Onboarding Tour — spotlight overlay, dots, localStorage persistence
+    ├── unlocks.js      # Mission/Feature Lock System — XP thresholds, lock overlays, 🔔 notification bell
     ├── guard.js        # Mission Guard — redirects or blocks page if XP threshold not met
     ├── daily.js        # Daily Challenge Engine — seeded pool, Firestore score submission, leaderboard
     ├── phishing.js     # Phishing Detective Logic + AI Scenario Engine
@@ -169,7 +173,7 @@ CyberArena/
     ├── malware.js      # Malware Escape Terminal Logic
     ├── password.js     # Password Analysis, MFA & Fatigue Simulation + completion screen
     ├── darkweb.js      # Breach Database Search, Risk Assessment + completion screen
-    ├── smishing.js     # SMS/QR Phishing Simulator Logic + completion screen
+    ├── smishing.js     # SMS/QR Phishing Simulator — two-column layout, completion screen
     └── creator.js      # Custom Mission Builder, JSON Export & educational breakdown
 ```
 
@@ -186,7 +190,7 @@ CyberArena/
 3.  **Run Locally**
     *   Open `index.html` in any modern web browser. A local server (e.g., VS Code Live Server) is recommended for Firebase ES modules to load correctly.
 4.  **Or visit the live hosted version directly at [https://cyberarena-77a96.web.app](https://cyberarena-77a96.web.app)**
-4.  **(Optional) Enable Live AI Scenarios**
+5.  **(Optional) Enable Live AI Scenarios**
     *   Get a free API key from [OpenRouter](https://openrouter.ai).
     *   Open the Phishing Detective mission in your browser, press **F12** to open DevTools, and click the **Console** tab.
     *   Paste the following and press Enter — do **not** run this in a terminal:
@@ -207,8 +211,12 @@ CyberArena/
 | `muted` | Audio mute state |
 | `volume` | Master volume level (0–1) |
 | `musicOn` | Ambient music on/off state |
+| `musicTrack` | Selected music track (`cyberpunk` or `dark`) |
 | `fontSize` | Font size class (`font-sm`, `font-md`, `font-lg`) |
+| `settingsPanelOpen` | Whether the ⚙️ settings panel is open or closed |
 | `openrouter_api_key` | OpenRouter API key for live AI phishing scenarios |
+| `seenUnlocks` | Array of unlock IDs already processed — prevents duplicate bell notifications |
+| `unlockNotifications` | Array of unlock notification objects `{ id, label, description, read }` for the 🔔 bell |
 
 ---