Added changes

.gitignore

@@ -0,0 +1,53 @@
+# General OS & Environment
+.DS_Store
+Thumbs.db
+*.log
+.env
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+!.env.example
+!.env.local.example
+
+COPILOT_PROMPT.md
+
+# Frontend (Node.js & Next.js)
+frontend/node_modules/
+frontend/.pnp
+frontend/.pnp.js
+frontend/.next/
+frontend/out/
+frontend/build/
+frontend/coverage/
+frontend/.vercel
+
+# Backend (Python)
+backend/__pycache__/
+backend/*.py[cod]
+backend/*$py.class
+backend/.pytest_cache/
+backend/.coverage
+backend/htmlcov/
+backend/venv/
+backend/env/
+backend/ENV/
+backend/env.bak/
+backend/venv.bak/
+backend/.venv/
+backend/build/
+backend/develop-eggs/
+backend/dist/
+backend/downloads/
+backend/eggs/
+backend/.eggs/
+backend/lib/
+backend/lib64/
+backend/parts/
+backend/sdist/
+backend/var/
+backend/wheels/
+backend/share/python-wheels/
+backend/*.egg-info/
+backend/.installed.cfg
+backend/*.egg

README.md

@@ -1 +1,99 @@
-# SkillForge
+# SkillForge AI
+
+> **From resume claims to real capability.**
+
+A next-generation AI agent that takes a Job Description and a candidate's resume, conversationally assesses real proficiency on each required skill, identifies gaps, and generates a personalised learning plan focused on adjacent skills the candidate can realistically acquire — with curated resources and time estimates.
+
+No simple keyword matching. No generic RAG. Pure **Knowledge Graph traversal** + **multi-agent real-time conversation**.
+
+---
+
+## ⚡ Architecture & Tech Stack
+
+SkillForge AI is built as a full-stack monorepo featuring a powerful Python/AI backend and a blazing fast Next.js frontend.
+
+### Backend (AI & Logic)
+- **Framework:** FastAPI
+- **Agent Orchestration:** LangGraph (Multi-agent state machines)
+- **LLM Engine:** LangChain + Groq (`llama-3.3-70b-versatile`) for lightning-fast inference
+- **Knowledge Graph:** NetworkX (Directed graphs with custom edge weights)
+- **PDF Processing:** `pdfplumber` for clean JD/Resume extraction
+
+### Frontend (User Interface)
+- **Framework:** Next.js 14 (App Router)
+- **Styling:** Tailwind CSS + Custom Industrial Dark Theme
+- **State Management:** Zustand
+- **Streaming:** Server-Sent Events (SSE) via native Web API `EventSource`
+
+---
+
+## 🧠 How it Works
+
+1. **Extraction (`extractor.py`):** An LLM extracts structured capabilities from the candidate's resume and the target job description.
+2. **Gap Analysis (`claim_vs_reality.py`):** Cross-references resume claims against job requirements to flag high-priority gaps.
+3. **Conversational Assessment (`interviewer.py` & `scorer.py`):** The agent engages the candidate in a dynamic, progressive Q&A to verify actual competency rather than just stated experience.
+4. **Targeted Challenges (`challenger.py`):** For intermediate/senior skills, the agent generates grounded "find-the-bug" style micro-challenges.
+5. **Roadmap Generation (`roadmap_generator.py`):** The Knowledge Graph engine (`graph_engine.py`) calculates the shortest learning path from what the candidate *already knows* to what they *need to know*, packaging it into a multi-tiered weekly syllabus.
+
+---
+
+## 🚀 Running Locally
+
+### 1. Start the FastAPI Backend
+You will need a [Groq API Key](https://console.groq.com/keys) to run the LLM models.
+
+```bash
+cd backend
+python -m venv venv
+
+# Windows
+.\venv\Scripts\Activate.ps1
+# Mac/Linux
+source venv/bin/activate
+
+pip install -r requirements.txt
+
+# Set up your environment variables
+cp .env.example .env
+# Edit .env and add your GROQ_API_KEY
+
+uvicorn main:app --reload --port 8000
+```
+*The backend API will be running at `http://localhost:8000`*
+
+### 2. Start the Next.js Frontend
+In a new terminal window:
+
+```bash
+cd frontend
+npm install
+
+# Ensure your local environment is pointing to the backend
+cp .env.local.example .env.local
+
+npm run dev
+```
+*The frontend will be running at `http://localhost:3000`*
+
+---
+
+## 📂 Repository Structure
+
+```text
+skillforge-ai/
+├── backend/                  # Python FastAPI Backend
+│   ├── agents/               # LangChain/Groq agent definitions
+│   ├── data/                 # Sample JDs and Resumes
+│   ├── graph_pipeline/       # LangGraph state machine & nodes
+│   ├── knowledge_graph/      # NetworkX implementation & static graph JSON
+│   ├── models/               # Pydantic data schemas
+│   ├── output/               # Roadmap synthesis logic
+│   ├── routers/              # FastAPI endpoints (Upload, Assess, Roadmap)
+│   └── scoring/              # Algorithmic mismatch and gap scoring
+│
+└── frontend/                 # Next.js 14 Frontend
+    ├── app/                  # Next.js App Router pages
+    ├── components/           # React components (Upload, Assessment, Results)
+    ├── hooks/                # Custom React hooks (e.g. SSE streaming)
+    └── lib/                  # API clients, Zustand store, and TS Types
+```

backend/agents/challenger.py

@@ -0,0 +1,59 @@
+from langchain_groq import ChatGroq
+from langchain_core.messages import SystemMessage, HumanMessage
+import json, os
+
+GROQ_MODEL = "llama-3.3-70b-versatile"
+
+CHALLENGER_SYSTEM = """You are generating a technical debugging challenge.
+The challenge must:
+1. Be directly relevant to the target skill
+2. Contain exactly ONE bug or design flaw
+3. Be solvable in 3–5 minutes by someone with genuine intermediate knowledge
+4. Include a brief context sentence before the code/scenario
+5. Use markdown with a fenced code block if code is involved
+
+Return ONLY valid JSON (no markdown fences):
+{
+  "challenge_type": "find_the_bug",
+  "skill_id": "docker",
+  "context": "Your teammate pushed this Dockerfile. The container starts but immediately exits.",
+  "task": "```dockerfile\\nFROM python:3.11\\nWORKDIR /app\\nCOPY . .\\nRUN pip install -r requirements.txt\\nCMD uvicorn main:app --host 0.0.0.0 --port 8000\\n```",
+  "expected_answer": "CMD uses shell form — uvicorn won't receive SIGTERM. Fix: CMD [\\"uvicorn\\", \\"main:app\\", \\"--host\\", \\"0.0.0.0\\", \\"--port\\", \\"8000\\"]",
+  "difficulty": "intermediate"
+}"""
+
+def get_llm() -> ChatGroq:
+    return ChatGroq(
+        model=GROQ_MODEL,
+        api_key=os.getenv("GROQ_API_KEY", "dummy"),
+        temperature=0.3,
+    )
+
+def generate_challenge(
+    skill_id: str,
+    graph_path: list[str],
+    resume_context: str,
+) -> dict:
+    llm = get_llm()
+    prompt = f"Skill: {skill_id}\nGraph Path: {graph_path}\nResume context: {resume_context}"
+    messages = [
+        SystemMessage(content=CHALLENGER_SYSTEM),
+        HumanMessage(content=prompt)
+    ]
+    response = llm.invoke(messages)
+    try:
+        content = response.content.strip()
+        if content.startswith("```json"):
+            content = content[7:]
+        if content.endswith("```"):
+            content = content[:-3]
+        return json.loads(content)
+    except Exception:
+        return {
+            "challenge_type": "find_the_bug",
+            "skill_id": skill_id,
+            "context": "Explain a common bug in this context.",
+            "task": "No task generated",
+            "expected_answer": "Any reasonable explanation",
+            "difficulty": "intermediate"
+        }

backend/agents/extractor.py

@@ -0,0 +1,76 @@
+from langchain_groq import ChatGroq
+from langchain_core.messages import SystemMessage, HumanMessage
+import json, os
+from models.schemas import ExtractionResult
+
+GROQ_MODEL = "llama-3.3-70b-versatile"
+
+EXTRACTION_SYSTEM = """You are a skill extraction engine for a technical interview platform.
+Extract structured information from a job description and a candidate resume.
+
+Return ONLY valid JSON matching this exact schema — no markdown fences, no explanation:
+{
+  "jd_skills": [
+    {
+      "skill_id": "python",
+      "label": "Python",
+      "priority": "high",
+      "years_required": 3,
+      "context": "3+ years Python required"
+    }
+  ],
+  "resume_skills": [
+    {
+      "skill_id": "python",
+      "label": "Python",
+      "evidence_strength": 0.7,
+      "years_mentioned": 2,
+      "context": "2 years Python scripting"
+    }
+  ],
+  "seniority_level": "mid",
+  "domain": "backend"
+}
+
+skill_id rules: lowercase, underscores, no spaces. "GitHub Actions" → "github_actions"
+evidence_strength rubric:
+  0.0 = not mentioned
+  0.4 = mentioned in passing
+  0.7 = mentioned with project/years
+  1.0 = specific metrics or production outcomes
+priority: "high" if required/must-have, "medium" if preferred, "low" if nice-to-have
+domain: one of backend | data_engineering | ml | devops"""
+
+def get_llm() -> ChatGroq:
+    return ChatGroq(
+        model=GROQ_MODEL,
+        api_key=os.getenv("GROQ_API_KEY", "dummy"),
+        temperature=0.1,
+    )
+
+def extract_skills(jd_text: str, resume_text: str) -> ExtractionResult:
+    llm = get_llm()
+    messages = [
+        SystemMessage(content=EXTRACTION_SYSTEM),
+        HumanMessage(content=f"JD: {jd_text}\n\nResume: {resume_text}")
+    ]
+    response = llm.invoke(messages)
+    try:
+        content = response.content.strip()
+        if content.startswith("```json"):
+            content = content[7:]
+        if content.endswith("```"):
+            content = content[:-3]
+        data = json.loads(content)
+        return ExtractionResult.model_validate(data)
+    except Exception:
+        return ExtractionResult(
+            jd_skills=[],
+            resume_skills=[],
+            seniority_level="junior",
+            domain="backend"
+        )
+
+def normalize_skill_id(label: str) -> str:
+    import re
+    return re.sub(r"[^a-z0-9]+", "_", label.lower()).strip("_")

backend/agents/interviewer.py

@@ -0,0 +1,55 @@
+from langchain_groq import ChatGroq
+from langchain_core.messages import SystemMessage, HumanMessage
+import os
+
+GROQ_MODEL = "llama-3.3-70b-versatile"
+
+INTERVIEWER_SYSTEM = """You are a senior technical interviewer.
+Generate ONE question for the given skill and difficulty level.
+
+Rules:
+- If difficulty is 'conceptual' or 'scenario', MUST generate a Multiple Choice Question (with A, B, C, D options).
+- If difficulty is 'applied' or 'debugging', MUST generate an open-ended descriptive question (NO options).
+- For MCQs, clearly list the options but DO NOT include the correct answer in your output.
+- Reference the candidate's resume context if available
+- Return ONLY the question text (and choices if MCQ) — no numbering, no preamble, and NO answer keys."""
+
+difficulty_ladder = {
+    1: "conceptual",
+    2: "applied",
+    3: "scenario",
+}
+
+def get_llm() -> ChatGroq:
+    return ChatGroq(
+        model=GROQ_MODEL,
+        api_key=os.getenv("GROQ_API_KEY", "dummy"),
+        temperature=0.7,
+    )
+
+def get_difficulty(question_number: int, current_score: float) -> str:
+    if question_number == 1:
+        return "conceptual"
+    if question_number == 2:
+        return "applied" if current_score > 0.5 else "conceptual"
+    if question_number >= 3:
+        return "scenario" if current_score > 0.6 else "applied"
+    return "conceptual"
+
+def generate_question(
+    skill_label: str,
+    resume_context: str,
+    jd_requirement_level: str,
+    current_score: float,
+    question_number: int,
+    previous_questions: list[str],
+) -> str:
+    difficulty = get_difficulty(question_number, current_score)
+    llm = get_llm()
+    prompt = f"Skill: {skill_label}\nDifficulty: {difficulty}\nResume Context: {resume_context}\nPrevious Questions: {previous_questions}"
+    messages = [
+        SystemMessage(content=INTERVIEWER_SYSTEM),
+        HumanMessage(content=prompt)
+    ]
+    response = llm.invoke(messages)
+    return response.content.strip()

backend/agents/scorer.py

@@ -0,0 +1,62 @@
+from langchain_groq import ChatGroq
+from langchain_core.messages import SystemMessage, HumanMessage
+import json, os
+
+GROQ_MODEL = "llama-3.3-70b-versatile"
+
+SCORER_SYSTEM = """You are a silent technical interview rubric evaluator.
+Score the candidate answer on a 0.0–1.0 scale.
+
+Rubric:
+0.0–0.2 = No knowledge. Vague or wrong.
+0.3–0.4 = Surface awareness only. No applied depth.
+0.5–0.6 = Working knowledge. Correct but generic.
+0.7–0.8 = Applied knowledge. Specific examples or tradeoffs.
+0.9–1.0 = Expert. Edge cases, alternatives, nuanced reasoning.
+
+Note: If the question was a Multiple Choice Question (MCQ), evaluate if their chosen option is correct. Give 0.8–1.0 for the correct choice (1.0 if they also briefly explain why), and 0.0 for an incorrect choice.
+
+Return ONLY valid JSON (no markdown):
+{
+  "score": 0.72,
+  "signal": "move_on",
+  "reasoning": "Candidate described specific tradeoffs in FastAPI dependency injection."
+}
+
+signal rules:
+  "probe_deeper"   → (score < 0.5 OR questions_asked == 1) AND questions_asked < 3
+  "fire_challenge" → score < 0.5 AND questions_asked >= 2
+  "move_on"        → (score >= 0.5 AND questions_asked >= 2) OR questions_asked >= 3"""
+
+def get_llm() -> ChatGroq:
+    return ChatGroq(
+        model=GROQ_MODEL,
+        api_key=os.getenv("GROQ_API_KEY", "dummy"),
+        temperature=0.0,
+    )
+
+def score_answer(
+    skill: str,
+    question: str,
+    answer: str,
+    questions_asked: int,
+) -> dict:
+    llm = get_llm()
+    prompt = f"Skill: {skill}\nQuestion: {question}\nAnswer: {answer}\nQuestions asked: {questions_asked}"
+    messages = [
+        SystemMessage(content=SCORER_SYSTEM),
+        HumanMessage(content=prompt)
+    ]
+    response = llm.invoke(messages)
+    try:
+        content = response.content.strip()
+        if content.startswith("```json"):
+            content = content[7:]
+        if content.endswith("```"):
+            content = content[:-3]
+        return json.loads(content)
+    except Exception:
+        return {"score": 0.0, "signal": "move_on", "reasoning": "Failed to parse response."}
+
+def compute_final_score(resume_evidence: float, conversation_score: float) -> float:
+    return round(0.35 * resume_evidence + 0.65 * conversation_score, 3)

backend/data/sample_jd_resume.json

@@ -0,0 +1,4 @@
+{
+  "jd": "Mid-Level Data Engineer. Requirements: 3-5 years of experience in data engineering. Strong SQL skills. Experience with Snowflake and dbt for data transformations. Proficiency in Python for scripting and automation. Familiarity with Airflow for orchestrating data pipelines. Bachelor's degree in Computer Science or related field.",
+  "resume": "Junior Data Engineer passionate about data. I have 1 year of experience working with Python and SQL to build basic reports. I've taken a few courses on Pandas and have touched Airflow in a personal project. Looking for an opportunity to grow."
+}

backend/graph_pipeline/edges.py

@@ -0,0 +1,28 @@
+from graph_pipeline.state import AssessmentState
+
+def route_after_scorer(state: AssessmentState) -> str:
+    records = state.get("question_records", [])
+    if not records:
+        return "output_node"
+        
+    last_record = records[-1]
+    signal = last_record.signal
+    
+    if signal == "probe_deeper":
+        return "interviewer_node"
+    elif signal == "fire_challenge":
+        return "challenger_node"
+    else:
+        idx = state.get("current_skill_index", 0)
+        gap_skills = state.get("gap_skill_ids", [])
+        if idx < len(gap_skills):
+            return "interviewer_node"
+        else:
+            return "output_node"
+
+def route_after_challenger(state: AssessmentState) -> str:
+    idx = state.get("current_skill_index", 0)
+    gap_skills = state.get("gap_skill_ids", [])
+    if idx < len(gap_skills):
+        return "interviewer_node"
+    return "output_node"

backend/graph_pipeline/nodes.py

@@ -0,0 +1,176 @@
+from graph_pipeline.state import AssessmentState
+from agents.extractor import extract_skills
+from agents.interviewer import generate_question, get_difficulty
+from agents.scorer import score_answer, compute_final_score
+from agents.challenger import generate_challenge
+from scoring.claim_vs_reality import detect_mismatch
+from scoring.gap_classifier import classify_gap
+from output.roadmap_generator import generate_roadmap
+from knowledge_graph.graph_engine import get_engine
+from models.schemas import QuestionRecord, SkillScore, ChallengeTask
+
+def extract_node(state: AssessmentState) -> dict:
+    jd_text = state["jd_text"]
+    resume_text = state["resume_text"]
+    extraction = extract_skills(jd_text, resume_text)
+    
+    gap_skill_ids = []
+    resume_skills_dict = {s.skill_id: s for s in extraction.resume_skills}
+    
+    for jd_skill in extraction.jd_skills:
+        rs = resume_skills_dict.get(jd_skill.skill_id)
+        if not rs or rs.evidence_strength < 0.6:
+            gap_skill_ids.append(jd_skill.skill_id)
+            
+    engine = get_engine()
+    graph_paths = {}
+    known_skills = [s.skill_id for s in extraction.resume_skills if s.evidence_strength >= 0.6]
+    if not known_skills:
+        known_skills = ["python"] # fallback
+    
+    for gap_skill in gap_skill_ids:
+        path = engine.find_shortest_path(known_skills, gap_skill)
+        if path:
+            graph_paths[gap_skill] = path
+        else:
+            graph_paths[gap_skill] = [gap_skill]
+
+    return {
+        "extraction": extraction,
+        "gap_skill_ids": gap_skill_ids,
+        "graph_paths": graph_paths,
+        "stream_events": [{"event": "extraction_complete", "data": extraction.model_dump()}]
+    }
+
+def interviewer_node(state: AssessmentState) -> dict:
+    idx = state.get("current_skill_index", 0)
+    gap_skills = state.get("gap_skill_ids", [])
+    if idx >= len(gap_skills):
+        return {}
+        
+    skill_id = gap_skills[idx]
+    extraction = state["extraction"]
+    
+    jd_skill = next((s for s in extraction.jd_skills if s.skill_id == skill_id), None)
+    rs_skill = next((s for s in extraction.resume_skills if s.skill_id == skill_id), None)
+    
+    resume_context = rs_skill.context if rs_skill else "No resume context"
+    jd_req_level = jd_skill.priority if jd_skill else "medium"
+    
+    questions_asked = state.get("questions_asked", 0)
+    current_score = state.get("conversation_scores", {}).get(skill_id, 0.5)
+    
+    previous_questions = [q.question for q in state.get("question_records", []) if q.skill_id == skill_id]
+    
+    skill_label = jd_skill.label if jd_skill else skill_id
+    question = generate_question(skill_label, resume_context, jd_req_level, current_score, questions_asked + 1, previous_questions)
+    
+    qr = QuestionRecord(skill_id=skill_id, question=question, answer="", score=0.0, signal="move_on")
+    
+    return {
+        "stream_events": [{"event": "question", "skill_id": skill_id, "content": question}],
+        "questions_asked": questions_asked + 1,
+        "question_records": [qr]
+    }
+
+def scorer_node(state: AssessmentState) -> dict:
+    records = state.get("question_records", [])
+    if not records:
+        return {}
+    
+    last_record = records[-1]
+    pending_answer = state.get("pending_answer", "")
+    questions_asked = state.get("questions_asked", 0)
+    
+    score_result = score_answer(last_record.skill_id, last_record.question, pending_answer, questions_asked)
+    
+    # Python lists are mutable, we just mutate the record in place
+    last_record.answer = pending_answer
+    last_record.score = score_result.get("score", 0.0)
+    last_record.signal = score_result.get("signal", "move_on")
+    
+    conversation_scores = state.get("conversation_scores", {})
+    skill_id = last_record.skill_id
+    
+    skill_records = [r for r in records if r.skill_id == skill_id and r.answer]
+    avg_score = sum(r.score for r in skill_records) / len(skill_records) if skill_records else 0.0
+    
+    conversation_scores[skill_id] = avg_score
+    
+    update = {
+        "conversation_scores": conversation_scores,
+        "pending_answer": None,
+        "stream_events": []
+    }
+    
+    if last_record.signal == "move_on":
+        idx = state.get("current_skill_index", 0)
+        update["current_skill_index"] = idx + 1
+        update["questions_asked"] = 0
+        
+    return update
+
+def challenger_node(state: AssessmentState) -> dict:
+    idx = state.get("current_skill_index", 0)
+    gap_skills = state.get("gap_skill_ids", [])
+    if idx >= len(gap_skills):
+        return {}
+    skill_id = gap_skills[idx]
+    
+    graph_path = state.get("graph_paths", {}).get(skill_id, [])
+    extraction = state["extraction"]
+    rs_skill = next((s for s in extraction.resume_skills if s.skill_id == skill_id), None)
+    resume_context = rs_skill.context if rs_skill else "No resume context"
+    
+    challenge = generate_challenge(skill_id, graph_path, resume_context)
+    ct = ChallengeTask(**challenge)
+    
+    markdown_task = challenge.get("task", "")
+    
+    return {
+        "challenge_task": ct,
+        "stream_events": [{"event": "challenge", "skill_id": skill_id, "content": markdown_task}],
+        "current_skill_index": idx + 1,
+        "questions_asked": 0
+    }
+
+def output_node(state: AssessmentState) -> dict:
+    extraction = state["extraction"]
+    conversation_scores = state.get("conversation_scores", {})
+    
+    resume_skills_dict = {s.skill_id: s for s in extraction.resume_skills}
+    skill_scores = []
+    
+    for jd_skill in extraction.jd_skills:
+        skill_id = jd_skill.skill_id
+        rs = resume_skills_dict.get(skill_id)
+        resume_evidence = rs.evidence_strength if rs else 0.0
+        
+        conv_score = conversation_scores.get(skill_id, resume_evidence)
+        final_score = compute_final_score(resume_evidence, conv_score)
+        
+        mismatch_data = detect_mismatch(skill_id, resume_evidence, conv_score)
+        gap_level = classify_gap(final_score)
+        
+        skill_scores.append(SkillScore(
+            skill_id=skill_id,
+            label=jd_skill.label,
+            resume_evidence=resume_evidence,
+            conversation_score=conv_score,
+            final_score=final_score,
+            gap_level=gap_level,
+            mismatch=mismatch_data["mismatch"],
+            mismatch_severity=mismatch_data["severity"]
+        ))
+        
+    graph_paths = state.get("graph_paths", {})
+    hours_per_day = state.get("hours_per_day", 2.0)
+    
+    roadmap = generate_roadmap(skill_scores, graph_paths, hours_per_day)
+    
+    return {
+        "skill_scores": skill_scores,
+        "roadmap": roadmap,
+        "assessment_complete": True,
+        "stream_events": [{"event": "assessment_complete", "data": {"status": "done"}}]
+    }

backend/graph_pipeline/pipeline.py

@@ -0,0 +1,50 @@
+from langgraph.graph import StateGraph, END
+from langgraph.checkpoint.memory import MemorySaver
+from graph_pipeline.state import AssessmentState
+from graph_pipeline.nodes import (
+    extract_node, interviewer_node, scorer_node,
+    challenger_node, output_node
+)
+from graph_pipeline.edges import route_after_scorer, route_after_challenger
+
+def build_pipeline():
+    builder = StateGraph(AssessmentState)
+    
+    builder.add_node("extract_node", extract_node)
+    builder.add_node("interviewer_node", interviewer_node)
+    builder.add_node("scorer_node", scorer_node)
+    builder.add_node("challenger_node", challenger_node)
+    builder.add_node("output_node", output_node)
+    
+    builder.add_edge("extract_node", "interviewer_node")
+    builder.add_edge("interviewer_node", "scorer_node")
+    
+    builder.add_conditional_edges(
+        "scorer_node",
+        route_after_scorer,
+        {
+            "interviewer_node": "interviewer_node",
+            "challenger_node": "challenger_node",
+            "output_node": "output_node"
+        }
+    )
+    
+    builder.add_conditional_edges(
+        "challenger_node",
+        route_after_challenger,
+        {
+            "interviewer_node": "interviewer_node",
+            "output_node": "output_node"
+        }
+    )
+    
+    builder.add_edge("output_node", END)
+    builder.set_entry_point("extract_node")
+    
+    memory = MemorySaver()
+    return builder.compile(
+        checkpointer=memory,
+        interrupt_before=["scorer_node"],
+    )
+
+pipeline = build_pipeline()

backend/graph_pipeline/state.py

@@ -0,0 +1,30 @@
+from typing import TypedDict, Annotated
+import operator
+from models.schemas import (
+    ExtractionResult, QuestionRecord, ChallengeTask, SkillScore, RoadmapWeek
+)
+
+class AssessmentState(TypedDict):
+    assessment_id: str
+    jd_text: str
+    resume_text: str
+    hours_per_day: float
+
+    extraction: ExtractionResult | None
+    gap_skill_ids: list[str]
+    graph_paths: dict[str, list[str]]
+
+    current_skill_index: int
+    questions_asked: int
+    questions_per_skill: int
+
+    question_records: Annotated[list[QuestionRecord], operator.add]
+    conversation_scores: dict[str, float]
+    challenge_task: ChallengeTask | None
+    pending_answer: str | None
+
+    stream_events: Annotated[list[dict], operator.add]
+
+    skill_scores: list[SkillScore]
+    roadmap: list[RoadmapWeek]
+    assessment_complete: bool

backend/knowledge_graph/graph_engine.py

@@ -0,0 +1,120 @@
+import networkx as nx
+import json
+import re
+from pathlib import Path
+from typing import List, Dict, Optional
+
+class SkillGraphEngine:
+    def __init__(self, graph_path: str = "backend/knowledge_graph/skills_graph.json"):
+        self.graph = nx.DiGraph()
+        path = Path(graph_path)
+        if path.exists():
+            with open(path, 'r', encoding='utf-8') as f:
+                data = json.load(f)
+                for node in data.get("nodes", []):
+                    self.graph.add_node(
+                        node["id"], 
+                        label=node.get("label", node["id"]),
+                        domain=node.get("domain", "unknown"),
+                        level=node.get("level", "intermediate"),
+                        tags=node.get("tags", [])
+                    )
+                for edge in data.get("edges", []):
+                    self.graph.add_edge(
+                        edge["source"], 
+                        edge["target"], 
+                        type=edge.get("type", "PREREQUISITE"),
+                        weight=edge.get("weight", 1.0),
+                        hop_cost=edge.get("hop_cost", 1)
+                    )
+                    if edge.get("type") == "COUSIN":
+                        # Bidirectional
+                        self.graph.add_edge(
+                            edge["target"], 
+                            edge["source"], 
+                            type=edge.get("type", "COUSIN"),
+                            weight=edge.get("weight", 1.0),
+                            hop_cost=edge.get("hop_cost", 1)
+                        )
+
+    def find_shortest_path(self, source_skills: List[str], target_skill: str, max_hops: int = 4) -> Optional[List[str]]:
+        best_path = None
+        best_cost = float('inf')
+        
+        if not self.graph.has_node(target_skill):
+            return None
+
+        for source in source_skills:
+            if not self.graph.has_node(source):
+                continue
+            try:
+                path = nx.shortest_path(self.graph, source=source, target=target_skill, weight="hop_cost")
+                if len(path) - 1 <= max_hops:
+                    cost = sum(self.graph[path[i]][path[i+1]]['hop_cost'] for i in range(len(path)-1))
+                    if cost < best_cost:
+                        best_cost = cost
+                        best_path = path
+            except nx.NetworkXNoPath:
+                continue
+        return best_path
+
+    def get_adjacent(self, skill_id: str, hops: int = 2) -> List[Dict]:
+        if not self.graph.has_node(skill_id):
+            return []
+        lengths = nx.single_source_dijkstra_path_length(self.graph, skill_id, cutoff=hops, weight="hop_cost")
+        paths = nx.single_source_dijkstra_path(self.graph, skill_id, cutoff=hops, weight="hop_cost")
+        
+        results = []
+        for target, cost in lengths.items():
+            if target == skill_id:
+                continue
+            path = paths[target]
+            edge_types = [self.graph[path[i]][path[i+1]]['type'] for i in range(len(path)-1)]
+            results.append({
+                "skill": target,
+                "path": path,
+                "edge_types": edge_types,
+                "total_cost": float(cost)
+            })
+        results.sort(key=lambda x: x["total_cost"])
+        return results
+
+    def get_prerequisites(self, skill_id: str) -> List[str]:
+        if not self.graph.has_node(skill_id):
+            return []
+        return [p for p in self.graph.predecessors(skill_id) if self.graph[p][skill_id]['type'] == 'PREREQUISITE']
+
+    def get_domain(self, skill_id: str) -> str:
+        if not self.graph.has_node(skill_id):
+            return "unknown"
+        return self.graph.nodes[skill_id].get("domain", "unknown")
+
+    def path_to_steps(self, path: List[str]) -> List[Dict]:
+        steps = []
+        for i in range(len(path) - 1):
+            source = path[i]
+            target = path[i+1]
+            edge_type = self.graph[source][target]['type']
+            weeks = 1.5
+            if edge_type == 'COUSIN':
+                weeks = 0.75
+            elif edge_type == 'BRIDGES':
+                weeks = 2.5
+            steps.append({
+                "from": source,
+                "to": target,
+                "edge_type": edge_type,
+                "weeks": weeks
+            })
+        return steps
+
+    def normalize_skill_id(self, label: str) -> str:
+        return re.sub(r"[^a-z0-9]+", "_", label.lower()).strip("_")
+
+_engine = None
+
+def get_engine() -> SkillGraphEngine:
+    global _engine
+    if _engine is None:
+        _engine = SkillGraphEngine()
+    return _engine

backend/knowledge_graph/resources.json

@@ -0,0 +1,62 @@
+{
+  "fastapi": {
+    "courses": [
+      {
+        "title": "FastAPI - The Complete Course",
+        "url": "https://www.udemy.com/course/fastapi-the-complete-course/",
+        "hours": 12,
+        "type": "course"
+      }
+    ]
+  },
+  "docker": {
+    "courses": [
+      {
+        "title": "Docker Mastery: with Kubernetes +Swarm from a Docker Captain",
+        "url": "https://www.udemy.com/course/docker-mastery/",
+        "hours": 20,
+        "type": "course"
+      }
+    ]
+  },
+  "dbt": {
+    "courses": [
+      {
+        "title": "Data Engineering with dbt",
+        "url": "https://www.datacamp.com/courses/introduction-to-dbt",
+        "hours": 8,
+        "type": "course"
+      }
+    ]
+  },
+  "airflow": {
+    "courses": [
+      {
+        "title": "Apache Airflow: The Hands-On Guide",
+        "url": "https://www.udemy.com/course/the-complete-hands-on-course-to-master-apache-airflow/",
+        "hours": 10,
+        "type": "course"
+      }
+    ]
+  },
+  "pytorch": {
+    "courses": [
+      {
+        "title": "PyTorch for Deep Learning in 2024: Zero to Mastery",
+        "url": "https://www.udemy.com/course/pytorch-for-deep-learning/",
+        "hours": 25,
+        "type": "course"
+      }
+    ]
+  },
+  "kubernetes": {
+    "courses": [
+      {
+        "title": "Kubernetes for the Absolute Beginners - Hands-on",
+        "url": "https://www.udemy.com/course/learn-kubernetes/",
+        "hours": 15,
+        "type": "course"
+      }
+    ]
+  }
+}

backend/knowledge_graph/skills_graph.json

@@ -0,0 +1,517 @@
+{
+  "nodes": [
+    {
+      "id": "python",
+      "label": "Python",
+      "domain": "backend",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "fastapi",
+      "label": "Fastapi",
+      "domain": "backend",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "flask",
+      "label": "Flask",
+      "domain": "backend",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "django",
+      "label": "Django",
+      "domain": "backend",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "nodejs",
+      "label": "Nodejs",
+      "domain": "backend",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "expressjs",
+      "label": "Expressjs",
+      "domain": "backend",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "rest_api",
+      "label": "Rest Api",
+      "domain": "backend",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "graphql",
+      "label": "Graphql",
+      "domain": "backend",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "grpc",
+      "label": "Grpc",
+      "domain": "backend",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "websockets",
+      "label": "Websockets",
+      "domain": "backend",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "celery",
+      "label": "Celery",
+      "domain": "backend",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "redis",
+      "label": "Redis",
+      "domain": "backend",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "postgresql",
+      "label": "Postgresql",
+      "domain": "backend",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "mysql",
+      "label": "Mysql",
+      "domain": "backend",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "mongodb",
+      "label": "Mongodb",
+      "domain": "backend",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "docker",
+      "label": "Docker",
+      "domain": "backend",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "kubernetes",
+      "label": "Kubernetes",
+      "domain": "backend",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "github_actions",
+      "label": "Github Actions",
+      "domain": "backend",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "git",
+      "label": "Git",
+      "domain": "backend",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "linux_cli",
+      "label": "Linux Cli",
+      "domain": "backend",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "nginx",
+      "label": "Nginx",
+      "domain": "backend",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "jwt_auth",
+      "label": "Jwt Auth",
+      "domain": "backend",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "pytest",
+      "label": "Pytest",
+      "domain": "backend",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "sql",
+      "label": "Sql",
+      "domain": "data_engineering",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "dbt",
+      "label": "Dbt",
+      "domain": "data_engineering",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "airflow",
+      "label": "Airflow",
+      "domain": "data_engineering",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "prefect",
+      "label": "Prefect",
+      "domain": "data_engineering",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "spark",
+      "label": "Spark",
+      "domain": "data_engineering",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "kafka",
+      "label": "Kafka",
+      "domain": "data_engineering",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "pandas",
+      "label": "Pandas",
+      "domain": "data_engineering",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "polars",
+      "label": "Polars",
+      "domain": "data_engineering",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "numpy",
+      "label": "Numpy",
+      "domain": "data_engineering",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "pyspark",
+      "label": "Pyspark",
+      "domain": "data_engineering",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "snowflake",
+      "label": "Snowflake",
+      "domain": "data_engineering",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "bigquery",
+      "label": "Bigquery",
+      "domain": "data_engineering",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "duckdb",
+      "label": "Duckdb",
+      "domain": "data_engineering",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "great_expectations",
+      "label": "Great Expectations",
+      "domain": "data_engineering",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "dagster",
+      "label": "Dagster",
+      "domain": "data_engineering",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "data_modeling",
+      "label": "Data Modeling",
+      "domain": "data_engineering",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "etl_pipelines",
+      "label": "Etl Pipelines",
+      "domain": "data_engineering",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "scikit_learn",
+      "label": "Scikit Learn",
+      "domain": "ml",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "pytorch",
+      "label": "Pytorch",
+      "domain": "ml",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "tensorflow",
+      "label": "Tensorflow",
+      "domain": "ml",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "huggingface_transformers",
+      "label": "Huggingface Transformers",
+      "domain": "ml",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "mlflow",
+      "label": "Mlflow",
+      "domain": "ml",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "bentoml",
+      "label": "Bentoml",
+      "domain": "ml",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "onnx",
+      "label": "Onnx",
+      "domain": "ml",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "feature_engineering",
+      "label": "Feature Engineering",
+      "domain": "ml",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "model_evaluation",
+      "label": "Model Evaluation",
+      "domain": "ml",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "hyperparameter_tuning",
+      "label": "Hyperparameter Tuning",
+      "domain": "ml",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "nlp_basics",
+      "label": "Nlp Basics",
+      "domain": "ml",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "llm_prompting",
+      "label": "Llm Prompting",
+      "domain": "ml",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "langchain",
+      "label": "Langchain",
+      "domain": "ml",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "langgraph",
+      "label": "Langgraph",
+      "domain": "ml",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "vector_databases",
+      "label": "Vector Databases",
+      "domain": "ml",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "terraform",
+      "label": "Terraform",
+      "domain": "devops",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "aws_ec2",
+      "label": "Aws Ec2",
+      "domain": "devops",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "aws_s3",
+      "label": "Aws S3",
+      "domain": "devops",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "aws_lambda",
+      "label": "Aws Lambda",
+      "domain": "devops",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "aws_sagemaker",
+      "label": "Aws Sagemaker",
+      "domain": "devops",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "gcp_vertex",
+      "label": "Gcp Vertex",
+      "domain": "devops",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "azure_ml",
+      "label": "Azure Ml",
+      "domain": "devops",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "ci_cd",
+      "label": "Ci Cd",
+      "domain": "devops",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "prometheus",
+      "label": "Prometheus",
+      "domain": "devops",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "grafana",
+      "label": "Grafana",
+      "domain": "devops",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "helm",
+      "label": "Helm",
+      "domain": "devops",
+      "level": "intermediate",
+      "tags": []
+    },
+    {
+      "id": "ansible",
+      "label": "Ansible",
+      "domain": "devops",
+      "level": "intermediate",
+      "tags": []
+    }
+  ],
+  "edges": [
+    {
+      "source": "python",
+      "target": "fastapi",
+      "type": "PREREQUISITE",
+      "weight": 0.8,
+      "hop_cost": 1
+    },
+    {
+      "source": "python",
+      "target": "pandas",
+      "type": "PREREQUISITE",
+      "weight": 0.8,
+      "hop_cost": 1
+    },
+    {
+      "source": "pandas",
+      "target": "polars",
+      "type": "COUSIN",
+      "weight": 0.9,
+      "hop_cost": 1
+    },
+    {
+      "source": "fastapi",
+      "target": "docker",
+      "type": "BRIDGES",
+      "weight": 0.5,
+      "hop_cost": 2
+    },
+    {
+      "source": "git",
+      "target": "github_actions",
+      "type": "PREREQUISITE",
+      "weight": 0.8,
+      "hop_cost": 1
+    },
+    {
+      "source": "sql",
+      "target": "dbt",
+      "type": "PREREQUISITE",
+      "weight": 0.8,
+      "hop_cost": 1
+    }
+  ]
+}

backend/main.py

@@ -0,0 +1,27 @@
+from fastapi import FastAPI
+from fastapi.middleware.cors import CORSMiddleware
+from routers import assessment, upload, roadmap
+from dotenv import load_dotenv
+
+import os
+os.environ["LANGGRAPH_STRICT_MSGPACK"] = "false"
+
+load_dotenv()
+
+app = FastAPI(title="SkillForge AI", version="1.0.0")
+
+app.add_middleware(
+    CORSMiddleware,
+    allow_origins=["http://localhost:3000"],
+    allow_credentials=True,
+    allow_methods=["*"],
+    allow_headers=["*"],
+)
+
+app.include_router(upload.router)
+app.include_router(assessment.router)
+app.include_router(roadmap.router)
+
+@app.get("/health")
+async def health():
+    return {"status": "ok"}

backend/models/schemas.py

@@ -0,0 +1,91 @@
+from pydantic import BaseModel, Field
+from typing import Literal
+
+class JDSkill(BaseModel):
+    skill_id: str
+    label: str
+    priority: Literal["high", "medium", "low"]
+    years_required: int | None
+    context: str
+
+class ResumeSkill(BaseModel):
+    skill_id: str
+    label: str
+    evidence_strength: float = Field(ge=0.0, le=1.0)
+    years_mentioned: int | None
+    context: str
+
+class ExtractionResult(BaseModel):
+    jd_skills: list[JDSkill]
+    resume_skills: list[ResumeSkill]
+    seniority_level: Literal["junior", "mid", "senior", "lead"]
+    domain: Literal["backend", "data_engineering", "ml", "devops"]
+
+class QuestionRecord(BaseModel):
+    skill_id: str
+    question: str
+    answer: str
+    score: float
+    signal: Literal["probe_deeper", "fire_challenge", "move_on"]
+
+class ChallengeTask(BaseModel):
+    challenge_type: Literal["find_the_bug", "design_flaw", "sql_query"]
+    skill_id: str
+    context: str
+    task: str
+    expected_answer: str
+    difficulty: Literal["junior", "intermediate", "senior"]
+
+class SkillScore(BaseModel):
+    skill_id: str
+    label: str
+    resume_evidence: float
+    conversation_score: float
+    final_score: float
+    gap_level: Literal["high_gap", "medium_gap", "ready"]
+    mismatch: bool
+    mismatch_severity: Literal["none", "mild", "significant"]
+
+class RoadmapWeek(BaseModel):
+    week: int
+    skill_id: str
+    label: str
+    tier: Literal[1, 2, 3]
+    resources: list[dict]
+    mini_project: str
+    graph_path: list[str]
+    why: str
+
+class AssessmentResult(BaseModel):
+    assessment_id: str
+    extraction: ExtractionResult
+    skill_scores: list[SkillScore]
+    roadmap: list[RoadmapWeek]
+    time_to_ready_weeks: float
+    domain: str
+
+class UploadResponse(BaseModel):
+    text: str
+    filename: str
+
+class StartAssessmentRequest(BaseModel):
+    jd_text: str
+    resume_text: str
+    hours_per_day: float = 2.0
+    assessment_id: str | None = None
+
+class StartAssessmentResponse(BaseModel):
+    assessment_id: str
+    extraction: ExtractionResult
+    message: str
+
+class StreamEvent(BaseModel):
+    event: Literal[
+        "question", "challenge", "skill_complete",
+        "assessment_complete", "error", "extraction_complete"
+    ]
+    skill_id: str | None = None
+    skill_label: str | None = None
+    content: str | None = None
+    progress: float | None = None
+    data: dict | None = None

backend/output/roadmap_generator.py

@@ -0,0 +1,89 @@
+import json
+from pathlib import Path
+from models.schemas import RoadmapWeek, SkillScore
+from knowledge_graph.graph_engine import get_engine
+
+def generate_roadmap(
+    skill_scores: list[SkillScore],
+    graph_paths: dict[str, list[str]],
+    hours_per_day: float = 2.0,
+) -> list[RoadmapWeek]:
+    engine = get_engine()
+    resources_path = Path("backend/knowledge_graph/resources.json")
+    if resources_path.exists():
+        with open(resources_path, "r", encoding="utf-8") as f:
+            resources_db = json.load(f)
+    else:
+        resources_db = {}
+        
+    roadmap = []
+    base_hours_per_week = hours_per_day * 5
+    week_counter = 1
+    
+    # Sort skills: high_gap first, then medium_gap
+    gap_skills = [s for s in skill_scores if s.gap_level in ("high_gap", "medium_gap")]
+    gap_skills.sort(key=lambda s: 0 if s.gap_level == "high_gap" else 1)
+    
+    for skill in gap_skills:
+        skill_id = skill.skill_id
+        path = graph_paths.get(skill_id, [])
+        path_str = " → ".join(path)
+        
+        resources = []
+        if skill_id in resources_db:
+            resources = resources_db[skill_id].get("courses", [])
+            
+        why_msg = "Direct learning path"
+        if len(path) > 1:
+            source = path[0]
+            target = path[-1]
+            hops = len(path) - 1
+            has_edges = True if engine.graph.has_node(source) and engine.graph.has_node(target) else False
+            if has_edges:
+                edge_type = "path"
+                try:
+                    if hops == 1:
+                        edge_type = engine.graph[source][target]["type"]
+                except:
+                    pass
+                why_msg = f"You already know {source} → {target} is {edge_type} ({hops} hop)"
+            else:
+                why_msg = f"Building up from {source} to {target}"
+                
+        roadmap.append(RoadmapWeek(
+            week=week_counter,
+            skill_id=skill_id,
+            label=skill.label,
+            tier=1,
+            resources=resources,
+            mini_project=f"Build a basic script using {skill.label} core features",
+            graph_path=path,
+            why=why_msg
+        ))
+        week_counter += 1
+        
+        roadmap.append(RoadmapWeek(
+            week=week_counter,
+            skill_id=skill_id,
+            label=skill.label,
+            tier=2,
+            resources=[],
+            mini_project=f"Integrate {skill.label} into a broader project",
+            graph_path=path,
+            why=why_msg
+        ))
+        week_counter += 1
+        
+        roadmap.append(RoadmapWeek(
+            week=week_counter,
+            skill_id=skill_id,
+            label=skill.label,
+            tier=3,
+            resources=[],
+            mini_project=f"Solve a role-specific scenario with {skill.label}",
+            graph_path=path,
+            why=why_msg
+        ))
+        week_counter += 1
+
+    return roadmap

backend/requirements.txt

@@ -0,0 +1,12 @@
+fastapi>=0.111.0
+uvicorn[standard]>=0.30.0
+langgraph>=0.1.0
+langchain-groq>=0.1.0
+langchain-core>=0.2.0
+networkx>=3.3
+pdfplumber>=0.11.0
+python-dotenv>=1.0.0
+python-multipart>=0.0.9
+pydantic>=2.7.0
+pytest>=8.0.0
+httpx>=0.27.0

backend/routers/assessment.py

@@ -0,0 +1,99 @@
+from fastapi import APIRouter, HTTPException
+from fastapi.responses import StreamingResponse
+from models.schemas import (
+    StartAssessmentRequest, StartAssessmentResponse, StreamEvent
+)
+from graph_pipeline.pipeline import pipeline
+from graph_pipeline.state import AssessmentState
+import uuid, json, asyncio
+from typing import Dict
+
+router = APIRouter(prefix="/assess", tags=["assessment"])
+
+active_assessments: Dict[str, dict] = {}
+
+@router.post("/", response_model=StartAssessmentResponse)
+async def start_assessment(body: StartAssessmentRequest):
+    assessment_id = body.assessment_id if body.assessment_id else str(uuid.uuid4())
+    
+    config = {"configurable": {"thread_id": assessment_id}}
+    active_assessments[assessment_id] = config
+    
+    state = AssessmentState(
+        assessment_id=assessment_id,
+        jd_text=body.jd_text,
+        resume_text=body.resume_text,
+        hours_per_day=body.hours_per_day,
+        extraction=None,
+        gap_skill_ids=[],
+        graph_paths={},
+        current_skill_index=0,
+        questions_asked=0,
+        questions_per_skill=3,
+        question_records=[],
+        conversation_scores={},
+        challenge_task=None,
+        pending_answer=None,
+        stream_events=[],
+        skill_scores=[],
+        roadmap=[],
+        assessment_complete=False
+    )
+    
+    pipeline.invoke(state, config)
+    
+    current_state = pipeline.get_state(config)
+    st = current_state.values
+    
+    extraction = st.get("extraction")
+    
+    return StartAssessmentResponse(
+        assessment_id=assessment_id,
+        extraction=extraction,
+        message="Assessment started"
+    )
+
+@router.post("/{assessment_id}/answer")
+async def submit_answer(assessment_id: str, answer: str):
+    if assessment_id not in active_assessments:
+        raise HTTPException(status_code=404, detail="Assessment not found")
+        
+    config = active_assessments[assessment_id]
+    
+    pipeline.update_state(config, {"pending_answer": answer})
+    pipeline.invoke(None, config)
+    
+    return {"status": "ok"}
+
+@router.get("/{assessment_id}/stream")
+async def stream_events(assessment_id: str):
+    if assessment_id not in active_assessments:
+        raise HTTPException(status_code=404, detail="Assessment not found")
+        
+    config = active_assessments[assessment_id]
+    
+    async def event_generator():
+        last_event_idx = 0
+        while True:
+            current_state = pipeline.get_state(config)
+            st = current_state.values
+            if not st:
+                await asyncio.sleep(0.2)
+                continue
+                
+            events = st.get("stream_events", [])
+            while last_event_idx < len(events):
+                event = events[last_event_idx]
+                yield f"data: {json.dumps(event)}\n\n"
+                last_event_idx += 1
+                
+            if st.get("assessment_complete"):
+                break
+                
+            await asyncio.sleep(0.2)
+            
+    return StreamingResponse(
+        event_generator(),
+        media_type="text/event-stream",
+        headers={"Cache-Control": "no-cache", "X-Accel-Buffering": "no"}
+    )

backend/routers/roadmap.py

@@ -0,0 +1,34 @@
+from fastapi import APIRouter, HTTPException
+from models.schemas import AssessmentResult
+from graph_pipeline.pipeline import pipeline
+from routers.assessment import active_assessments
+from output.roadmap_generator import generate_roadmap
+
+router = APIRouter(prefix="/roadmap", tags=["roadmap"])
+
+@router.get("/{assessment_id}", response_model=AssessmentResult)
+async def get_roadmap(assessment_id: str, hours_per_day: float = 2.0):
+    if assessment_id not in active_assessments:
+        raise HTTPException(status_code=404, detail="Assessment not found")
+        
+    config = active_assessments[assessment_id]
+    current_state = pipeline.get_state(config)
+    st = current_state.values
+    
+    if not st.get("assessment_complete"):
+        raise HTTPException(status_code=400, detail="Assessment not complete")
+        
+    roadmap = generate_roadmap(
+        st.get("skill_scores", []),
+        st.get("graph_paths", {}),
+        hours_per_day
+    )
+    
+    return AssessmentResult(
+        assessment_id=assessment_id,
+        extraction=st["extraction"],
+        skill_scores=st.get("skill_scores", []),
+        roadmap=roadmap,
+        time_to_ready_weeks=len(roadmap),
+        domain=st["extraction"].domain
+    )

backend/routers/upload.py

@@ -0,0 +1,24 @@
+from fastapi import APIRouter, UploadFile, File, HTTPException
+from models.schemas import UploadResponse
+import pdfplumber, io
+
+router = APIRouter(prefix="/upload", tags=["upload"])
+
+def extract_text_from_upload(file: UploadFile) -> str:
+    content = file.file.read()
+    if file.filename.endswith(".pdf"):
+        with pdfplumber.open(io.BytesIO(content)) as pdf:
+            text = "\n".join([page.extract_text() for page in pdf.pages if page.extract_text()])
+            return text
+    else:
+        return content.decode("utf-8", errors="ignore")
+
+@router.post("/jd", response_model=UploadResponse)
+async def upload_jd(file: UploadFile = File(...)):
+    text = extract_text_from_upload(file)
+    return UploadResponse(text=text, filename=file.filename)
+
+@router.post("/resume", response_model=UploadResponse)
+async def upload_resume(file: UploadFile = File(...)):
+    text = extract_text_from_upload(file)
+    return UploadResponse(text=text, filename=file.filename)

backend/scoring/claim_vs_reality.py

@@ -0,0 +1,26 @@
+def detect_mismatch(
+    skill_id: str,
+    resume_evidence: float,
+    conversation_score: float,
+    threshold: float = 0.3,
+) -> dict:
+    delta = resume_evidence - conversation_score
+    mismatch = delta > threshold
+    
+    if delta < 0.3:
+        severity = "none"
+        label = "Verified"
+    elif delta <= 0.5:
+        severity = "mild"
+        label = "Slight overstatement"
+    else:
+        severity = "significant"
+        label = "Significant inflation detected"
+        
+    return {
+        "skill_id": skill_id,
+        "mismatch": mismatch,
+        "delta": round(delta, 3),
+        "severity": severity,
+        "label": label
+    }

backend/scoring/gap_classifier.py

@@ -0,0 +1,7 @@
+def classify_gap(final_score: float) -> str:
+    if final_score < 0.3:
+        return "high_gap"
+    elif final_score < 0.6:
+        return "medium_gap"
+    else:
+        return "ready"

frontend/app/assess/[id]/page.tsx

@@ -0,0 +1,99 @@
+"use client"
+import { useEffect, useState } from "react"
+import { useParams, useRouter } from "next/navigation"
+import { useStore } from "@/lib/store"
+import { submitAnswer } from "@/lib/api"
+import { useAssessmentStream } from "@/hooks/useAssessmentStream"
+import ChatInterface from "@/components/assessment/ChatInterface"
+import ProgressBar from "@/components/assessment/ProgressBar"
+
+export default function AssessPage() {
+  const params = useParams()
+  const id = typeof params.id === "string" ? params.id : null
+  const router = useRouter()
+  const [mounted, setMounted] = useState(false)
+  useEffect(() => setMounted(true), [])
+  
+  const { isConnected, error, isComplete } = useAssessmentStream(id)
+  
+  const { messages, extraction, addMessage, currentSkillId } = useStore()
+  const [isWaiting, setIsWaiting] = useState(false)
+  
+  const handleSend = async (answer: string) => {
+    if (!id) return
+    setIsWaiting(true)
+    addMessage({
+      id: Math.random().toString(36).substr(2, 9),
+      role: "user",
+      content: answer,
+      timestamp: new Date()
+    })
+    try {
+      await submitAnswer(id, answer)
+    } catch (err) {
+      console.error(err)
+    }
+  }
+  
+  useEffect(() => {
+    const lastMsg = messages[messages.length - 1]
+    if (lastMsg && (lastMsg.role === "agent" || lastMsg.role === "challenge")) {
+      setIsWaiting(false)
+    }
+  }, [messages])
+  
+  useEffect(() => {
+    if (isComplete) {
+      router.push(`/results/${id}`)
+    }
+  }, [isComplete, id, router])
+  
+  const jdSkills = extraction?.jd_skills || []
+  const resumeSkills = extraction?.resume_skills || []
+  
+  const gapSkills = jdSkills.filter(jd => {
+    const rs = resumeSkills.find(r => r.skill_id === jd.skill_id)
+    return !rs || rs.evidence_strength < 0.6
+  })
+  
+  const currentIdx = currentSkillId ? gapSkills.findIndex(s => s.skill_id === currentSkillId) : 0
+  const progressPct = gapSkills.length > 0 ? ((currentIdx) / gapSkills.length) * 100 : 0
+  
+  if (!mounted) return <div className="h-screen bg-bg"></div>
+  
+  return (
+    <div className="flex h-screen bg-bg text-text">
+      <div className="w-[30%] p-6 border-r border-border overflow-y-auto hidden md:block">
+        <h2 className="text-xl font-mono text-accent mb-8">SkillForge Assessment</h2>
+        
+        <ProgressBar current={currentIdx} total={gapSkills.length} label="ASSESSMENT PROGRESS" />
+        
+        <div className="mt-8 space-y-4">
+          <h3 className="text-xs text-muted uppercase tracking-wider font-mono">Skills to verify</h3>
+          {gapSkills.map((s, idx) => (
+            <div key={s.skill_id} className={`p-4 rounded-lg border transition-colors ${
+              s.skill_id === currentSkillId ? "border-accent bg-accent/5" : "border-border bg-surface"
+            } ${idx < currentIdx ? "opacity-50" : ""}`}>
+              <div className="flex justify-between items-center">
+                <span className={`font-mono text-sm ${s.skill_id === currentSkillId ? "text-accent" : "text-text"}`}>{s.label}</span>
+                {idx < currentIdx && <span className="text-xs text-muted">Complete</span>}
+                {s.skill_id === currentSkillId && <span className="w-2 h-2 rounded-full bg-accent animate-pulse"></span>}
+              </div>
+            </div>
+          ))}
+        </div>
+      </div>
+      
+      <div className="w-full md:w-[70%] h-full">
+        {error ? (
+           <div className="flex items-center justify-center h-full text-red-500 font-mono">
+             {error}. <button onClick={() => window.location.reload()} className="ml-4 underline">Retry</button>
+             <button onClick={() => router.push(`/results/${id}`)} className="ml-4 underline text-accent">Go to Results</button>
+           </div>
+        ) : (
+          <ChatInterface messages={messages} onSend={handleSend} isWaiting={isWaiting} />
+        )}
+      </div>
+    </div>
+  )
+}

frontend/app/candidate/job/[id]/page.tsx

@@ -0,0 +1,129 @@
+"use client"
+import { useEffect, useState } from "react"
+import { useParams, useRouter } from "next/navigation"
+import { createClient } from "@/utils/supabase/client"
+import { useStore } from "@/lib/store"
+import { startAssessment } from "@/lib/api"
+import UploadZone from "@/components/upload/UploadZone"
+
+export default function CandidateJobPage() {
+  const params = useParams()
+  const id = typeof params.id === "string" ? params.id : null
+  const router = useRouter()
+  const supabase = createClient()
+
+  const { hoursPerDay, setHoursPerDay, setJdText, resumeText, setResumeText, setAssessmentId, setExtraction } = useStore()
+
+  const [job, setJob] = useState<any>(null)
+  const [loading, setLoading] = useState(true)
+  const [starting, setStarting] = useState(false)
+  const [error, setError] = useState("")
+
+  useEffect(() => {
+    if (!id) return
+    fetchJob()
+  }, [id])
+
+  const fetchJob = async () => {
+    const { data: { user } } = await supabase.auth.getUser()
+    if (!user) {
+      router.push('/login')
+      return
+    }
+
+    const { data } = await supabase.from('jobs').select('*, profiles(email)').eq('id', id).single()
+    if (data) {
+      setJob(data)
+      setJdText(data.jd_text)
+    }
+    setLoading(false)
+  }
+
+  const handleBegin = async () => {
+    if (!job || !resumeText) return
+    setStarting(true)
+    setError("")
+    
+    try {
+      const { data: { user } } = await supabase.auth.getUser()
+      if (!user) throw new Error("Not authenticated")
+
+      // 1. Create Assessment Row in Supabase
+      const { data: assessment, error: dbError } = await supabase.from('assessments').insert({
+        job_id: job.id,
+        candidate_id: user.id,
+        resume_text: resumeText,
+        status: 'in_progress'
+      }).select().single()
+
+      if (dbError) throw dbError
+
+      // 2. Start Python Backend Assessment with that same Supabase ID
+      const res = await startAssessment(job.jd_text, resumeText, hoursPerDay, assessment.id)
+      
+      // 3. Save to Zustand store and navigate
+      setAssessmentId(assessment.id)
+      setExtraction(res.extraction)
+      router.push(`/assess/${assessment.id}`)
+      
+    } catch (err: any) {
+      setError(err.message)
+      setStarting(false)
+    }
+  }
+
+  if (loading || !job) return <div className="min-h-screen bg-bg flex items-center justify-center font-mono text-accent animate-pulse">Loading Job...</div>
+
+  return (
+    <div className="min-h-screen bg-bg text-text p-6 md:p-12 font-sans overflow-x-hidden">
+      <div className="max-w-4xl mx-auto space-y-8">
+        <button onClick={() => router.push('/candidate')} className="text-sm font-mono text-muted hover:text-accent transition-colors">
+          ← Back to Portal
+        </button>
+        
+        <header className="border-b border-border/40 pb-6">
+          <h1 className="text-3xl font-bold font-mono tracking-tighter mb-2 text-accent">{job.title}</h1>
+          <p className="text-muted font-mono text-sm">Posted by: {job.profiles?.email}</p>
+        </header>
+
+        <div className="bg-surface/40 backdrop-blur-md border border-border/40 p-8 rounded-3xl space-y-8">
+          <div>
+            <h2 className="text-xl font-mono text-text mb-4 flex items-center">
+               <span className="w-8 h-px bg-accent/50 mr-4"></span>
+               Apply & Test
+            </h2>
+            <p className="text-muted text-sm mb-6">
+               Upload your resume below to begin. Our AI will instantly evaluate your resume against this job description and conduct a dynamic technical interview.
+            </p>
+            
+            <div className="max-w-lg">
+              <UploadZone label="Your Candidate Resume (PDF)" endpoint="resume" onUpload={setResumeText} />
+            </div>
+          </div>
+          
+          <div className="max-w-lg bg-background/50 border border-border/30 p-5 rounded-xl">
+            <label className="flex justify-between text-sm font-mono text-muted mb-4">
+              <span>Availability (hours/day)</span>
+              <span className="text-accent font-bold">{hoursPerDay}h</span>
+            </label>
+            <input 
+              type="range" min="1" max="8" step="0.5" 
+              value={hoursPerDay} onChange={(e) => setHoursPerDay(parseFloat(e.target.value))}
+              className="w-full h-1.5 bg-background rounded-lg appearance-none cursor-pointer accent-accent transition-all hover:h-2"
+            />
+          </div>
+
+          {error && <div className="text-red-500 font-mono text-sm">{error}</div>}
+
+          <button
+            onClick={handleBegin}
+            disabled={!resumeText || starting}
+            className="bg-accent text-background px-8 py-4 rounded-xl font-mono font-bold text-lg hover:scale-[1.02] shadow-[0_0_20px_rgba(232,255,107,0.2)] disabled:opacity-50 disabled:hover:scale-100 transition-all"
+          >
+            {starting ? "Initializing Engine..." : "Begin AI Interview →"}
+          </button>
+        </div>
+      </div>
+    </div>
+  )
+}

frontend/app/candidate/page.tsx

@@ -0,0 +1,83 @@
+"use client"
+import { useEffect, useState } from "react"
+import { useRouter } from "next/navigation"
+import { createClient } from "@/utils/supabase/client"
+
+export default function CandidateDashboard() {
+  const router = useRouter()
+  const supabase = createClient()
+  const [jobs, setJobs] = useState<any[]>([])
+  const [loading, setLoading] = useState(true)
+
+  useEffect(() => {
+    fetchJobs()
+  }, [])
+
+  const fetchJobs = async () => {
+    const { data: { user } } = await supabase.auth.getUser()
+    if (!user) {
+      router.push('/login')
+      return
+    }
+
+    const { data: profile } = await supabase.from('profiles').select('role').eq('id', user.id).single()
+    if (profile?.role !== 'candidate') {
+      router.push('/employer')
+      return
+    }
+
+    // Fetch all jobs
+    const { data } = await supabase.from('jobs').select('*, profiles(email)').order('created_at', { ascending: false })
+    if (data) setJobs(data)
+    setLoading(false)
+  }
+
+  const handleLogout = async () => {
+    await supabase.auth.signOut()
+    router.push('/')
+  }
+
+  if (loading) return <div className="min-h-screen bg-bg flex items-center justify-center font-mono text-accent animate-pulse">Loading Opportunities...</div>
+
+  return (
+    <div className="min-h-screen bg-bg text-text p-6 md:p-12 font-sans overflow-x-hidden">
+      <div className="max-w-4xl mx-auto space-y-12">
+        <header className="flex justify-between items-end border-b border-border/40 pb-6">
+          <div>
+            <h1 className="text-4xl font-bold font-mono tracking-tighter mb-2">Candidate <span className="text-accent">Portal</span></h1>
+            <p className="text-muted font-mono">Discover roles and prove your skills</p>
+          </div>
+          <button onClick={handleLogout} className="text-sm font-mono text-muted hover:text-red-400 transition-colors">Log Out</button>
+        </header>
+
+        <section className="space-y-6">
+          <h2 className="text-2xl font-mono text-text">Open Positions</h2>
+          
+          {jobs.length === 0 ? (
+            <div className="border border-dashed border-border/50 rounded-2xl p-12 text-center text-muted font-mono">
+              No open positions at the moment. Check back soon!
+            </div>
+          ) : (
+            <div className="grid grid-cols-1 gap-4">
+              {jobs.map(job => (
+                <div key={job.id} className="bg-surface/40 backdrop-blur-md border border-border/40 p-6 rounded-2xl flex flex-col md:flex-row justify-between items-start md:items-center gap-4 hover:border-accent/50 transition-colors">
+                  <div>
+                    <h3 className="text-xl font-mono text-accent mb-2">{job.title}</h3>
+                    <p className="text-xs font-mono text-muted">Posted by: {job.profiles?.email}</p>
+                    <p className="text-xs font-mono text-muted mt-1">{new Date(job.created_at).toLocaleDateString()}</p>
+                  </div>
+                  <button 
+                    onClick={() => router.push(`/candidate/job/${job.id}`)}
+                    className="bg-accent/10 text-accent border border-accent/30 px-6 py-2 rounded-lg font-mono font-bold hover:bg-accent hover:text-background transition-all"
+                  >
+                    Apply & Assess →
+                  </button>
+                </div>
+              ))}
+            </div>
+          )}
+        </section>
+      </div>
+    </div>
+  )
+}

frontend/app/employer/job/[id]/page.tsx

@@ -0,0 +1,118 @@
+"use client"
+import { useEffect, useState } from "react"
+import { useParams, useRouter } from "next/navigation"
+import { createClient } from "@/utils/supabase/client"
+
+export default function EmployerJobPage() {
+  const params = useParams()
+  const id = typeof params.id === "string" ? params.id : null
+  const router = useRouter()
+  const supabase = createClient()
+
+  const [job, setJob] = useState<any>(null)
+  const [assessments, setAssessments] = useState<any[]>([])
+  const [loading, setLoading] = useState(true)
+
+  useEffect(() => {
+    if (!id) return
+    fetchJobAndCandidates()
+  }, [id])
+
+  const fetchJobAndCandidates = async () => {
+    const { data: { user } } = await supabase.auth.getUser()
+    if (!user) {
+      router.push('/login')
+      return
+    }
+
+    // Fetch job details
+    const { data: jobData } = await supabase.from('jobs').select('*').eq('id', id).single()
+    if (jobData) setJob(jobData)
+
+    // Fetch assessments for this job
+    const { data: assessmentData } = await supabase.from('assessments')
+      .select('id, status, created_at, result_data, profiles(email)')
+      .eq('job_id', id)
+      
+    if (assessmentData) {
+      const mapped = assessmentData.map((a: any) => {
+        let score = 0;
+        if (a.result_data && a.result_data.skill_scores && a.result_data.skill_scores.length > 0) {
+          score = Math.round((a.result_data.skill_scores.reduce((sum: number, s: any) => sum + s.final_score, 0) / a.result_data.skill_scores.length) * 100)
+        }
+        return { ...a, score }
+      })
+      // Sort by score descending
+      mapped.sort((a, b) => b.score - a.score)
+      setAssessments(mapped)
+    }
+
+    setLoading(false)
+  }
+
+  if (loading || !job) return <div className="min-h-screen bg-bg flex items-center justify-center font-mono text-accent animate-pulse">Loading Job Details...</div>
+
+  return (
+    <div className="min-h-screen bg-bg text-text p-6 md:p-12 font-sans overflow-x-hidden">
+      <div className="max-w-5xl mx-auto space-y-8">
+        <button onClick={() => router.push('/employer')} className="text-sm font-mono text-muted hover:text-accent transition-colors">
+          ← Back to Dashboard
+        </button>
+        
+        <header className="border-b border-border/40 pb-6 flex justify-between items-end">
+          <div>
+            <h1 className="text-3xl font-bold font-mono tracking-tighter mb-2 text-accent">{job.title}</h1>
+            <p className="text-muted font-mono text-sm">Posted on {new Date(job.created_at).toLocaleDateString()}</p>
+          </div>
+          <div className="bg-surface/50 border border-border/50 px-4 py-2 rounded-lg">
+            <span className="font-mono text-xl text-text font-bold">{assessments.length}</span>
+            <span className="text-muted text-xs uppercase ml-2">Candidates</span>
+          </div>
+        </header>
+
+        <section className="space-y-6">
+          <h2 className="text-2xl font-mono text-text">Candidate Assessments</h2>
+          
+          {assessments.length === 0 ? (
+            <div className="border border-dashed border-border/50 rounded-2xl p-12 text-center text-muted font-mono bg-surface/20">
+              No candidates have applied to this job yet.
+            </div>
+          ) : (
+            <div className="grid grid-cols-1 gap-4">
+              {assessments.map((assessment) => (
+                <div key={assessment.id} className="bg-surface/40 backdrop-blur-md border border-border/40 p-6 rounded-2xl flex flex-col md:flex-row justify-between items-start md:items-center gap-4 hover:border-accent/50 transition-colors">
+                  <div>
+                    <h3 className="text-lg font-mono text-text mb-1">{assessment.profiles?.email}</h3>
+                    <div className="flex items-center gap-3">
+                      <span className={`text-xs font-mono px-2 py-1 rounded-md border ${
+                        assessment.status === 'completed' 
+                          ? 'border-green-500/50 text-green-400 bg-green-500/10' 
+                          : 'border-yellow-500/50 text-yellow-400 bg-yellow-500/10'
+                      }`}>
+                        {assessment.status === 'completed' ? 'COMPLETED' : 'IN PROGRESS'}
+                      </span>
+                      {assessment.status === 'completed' && (
+                        <span className="text-xs font-mono px-2 py-1 rounded-md border border-accent/50 text-accent bg-accent/10">
+                          SCORE: {assessment.score}/100
+                        </span>
+                      )}
+                      <span className="text-xs text-muted font-mono">{new Date(assessment.created_at).toLocaleString()}</span>
+                    </div>
+                  </div>
+                  
+                  <button 
+                    disabled={assessment.status !== 'completed'}
+                    onClick={() => router.push(`/results/${assessment.id}`)}
+                    className="bg-background border border-border text-text px-6 py-2 rounded-lg font-mono font-bold hover:border-accent hover:text-accent transition-all disabled:opacity-50 disabled:hover:border-border disabled:hover:text-text"
+                  >
+                    {assessment.status === 'completed' ? "View Results →" : "Awaiting Completion"}
+                  </button>
+                </div>
+              ))}
+            </div>
+          )}
+        </section>
+      </div>
+    </div>
+  )
+}

frontend/app/employer/page.tsx

@@ -0,0 +1,136 @@
+"use client"
+import { useEffect, useState } from "react"
+import { useRouter } from "next/navigation"
+import { createClient } from "@/utils/supabase/client"
+import UploadZone from "@/components/upload/UploadZone"
+
+export default function EmployerDashboard() {
+  const router = useRouter()
+  const supabase = createClient()
+  const [jobs, setJobs] = useState<any[]>([])
+  const [loading, setLoading] = useState(true)
+  const [jdText, setJdText] = useState("")
+  const [jobTitle, setJobTitle] = useState("")
+  const [creating, setCreating] = useState(false)
+
+  useEffect(() => {
+    fetchJobs()
+  }, [])
+
+  const fetchJobs = async () => {
+    const { data: { user } } = await supabase.auth.getUser()
+    if (!user) {
+      router.push('/login')
+      return
+    }
+
+    const { data: profile } = await supabase.from('profiles').select('role').eq('id', user.id).single()
+    if (profile?.role !== 'employer') {
+      router.push('/candidate')
+      return
+    }
+
+    const { data } = await supabase.from('jobs').select('*').order('created_at', { ascending: false })
+    if (data) setJobs(data)
+    setLoading(false)
+  }
+
+  const handleCreateJob = async () => {
+    if (!jobTitle || !jdText) return
+    setCreating(true)
+    
+    const { data: { user } } = await supabase.auth.getUser()
+    if (!user) return
+
+    const { error } = await supabase.from('jobs').insert({
+      employer_id: user.id,
+      title: jobTitle,
+      jd_text: jdText
+    })
+
+    setCreating(false)
+    if (!error) {
+      setJobTitle("")
+      setJdText("")
+      fetchJobs()
+    }
+  }
+
+  const handleLogout = async () => {
+    await supabase.auth.signOut()
+    router.push('/')
+  }
+
+  if (loading) return <div className="min-h-screen bg-bg flex items-center justify-center font-mono text-accent animate-pulse">Loading Dashboard...</div>
+
+  return (
+    <div className="min-h-screen bg-bg text-text p-6 md:p-12 font-sans overflow-x-hidden">
+      <div className="max-w-6xl mx-auto space-y-12">
+        <header className="flex justify-between items-end border-b border-border/40 pb-6">
+          <div>
+            <h1 className="text-4xl font-bold font-mono tracking-tighter mb-2">Employer <span className="text-accent">Portal</span></h1>
+            <p className="text-muted font-mono">Manage jobs and review candidate assessments</p>
+          </div>
+          <button onClick={handleLogout} className="text-sm font-mono text-muted hover:text-red-400 transition-colors">Log Out</button>
+        </header>
+
+        <div className="grid grid-cols-1 lg:grid-cols-3 gap-8">
+          <div className="lg:col-span-1 space-y-6">
+            <div className="bg-surface/40 backdrop-blur-md border border-border/40 p-6 rounded-2xl">
+              <h2 className="text-xl font-mono text-accent mb-6">Post New Job</h2>
+              
+              <div className="space-y-4">
+                <div>
+                  <label className="block text-xs font-mono text-muted mb-2">Job Title</label>
+                  <input 
+                    type="text" 
+                    value={jobTitle}
+                    onChange={(e) => setJobTitle(e.target.value)}
+                    className="w-full bg-background border border-border/50 rounded-xl p-3 text-sm focus:border-accent outline-none"
+                    placeholder="e.g. Senior Frontend Engineer"
+                  />
+                </div>
+                
+                <div className="pt-2">
+                  <UploadZone label="Job Description (PDF)" endpoint="jd" onUpload={setJdText} />
+                </div>
+
+                <button
+                  onClick={handleCreateJob}
+                  disabled={creating || !jobTitle || !jdText}
+                  className="w-full bg-accent text-background font-bold font-mono py-3 rounded-xl hover:brightness-110 disabled:opacity-50 mt-4"
+                >
+                  {creating ? "Posting..." : "Create Job"}
+                </button>
+              </div>
+            </div>
+          </div>
+
+          <div className="lg:col-span-2 space-y-6">
+            <h2 className="text-2xl font-mono text-text">Your Active Jobs</h2>
+            
+            {jobs.length === 0 ? (
+              <div className="border border-dashed border-border/50 rounded-2xl p-12 text-center text-muted font-mono">
+                No jobs posted yet. Post your first job to start receiving candidates!
+              </div>
+            ) : (
+              <div className="space-y-4">
+                {jobs.map(job => (
+                  <div key={job.id} className="bg-surface/40 border border-border/40 p-6 rounded-2xl hover:border-accent/50 transition-colors flex justify-between items-center group cursor-pointer" onClick={() => router.push(`/employer/job/${job.id}`)}>
+                    <div>
+                      <h3 className="text-lg font-mono text-accent mb-1">{job.title}</h3>
+                      <p className="text-xs text-muted font-mono">Posted {new Date(job.created_at).toLocaleDateString()}</p>
+                    </div>
+                    <div className="text-muted group-hover:text-accent group-hover:translate-x-1 transition-all">
+                      View Candidates →
+                    </div>
+                  </div>
+                ))}
+              </div>
+            )}
+          </div>
+        </div>
+      </div>
+    </div>
+  )
+}

frontend/app/globals.css

@@ -0,0 +1,22 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+:root {
+  --bg: #030014;
+  --surface: rgba(13, 10, 31, 0.7);
+  --border: #221c46;
+  --accent: #00f0ff;
+  --text: #ffffff;
+  --muted: #8e8b9f;
+}
+
+body {
+  background-color: var(--bg);
+  color: var(--text);
+  background-image: 
+    radial-gradient(circle at 15% 0%, rgba(112, 0, 255, 0.15) 0%, transparent 40%),
+    radial-gradient(circle at 85% 100%, rgba(0, 240, 255, 0.15) 0%, transparent 40%);
+  background-attachment: fixed;
+  min-height: 100vh;
+}

frontend/app/layout.tsx

@@ -0,0 +1,22 @@
+import { IBM_Plex_Mono, IBM_Plex_Sans } from "next/font/google"
+import type { Metadata } from "next"
+import "./globals.css"
+
+const plexMono = IBM_Plex_Mono({ subsets: ["latin"], weight: ["400", "500", "700"], variable: "--font-mono" })
+const plexSans = IBM_Plex_Sans({ subsets: ["latin"], weight: ["400", "500", "700"], variable: "--font-sans" })
+
+export const metadata: Metadata = {
+  title: "SkillForge AI",
+  description: "From resume claims to real capability.",
+  colorScheme: "dark",
+}
+
+export default function RootLayout({ children }: { children: React.ReactNode }) {
+  return (
+    <html lang="en" className={`${plexMono.variable} ${plexSans.variable}`}>
+      <body className="bg-background text-text font-sans antialiased min-h-screen">
+        {children}
+      </body>
+    </html>
+  )
+}

frontend/app/login/page.tsx

@@ -0,0 +1,151 @@
+"use client"
+import { useState } from "react"
+import { useRouter } from "next/navigation"
+import { createClient } from "@/utils/supabase/client"
+
+export default function LoginPage() {
+  const router = useRouter()
+  const supabase = createClient()
+  
+  const [isLogin, setIsLogin] = useState(true)
+  const [email, setEmail] = useState("")
+  const [password, setPassword] = useState("")
+  const [role, setRole] = useState("candidate")
+  const [loading, setLoading] = useState(false)
+  const [error, setError] = useState("")
+
+  const handleAuth = async (e: React.FormEvent) => {
+    e.preventDefault()
+    setLoading(true)
+    setError("")
+
+    // Strict check for allowed email domains
+    const allowedDomains = ["@gmail.com", "@yahoo.com", "@outlook.com", "@hotmail.com", "@icloud.com"]
+    const hasValidDomain = allowedDomains.some(domain => email.toLowerCase().endsWith(domain))
+    
+    if (!hasValidDomain) {
+      setError("Please use a standard email provider (e.g., @gmail.com, @yahoo.com)")
+      setLoading(false)
+      return
+    }
+
+    if (isLogin) {
+      const { data, error } = await supabase.auth.signInWithPassword({ email, password })
+      if (error) {
+        setError(error.message)
+        setLoading(false)
+        return
+      }
+      
+      // Fetch role
+      const { data: profile } = await supabase.from('profiles').select('role').eq('id', data.user.id).single()
+      if (profile?.role === 'employer') {
+        router.push('/employer')
+      } else {
+        router.push('/candidate')
+      }
+    } else {
+      const { data, error } = await supabase.auth.signUp({ email, password })
+      if (error) {
+        setError(error.message)
+        setLoading(false)
+        return
+      }
+      if (data.user) {
+        const { error: profileError } = await supabase.from('profiles').insert({
+          id: data.user.id,
+          email,
+          role
+        })
+        if (profileError) {
+          setError(profileError.message)
+          setLoading(false)
+          return
+        }
+        if (role === 'employer') {
+          router.push('/employer')
+        } else {
+          router.push('/candidate')
+        }
+      }
+    }
+  }
+
+  return (
+    <div className="min-h-screen relative bg-bg text-text flex items-center justify-center p-6 overflow-hidden">
+      <div className="fixed inset-0 pointer-events-none bg-[linear-gradient(rgba(255,255,255,0.02)_1px,transparent_1px),linear-gradient(90deg,rgba(255,255,255,0.02)_1px,transparent_1px)] bg-[size:4rem_4rem] z-0"></div>
+      <div className="fixed inset-0 pointer-events-none z-0" style={{ background: "radial-gradient(circle at 50% 50%, rgba(0, 240, 255, 0.05) 0%, transparent 70%)" }}></div>
+      
+      <div className="relative z-10 max-w-md w-full bg-surface/60 backdrop-blur-xl border border-border/50 p-8 rounded-3xl shadow-[0_4px_30px_rgba(0,0,0,0.3)]">
+        <h1 className="text-4xl font-bold font-mono text-center tracking-tighter mb-2">
+          SkillForge<span className="text-accent">.ai</span>
+        </h1>
+        <h2 className="text-lg text-center text-muted font-mono mb-8">{isLogin ? "Access your portal" : "Create your account"}</h2>
+        
+        {error && <div className="bg-red-500/10 border border-red-500/50 text-red-500 p-4 rounded-xl mb-6 text-sm font-mono">{error}</div>}
+        
+        <form onSubmit={handleAuth} className="space-y-5">
+          <div>
+            <label className="block text-xs uppercase tracking-wider font-mono text-muted mb-2">Email Address</label>
+            <input 
+              type="email" 
+              required
+              value={email}
+              onChange={e => setEmail(e.target.value)}
+              className="w-full bg-background border border-border/50 rounded-xl p-3 text-sm focus:outline-none focus:border-accent transition-colors"
+              placeholder="you@example.com"
+            />
+          </div>
+          <div>
+            <label className="block text-xs uppercase tracking-wider font-mono text-muted mb-2">Password</label>
+            <input 
+              type="password" 
+              required
+              value={password}
+              onChange={e => setPassword(e.target.value)}
+              className="w-full bg-background border border-border/50 rounded-xl p-3 text-sm focus:outline-none focus:border-accent transition-colors"
+              placeholder="••••••••"
+            />
+          </div>
+          
+          {!isLogin && (
+            <div>
+              <label className="block text-xs uppercase tracking-wider font-mono text-muted mb-2">I am a...</label>
+              <div className="flex gap-4">
+                <button 
+                  type="button"
+                  onClick={() => setRole("candidate")}
+                  className={`flex-1 p-3 rounded-xl border font-mono transition-all duration-300 ${role === "candidate" ? "border-accent bg-accent/10 text-accent shadow-[0_0_15px_rgba(0,240,255,0.15)]" : "border-border/50 bg-background text-muted hover:border-border"}`}
+                >
+                  Candidate
+                </button>
+                <button 
+                  type="button"
+                  onClick={() => setRole("employer")}
+                  className={`flex-1 p-3 rounded-xl border font-mono transition-all duration-300 ${role === "employer" ? "border-accent bg-accent/10 text-accent shadow-[0_0_15px_rgba(0,240,255,0.15)]" : "border-border/50 bg-background text-muted hover:border-border"}`}
+                >
+                  Employer
+                </button>
+              </div>
+            </div>
+          )}
+          
+          <button 
+            type="submit" 
+            disabled={loading}
+            className="w-full bg-accent text-background font-bold font-mono py-4 rounded-xl hover:scale-[1.02] shadow-[0_0_20px_rgba(0,240,255,0.2)] disabled:opacity-50 disabled:hover:scale-100 transition-all mt-4"
+          >
+            {loading ? "Authenticating..." : (isLogin ? "Secure Login →" : "Create Account →")}
+          </button>
+        </form>
+        
+        <div className="text-center mt-8 text-muted text-sm font-mono">
+          {isLogin ? "Don't have an account? " : "Already have an account? "}
+          <button onClick={() => setIsLogin(!isLogin)} className="text-accent hover:underline">
+            {isLogin ? "Sign Up" : "Log In"}
+          </button>
+        </div>
+      </div>
+    </div>
+  )
+}

frontend/app/page.tsx

@@ -0,0 +1,43 @@
+"use client"
+import { useRouter } from "next/navigation"
+
+export default function LandingPage() {
+  const router = useRouter()
+
+  return (
+    <div className="min-h-screen relative overflow-hidden flex flex-col items-center justify-center p-6 bg-[linear-gradient(rgba(255,255,255,0.02)_1px,transparent_1px),linear-gradient(90deg,rgba(255,255,255,0.02)_1px,transparent_1px)] bg-[size:4rem_4rem]">
+      <div className="absolute inset-0 pointer-events-none" style={{ background: "radial-gradient(circle at center, transparent 0%, var(--bg) 100%)" }}></div>
+      
+      <div className="relative z-10 w-full max-w-4xl flex flex-col items-center text-center">
+        <h1 className="text-5xl md:text-7xl font-bold font-mono text-text mb-4 tracking-tighter">SkillForge<span className="text-accent">.ai</span></h1>
+        <p className="text-xl text-muted mb-12 font-mono max-w-2xl">
+          The next-generation technical assessment platform. Move beyond basic resume parsing and test real capability.
+        </p>
+        
+        <div className="flex flex-col md:flex-row gap-6 w-full max-w-2xl">
+          <div className="flex-1 bg-surface/60 backdrop-blur-xl border border-border/50 p-8 rounded-3xl flex flex-col items-center">
+            <h2 className="text-2xl font-mono text-accent mb-4">For Employers</h2>
+            <p className="text-muted text-sm mb-8 text-center">Post jobs, set requirements, and let AI conduct the first-round technical interviews for you.</p>
+            <button
+              onClick={() => router.push('/login')}
+              className="w-full bg-background border border-border text-text px-6 py-3 rounded-xl font-mono hover:border-accent hover:text-accent transition-colors"
+            >
+              Employer Portal →
+            </button>
+          </div>
+
+          <div className="flex-1 bg-surface/60 backdrop-blur-xl border border-border/50 p-8 rounded-3xl flex flex-col items-center">
+            <h2 className="text-2xl font-mono text-accent mb-4">For Candidates</h2>
+            <p className="text-muted text-sm mb-8 text-center">Apply to open roles, take interactive AI-driven technical assessments, and prove your skills.</p>
+            <button
+              onClick={() => router.push('/login')}
+              className="w-full bg-accent text-background px-6 py-3 rounded-xl font-mono font-bold hover:scale-[1.02] shadow-[0_0_20px_rgba(0,240,255,0.2)] transition-all"
+            >
+              Candidate Portal →
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+  )
+}

frontend/app/results/[id]/page.tsx

@@ -0,0 +1,195 @@
+"use client"
+import { useEffect, useState } from "react"
+import { useParams, useRouter } from "next/navigation"
+import { useStore } from "@/lib/store"
+import { getRoadmap } from "@/lib/api"
+import { createClient } from "@/utils/supabase/client"
+import SkillHeatmap from "@/components/results/SkillHeatmap"
+import RoadmapTimeline from "@/components/results/RoadmapTimeline"
+import GraphPathViz from "@/components/results/GraphPathViz"
+
+export default function ResultsPage() {
+  const params = useParams()
+  const id = typeof params.id === "string" ? params.id : null
+  const router = useRouter()
+  const { hoursPerDay, setHoursPerDay, result, setResult, resetAssessment } = useStore()
+  const [mounted, setMounted] = useState(false)
+  const [error, setError] = useState("")
+  const [resumeText, setResumeText] = useState("")
+
+  useEffect(() => {
+    setMounted(true)
+    if (!id) return
+    
+    const loadResults = async () => {
+      const supabase = createClient()
+      
+      // 1. Try to load completed result from Supabase
+      const { data: assessment } = await supabase.from('assessments').select('status, result_data, resume_text').eq('id', id).single()
+      
+      if (assessment) {
+        setResumeText(assessment.resume_text || "")
+        if (assessment.status === 'completed' && assessment.result_data) {
+          setResult(assessment.result_data)
+          return
+        }
+      }
+
+      // 2. If not completed or not in Supabase, try to fetch from Python backend (live computation)
+      try {
+        const res = await getRoadmap(id, hoursPerDay)
+        setResult(res)
+        
+        // 3. Save the newly computed result to Supabase
+        await supabase.from('assessments').update({
+          status: 'completed',
+          result_data: res
+        }).eq('id', id)
+      } catch (err) {
+        console.error("Failed to load roadmap:", err)
+        setError("This assessment session was interrupted or wiped from memory before completion.")
+      }
+    }
+    
+    loadResults()
+  }, [id, hoursPerDay, setResult, router])
+
+  if (error) {
+    return (
+      <div className="min-h-screen flex flex-col items-center justify-center bg-bg font-mono text-center p-6 space-y-6">
+        <h1 className="text-3xl font-bold text-red-500">Session Expired</h1>
+        <p className="text-muted max-w-md">{error}</p>
+        <button onClick={() => router.back()} className="text-accent border border-accent/50 px-6 py-2 rounded-lg hover:bg-accent/10">Go Back</button>
+      </div>
+    )
+  }
+
+  if (!mounted || !result) {
+    return (
+      <div className="min-h-screen flex items-center justify-center bg-bg font-mono text-accent animate-pulse">
+        Compiling Results...
+      </div>
+  }
+
+  const overallScore = result?.skill_scores?.length > 0 
+    ? Math.round((result.skill_scores.reduce((sum: number, s: any) => sum + s.final_score, 0) / result.skill_scores.length) * 100)
+    : 0;
+
+  return (
+    <div className="min-h-screen relative bg-bg text-text p-6 md:p-12 font-sans overflow-x-hidden">
+      {/* Background Gradients */}
+      <div className="fixed inset-0 pointer-events-none bg-[linear-gradient(rgba(255,255,255,0.02)_1px,transparent_1px),linear-gradient(90deg,rgba(255,255,255,0.02)_1px,transparent_1px)] bg-[size:4rem_4rem] z-0"></div>
+      <div className="fixed inset-0 pointer-events-none z-0" style={{ background: "radial-gradient(circle at 50% 0%, rgba(0, 240, 255, 0.05) 0%, transparent 70%)" }}></div>
+      
+      <div className="relative z-10 max-w-6xl mx-auto space-y-16">
+        {/* Header */}
+        <header className="flex flex-col md:flex-row md:items-end justify-between border-b border-border/40 pb-8 gap-6 backdrop-blur-md bg-bg/40 p-8 rounded-2xl border shadow-lg">
+          <div>
+            <h1 className="text-4xl md:text-5xl font-bold font-mono tracking-tighter mb-3">
+              <span className="text-accent">Assessment</span> Results
+            </h1>
+            <p className="text-muted font-mono flex items-center">
+              <span className="w-2 h-2 rounded-full bg-accent mr-3 animate-pulse"></span>
+              Profile: {result.extraction.seniority_level} {result.extraction.domain}
+            </p>
+          </div>
+          
+          <div className="bg-surface/60 backdrop-blur-xl border border-border/50 p-5 rounded-xl w-full md:w-72 shadow-[0_4px_20px_rgba(0,0,0,0.2)]">
+             <label className="flex justify-between text-sm font-mono text-muted mb-3">
+                <span>Availability</span>
+                <span className="text-accent font-bold">{hoursPerDay}h/day</span>
+             </label>
+             <input 
+                type="range" min="1" max="8" step="0.5" 
+                value={hoursPerDay} onChange={(e) => setHoursPerDay(parseFloat(e.target.value))}
+                className="w-full h-1.5 bg-background rounded-lg appearance-none cursor-pointer accent-accent transition-all hover:h-2"
+             />
+          </div>
+        </header>
+
+        {/* Score Overview */}
+        <section className="bg-surface/40 backdrop-blur-md border border-border/40 p-8 rounded-3xl shadow-xl hover:shadow-[0_0_30px_rgba(0,240,255,0.05)] transition-shadow duration-500 flex flex-col items-center">
+          <h2 className="text-2xl font-mono text-accent mb-8">Overall Capability Score</h2>
+          <div className="relative w-48 h-48 flex items-center justify-center">
+            <svg className="w-full h-full transform -rotate-90" viewBox="0 0 100 100">
+              <circle cx="50" cy="50" r="40" stroke="currentColor" strokeWidth="8" fill="transparent" className="text-border" />
+              <circle cx="50" cy="50" r="40" stroke="currentColor" strokeWidth="8" fill="transparent" strokeDasharray="251.2" strokeDashoffset={251.2 - (overallScore/100)*251.2} className="text-accent transition-all duration-1000 ease-out" />
+            </svg>
+            <div className="absolute flex flex-col items-center justify-center">
+              <span className="text-5xl font-bold font-mono text-text">{overallScore}</span>
+              <span className="text-sm text-accent font-mono mt-1">/ 100</span>
+            </div>
+          </div>
+        </section>
+
+        {/* Skill Map */}
+        <section className="bg-surface/40 backdrop-blur-md border border-border/40 p-8 rounded-3xl shadow-xl hover:shadow-[0_0_30px_rgba(0,240,255,0.05)] transition-shadow duration-500">
+          <h2 className="text-2xl font-mono text-accent mb-8 flex items-center">
+            <span className="w-10 h-px bg-accent/50 mr-4"></span>
+            Skill Map
+            <span className="ml-4 text-xs font-sans text-muted bg-surface px-3 py-1 rounded-full border border-border/50 hidden sm:inline-block">Performance Overview</span>
+          </h2>
+          <SkillHeatmap skillScores={result.skill_scores} />
+        </section>
+
+        {/* Learning Path */}
+        {result.roadmap.filter(r => r.tier === 1).length > 0 && (
+          <section className="bg-surface/40 backdrop-blur-md border border-border/40 p-8 rounded-3xl shadow-xl hover:shadow-[0_0_30px_rgba(0,240,255,0.05)] transition-shadow duration-500">
+            <h2 className="text-2xl font-mono text-accent mb-8 flex items-center">
+              <span className="w-10 h-px bg-accent/50 mr-4"></span>
+              Prerequisite Pathways
+            </h2>
+            <div className="grid grid-cols-1 gap-6">
+              {result.roadmap.filter(r => r.tier === 1).map(r => (
+                <div key={r.skill_id} className="bg-background/80 border border-border/50 rounded-xl p-6 transition-transform hover:-translate-y-1 duration-300">
+                  <h3 className="font-mono text-text mb-4 flex items-center">
+                    <div className="w-2 h-2 bg-accent rounded-sm mr-3"></div>
+                    {r.label}
+                  </h3>
+                  <GraphPathViz path={r.graph_path} edgeTypes={Array(r.graph_path.length - 1).fill("PREREQUISITE")} />
+                </div>
+              ))}
+            </div>
+          </section>
+        )}
+
+        {/* Roadmap */}
+        <section className="bg-surface/40 backdrop-blur-md border border-border/40 p-8 rounded-3xl shadow-xl hover:shadow-[0_0_30px_rgba(0,240,255,0.05)] transition-shadow duration-500">
+          <h2 className="text-2xl font-mono text-accent mb-8 flex items-center">
+            <span className="w-10 h-px bg-accent/50 mr-4"></span>
+            Personalized Roadmap
+          </h2>
+          <RoadmapTimeline roadmap={result.roadmap} />
+        </section>
+
+        {/* Resume View */}
+        {resumeText && (
+          <section className="bg-surface/40 backdrop-blur-md border border-border/40 p-8 rounded-3xl shadow-xl hover:shadow-[0_0_30px_rgba(0,240,255,0.05)] transition-shadow duration-500">
+            <h2 className="text-2xl font-mono text-accent mb-8 flex items-center">
+              <span className="w-10 h-px bg-accent/50 mr-4"></span>
+              Candidate Resume
+            </h2>
+            <div className="bg-background/80 border border-border/50 rounded-xl p-6 max-h-[500px] overflow-y-auto font-mono text-sm text-muted whitespace-pre-wrap leading-relaxed">
+              {resumeText}
+            </div>
+          </section>
+        )}
+
+        <section className="flex justify-center mt-16 pb-16">
+          <button
+            onClick={() => {
+              resetAssessment()
+              router.push('/')
+            }}
+            className="group relative inline-flex items-center justify-center px-8 py-4 font-mono font-bold text-background bg-accent rounded-xl overflow-hidden transition-all hover:scale-105 shadow-[0_0_20px_rgba(0,240,255,0.2)] hover:shadow-[0_0_40px_rgba(0,240,255,0.4)]"
+          >
+            <span className="relative z-10 flex items-center">
+              Start New Assessment 
+              <span className="ml-2 group-hover:translate-x-1 transition-transform">→</span>
+            </span>
+          </button>
+        </section>
+      </div>
+    </div>
+  )
+}

frontend/components/assessment/ChatInterface.tsx

@@ -0,0 +1,142 @@
+"use client"
+import { useState, useRef, useEffect } from "react"
+import type { ChatMessage } from "@/lib/types"
+import ReactMarkdown from "react-markdown"
+
+interface Props {
+  messages: ChatMessage[]
+  onSend: (answer: string) => void
+  isWaiting: boolean
+}
+
+export default function ChatInterface({ messages, onSend, isWaiting }: Props) {
+  const [input, setInput] = useState("")
+  const endRef = useRef<HTMLDivElement>(null)
+
+  useEffect(() => {
+    endRef.current?.scrollIntoView({ behavior: "smooth" })
+  }, [messages])
+
+  const handleSend = () => {
+    if (!input.trim() || isWaiting) return
+    onSend(input)
+    setInput("")
+  }
+
+  const renderAgentMessage = (content: string) => {
+    const lines = content.split('\n')
+    const options: string[] = []
+    const mainText: string[] = []
+    
+    const optionRegex = /^[-*]?\s*([A-D])[\)\.]\s+(.*)/i;
+    
+    for (const line of lines) {
+      const match = line.trim().match(optionRegex)
+      if (match) {
+        options.push(line.trim())
+      } else {
+        mainText.push(line)
+      }
+    }
+    
+    return (
+      <div className="space-y-4">
+        <div className="prose prose-invert max-w-none text-sm font-sans">
+          <ReactMarkdown>{mainText.join('\n')}</ReactMarkdown>
+        </div>
+        {options.length > 0 && (
+          <div className="flex flex-col space-y-2 mt-4">
+            {options.map((opt, i) => {
+              const cleanOpt = opt.replace(/^[-*]?\s*/, '')
+              const match = cleanOpt.match(/^([A-D])[\)\.]/i)
+              const letter = match ? match[1] : cleanOpt
+              return (
+                <button
+                  key={i}
+                  onClick={() => {
+                    if (!isWaiting) onSend(letter.toUpperCase())
+                  }}
+                  disabled={isWaiting}
+                  className="text-left p-3 rounded-lg border border-border bg-surface hover:border-accent hover:bg-accent/5 transition-colors text-sm font-mono text-text disabled:opacity-50 disabled:cursor-not-allowed text-wrap break-words"
+                >
+                  {cleanOpt}
+                </button>
+              )
+            })}
+          </div>
+        )}
+      </div>
+    )
+  }
+
+  return (
+    <div className="flex flex-col h-full bg-surface border-l border-border">
+      <div className="flex-1 overflow-y-auto p-6 space-y-6">
+        {messages.map((m) => (
+          <div key={m.id} className={`flex ${m.role === "user" ? "justify-end" : "justify-start"}`}>
+            {m.role === "agent" && (
+              <div className="w-8 h-8 rounded-full bg-accent text-background flex items-center justify-center font-bold mr-3 shrink-0">SF</div>
+            )}
+            
+            {m.role === "challenge" ? (
+              <div className="w-full bg-background border border-red-500/30 rounded-lg p-4">
+                <div className="text-red-400 font-mono text-sm mb-2 font-bold uppercase">Challenge</div>
+                <div className="prose prose-invert max-w-none text-sm font-sans">
+                  <ReactMarkdown>{m.content}</ReactMarkdown>
+                </div>
+                <div className="mt-4 text-xs text-muted">Submit your answer below</div>
+              </div>
+            ) : m.role === "system" ? (
+              <div className="w-full text-center text-muted text-xs italic">{m.content}</div>
+            ) : m.role === "user" ? (
+              <div className="max-w-[80%] p-4 rounded-xl text-sm bg-accent/10 text-accent ml-12">
+                <ReactMarkdown>{m.content}</ReactMarkdown>
+              </div>
+            ) : (
+              <div className="max-w-[80%] p-4 rounded-xl text-sm bg-background text-text border border-border/50 shadow-sm">
+                {renderAgentMessage(m.content)}
+              </div>
+            )}
+          </div>
+        ))}
+        {isWaiting && (
+          <div className="flex justify-start items-center space-x-2 text-muted mt-4">
+             <div className="w-8 h-8 rounded-full bg-accent text-background flex items-center justify-center font-bold mr-3 shrink-0">SF</div>
+             <div className="flex space-x-1">
+               <div className="w-2 h-2 bg-muted rounded-full animate-bounce"></div>
+               <div className="w-2 h-2 bg-muted rounded-full animate-bounce" style={{animationDelay: "0.2s"}}></div>
+               <div className="w-2 h-2 bg-muted rounded-full animate-bounce" style={{animationDelay: "0.4s"}}></div>
+             </div>
+          </div>
+        )}
+        <div ref={endRef} />
+      </div>
+
+      <div className="p-4 border-t border-border bg-background">
+        <textarea
+          value={input}
+          onChange={(e) => setInput(e.target.value)}
+          onKeyDown={(e) => {
+            if (e.key === "Enter" && !e.shiftKey) {
+              e.preventDefault()
+              handleSend()
+            }
+          }}
+          disabled={isWaiting}
+          placeholder="Type your answer..."
+          className="w-full bg-surface border border-border rounded-lg p-3 text-text focus:outline-none focus:border-accent resize-none disabled:opacity-50"
+          rows={3}
+        />
+        <div className="flex justify-end mt-2">
+          <button
+            onClick={handleSend}
+            disabled={isWaiting || !input.trim()}
+            className="bg-accent text-background px-4 py-2 rounded font-mono text-sm font-bold disabled:opacity-50"
+          >
+            Send
+          </button>
+        </div>
+      </div>
+    </div>
+  )
+}