AI Interview Coach

Simulate real interviews. Get scored. Improve fast.

\n\n

\n Job Title\n \n

\n\n

\n Experience Level\n

\n \n \n \n

\n\n

\n Interview Type\n

\n \n \n \n \n

\n\n

\n \n Number of Questions\n 10\n \n \n

\n\n

\n Answer Timer\n \n

\n\n

\n Company Type\n \n

\n\n \n

\n\n \n \n\n \n \n\n \n \n\n \n\n\n",[156],"abc0ef7a-51f8-11f1-954b-ee650bb23af1","favicon.svg","019e363c-6c13-7621-bfd9-8c305625455d",["D",1779026389980],"",[163],"6a30b5bc-51f9-11f1-a650-ee650bb23af1","app.js","6a30b684-51f9-11f1-a650-ee650bb23af1",7,["D",1779026709540],"script","/* ==========================================================================\n AI Interview Coach — Client Logic (vanilla JS, no frameworks)\n ========================================================================== */\n\nconst API_URL = \"/api/ai\";\nconst SESSION_KEY = \"aic_session_v1\";\n\n// ----- Global state ---------------------------------------------------------\n\nconst AppState = {\n config: {\n jobTitle: \"\",\n level: \"Mid-Level\",\n type: \"Behavioral\",\n companyType: \"Any\",\n totalQuestions: 10,\n timerDuration: 0,\n },\n questions: [],\n currentIndex: 0,\n answers: [],\n feedbacks: [],\n sessionStartTime: null,\n currentScreen: \"setup\",\n isLoading: false,\n timerInterval: null,\n timerSeconds: 0,\n recognition: null,\n isListening: false,\n abortController: null,\n\n get avgScore() {\n const valid = this.feedbacks.filter((f) => f && typeof f.overall === \"number\");\n if (!valid.length) return 0;\n const sum = valid.reduce((a, f) => a + f.overall, 0);\n return (sum / valid.length).toFixed(1);\n },\n};\n\n// ----- DOM utilities --------------------------------------------------------\n\nconst $ = (id) => document.getElementById(id);\nconst $$ = (sel, root = document) => Array.from(root.querySelectorAll(sel));\n\nfunction showScreen(name) {\n [\"setup\", \"interview\", \"feedback\", \"results\"].forEach((s) => {\n const el = $(`screen-${s}`);\n if (!el) return;\n if (s === name) {\n el.style.display = \"block\";\n el.classList.add(\"active\");\n } else {\n el.style.display = \"none\";\n el.classList.remove(\"active\");\n }\n });\n AppState.currentScreen = name;\n window.scrollTo({ top: 0, behavior: \"smooth\" });\n}\n\nfunction showToast(message, type = \"info\") {\n const toast = document.createElement(\"div\");\n toast.className = `toast toast-${type}`;\n toast.textContent = message;\n $(\"toast-container\").appendChild(toast);\n requestAnimationFrame(() => toast.classList.add(\"show\"));\n setTimeout(() => {\n toast.classList.remove(\"show\");\n setTimeout(() => toast.remove(), 300);\n }, 3500);\n}\n\nconst LOADING_MESSAGES = [\n \"Generating your questions...\",\n \"The AI interviewer is thinking...\",\n \"Evaluating your answer...\",\n \"Preparing feedback...\",\n];\nlet loadingMsgInterval = null;\n\nfunction showLoading(initialMessage) {\n AppState.isLoading = true;\n const overlay = $(\"screen-loading\");\n const msg = $(\"loading-message\");\n msg.textContent = initialMessage || LOADING_MESSAGES[0];\n overlay.style.display = \"flex\";\n let i = 0;\n clearInterval(loadingMsgInterval);\n loadingMsgInterval = setInterval(() => {\n i = (i + 1) % LOADING_MESSAGES.length;\n msg.textContent = LOADING_MESSAGES[i];\n }, 2500);\n}\n\nfunction hideLoading() {\n AppState.isLoading = false;\n clearInterval(loadingMsgInterval);\n $(\"screen-loading\").style.display = \"none\";\n}\n\nfunction cancelRequest() {\n if (AppState.abortController) {\n AppState.abortController.abort();\n AppState.abortController = null;\n }\n hideLoading();\n}\n\n// ----- API ------------------------------------------------------------------\n\n/**\n * Streaming AI call. Calls onChunk(token, fullText) as tokens stream in.\n * Returns the full string.\n */\nasync function callAI(messages, onChunk, signal) {\n const response = await fetch(API_URL, {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ messages, stream: true }),\n signal,\n });\n if (!response.ok) {\n const errBody = await response.text().catch(() => \"\");\n throw new Error(`API error ${response.status}: ${errBody}`);\n }\n const reader = response.body.getReader();\n const decoder = new TextDecoder();\n let fullText = \"\";\n let buffer = \"\";\n\n while (true) {\n const { done, value } = await reader.read();\n if (done) break;\n buffer += decoder.decode(value, { stream: true });\n const lines = buffer.split(\"\\n\");\n buffer = lines.pop() || \"\"; // keep last incomplete line\n for (const rawLine of lines) {\n const line = rawLine.trim();\n if (!line || !line.startsWith(\"data:\")) continue;\n const data = line.slice(5).trim();\n if (data === \"[DONE]\") continue;\n try {\n const parsed = JSON.parse(data);\n const token = parsed.choices?.[0]?.delta?.content || \"\";\n if (token) {\n fullText += token;\n if (onChunk) onChunk(token, fullText);\n }\n } catch {\n // Ignore non-JSON keep-alive lines\n }\n }\n }\n return fullText;\n}\n\n/**\n * Non-streaming AI call that expects JSON back. Strips markdown fences if present.\n */\nasync function callAIJSON(messages, signal) {\n const response = await fetch(API_URL, {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ messages, stream: false }),\n signal,\n });\n if (!response.ok) {\n const errBody = await response.text().catch(() => \"\");\n throw new Error(`API error ${response.status}: ${errBody}`);\n }\n const data = await response.json();\n const raw = data.choices?.[0]?.message?.content || \"\";\n return parseLooseJSON(raw);\n}\n\nfunction parseLooseJSON(raw) {\n let s = String(raw).trim();\n // Strip markdown fences\n s = s.replace(/```json/gi, \"\").replace(/```/g, \"\").trim();\n // Try direct parse\n try { return JSON.parse(s); } catch {}\n // Try to extract the first {...} or [...]\n const firstObj = s.indexOf(\"{\");\n const firstArr = s.indexOf(\"[\");\n let start = -1;\n if (firstObj === -1) start = firstArr;\n else if (firstArr === -1) start = firstObj;\n else start = Math.min(firstObj, firstArr);\n if (start === -1) throw new Error(\"No JSON found in response\");\n const openChar = s[start];\n const closeChar = openChar === \"{\" ? \"}\" : \"]\";\n const end = s.lastIndexOf(closeChar);\n if (end > start) {\n const slice = s.slice(start, end + 1);\n return JSON.parse(slice);\n }\n throw new Error(\"Failed to parse JSON: \" + s.slice(0, 120));\n}\n\n// ----- Prompts --------------------------------------------------------------\n\nconst QUESTION_GEN_PROMPT = (cfg) => `Generate exactly ${cfg.totalQuestions} interview questions for this candidate profile:\n\n- Job title: \"${cfg.jobTitle}\"\n- Experience level: \"${cfg.level}\" (Junior / Mid-Level / Senior)\n- Interview type: \"${cfg.type}\" (Technical / Behavioral / System Design / HR)\n- Company type: \"${cfg.companyType}\"\n\nReturn ONLY a valid JSON array — no explanation, no markdown, no extra text:\n\n[\n {\n \"id\": 1,\n \"question\": \"Full question text here\",\n \"difficulty\": \"easy\",\n \"type\": \"${cfg.type.toLowerCase()}\",\n \"hint\": \"One sentence hint without giving away the answer\",\n \"keywords\": [\"keyword1\", \"keyword2\"]\n }\n]\n\nRules:\n- Mix difficulties: 30% easy, 50% medium, 20% hard\n- Make questions highly specific to the job title given\n- Behavioral questions must be answerable using the STAR method\n- System Design: name a real product to design (WhatsApp, URL shortener, Netflix, etc.)\n- Technical questions must match the experience level difficulty\n- HR questions cover: strengths/weaknesses, salary expectations, 5-year goals, culture fit\n- NO duplicate topics across questions\n- hint must not reveal the full answer`;\n\nconst FEEDBACK_PROMPT = (q, ans, type, job) => `You are a strict but fair senior interviewer evaluating a candidate's answer.\n\nQuestion: \"${q}\"\nCandidate's answer: \"${ans}\"\nInterview type: \"${type}\"\nRole being interviewed for: \"${job}\"\n\nEvaluate the answer and return ONLY a valid JSON object — no markdown, no explanation:\n\n{\n \"scores\": {\n \"clarity\": ,\n \"depth\": ,\n \"relevance\": ,\n \"star_structure\": \n },\n \"overall\": ,\n \"strengths\": [\"strength 1\", \"strength 2\", \"strength 3\"],\n \"improvements\": [\"improvement 1\", \"improvement 2\", \"improvement 3\"],\n \"tip\": \"One concise, actionable coaching tip (max 2 sentences)\",\n \"model_answer\": \"A strong ideal answer in 4-6 sentences, specific to this question\"\n}\n\nEvaluation rules:\n- clarity: How clearly and concisely was the answer communicated?\n- depth: Was there technical depth, examples, and detail?\n- relevance: Did the answer actually address what was asked?\n- star_structure: For behavioral, did they use Situation/Task/Action/Result? For others, score 7 if logically structured.\n- Be realistic — perfect scores (10) should be rare. Average answers get 5-6.\n- model_answer must be specific to the exact question, not generic advice.\n- Strengths and improvements must each have exactly 3 items.`;\n\nconst RECOMMENDATIONS_PROMPT = (sd) => `A candidate just completed a mock interview session. Based on their performance, give personalized study recommendations.\n\nSession data:\n- Role: ${sd.jobTitle}\n- Interview type: ${sd.type}\n- Average scores: Clarity ${sd.avgClarity}/10, Depth ${sd.avgDepth}/10, Relevance ${sd.avgRelevance}/10, Structure ${sd.avgStructure}/10\n- Weakest questions (scored below 6): ${sd.weakQuestions.join(\"; \") || \"none\"}\n- Overall average: ${sd.overallAvg}/10\n\nReturn ONLY a JSON array of 5 recommendations — no extra text:\n\n[\n {\n \"area\": \"Short area name (e.g. STAR Method)\",\n \"priority\": \"high|medium|low\",\n \"suggestion\": \"Specific, actionable advice in 2-3 sentences\",\n \"resource\": \"Name of a free resource (e.g. 'LeetCode Easy problems')\"\n }\n]`;\n\n// ----- Session persistence --------------------------------------------------\n\nfunction saveSession() {\n try {\n sessionStorage.setItem(SESSION_KEY, JSON.stringify({\n config: AppState.config,\n questions: AppState.questions,\n currentIndex: AppState.currentIndex,\n answers: AppState.answers,\n feedbacks: AppState.feedbacks,\n sessionStartTime: AppState.sessionStartTime,\n currentScreen: AppState.currentScreen,\n }));\n } catch {}\n}\n\nfunction loadSession() {\n try {\n const raw = sessionStorage.getItem(SESSION_KEY);\n if (!raw) return false;\n const saved = JSON.parse(raw);\n if (!saved.questions?.length) return false;\n Object.assign(AppState, saved);\n return true;\n } catch { return false; }\n}\n\nfunction clearSession() {\n sessionStorage.removeItem(SESSION_KEY);\n}\n\n// ----- Setup screen logic ---------------------------------------------------\n\nfunction initSetupScreen() {\n // Slider live value\n const slider = $(\"input-question-count\");\n const sliderVal = $(\"question-count-value\");\n slider.addEventListener(\"input\", () => {\n sliderVal.textContent = slider.value;\n AppState.config.totalQuestions = parseInt(slider.value, 10);\n });\n\n // Chip / type-card button groups (delegated)\n $$(`.btn-group, .type-cards`).forEach((group) => {\n const key = group.dataset.group;\n group.addEventListener(\"click\", (e) => {\n const btn = e.target.closest(\"button[data-value]\");\n if (!btn) return;\n group.querySelectorAll(\"button\").forEach((b) => b.classList.remove(\"active\"));\n btn.classList.add(\"active\");\n AppState.config[key] = btn.dataset.value;\n });\n });\n\n // Other inputs\n $(\"input-job-title\").addEventListener(\"input\", (e) => {\n AppState.config.jobTitle = e.target.value.trim();\n });\n $(\"select-timer\").addEventListener(\"change\", (e) => {\n AppState.config.timerDuration = parseInt(e.target.value, 10);\n });\n $(\"select-company\").addEventListener(\"change\", (e) => {\n AppState.config.companyType = e.target.value;\n });\n\n // Start button\n $(\"btn-start\").addEventListener(\"click\", onStartInterview);\n}\n\nasync function onStartInterview() {\n const cfg = AppState.config;\n if (!cfg.jobTitle) {\n showToast(\"Please enter a job title.\", \"warning\");\n $(\"input-job-title\").focus();\n return;\n }\n\n AppState.abortController = new AbortController();\n showLoading(\"Generating your questions...\");\n\n try {\n const messages = [\n { role: \"system\", content: \"You are an expert interview question generator. Always return valid JSON only.\" },\n { role: \"user\", content: QUESTION_GEN_PROMPT(cfg) },\n ];\n const parsed = await callAIJSON(messages, AppState.abortController.signal);\n const questions = Array.isArray(parsed) ? parsed : (parsed.questions || []);\n if (!questions.length) throw new Error(\"No questions returned\");\n\n AppState.questions = questions.slice(0, cfg.totalQuestions).map((q, i) => ({\n id: q.id ?? i + 1,\n question: q.question || \"\",\n difficulty: (q.difficulty || \"medium\").toLowerCase(),\n type: q.type || cfg.type,\n hint: q.hint || \"\",\n keywords: q.keywords || [],\n }));\n AppState.currentIndex = 0;\n AppState.answers = [];\n AppState.feedbacks = [];\n AppState.sessionStartTime = Date.now();\n saveSession();\n hideLoading();\n enterInterviewScreen();\n } catch (err) {\n hideLoading();\n if (err.name === \"AbortError\") return;\n console.error(err);\n showToast(\"Failed to generate questions. \" + err.message, \"danger\");\n }\n}\n\n// ----- Interview screen logic -----------------------------------------------\n\nfunction enterInterviewScreen() {\n showScreen(\"interview\");\n renderInterviewerCard();\n renderTips();\n renderCurrentQuestion();\n updateStats();\n}\n\nfunction renderInterviewerCard() {\n $(\"avatar-role\").textContent = `${AppState.config.level} · ${AppState.config.type}`;\n}\n\nconst TIPS = {\n Behavioral: [\n \"Use STAR: Situation → Task → Action → Result\",\n \"Cite a specific example, not a general statement\",\n \"Quantify the outcome when possible\",\n ],\n Technical: [\n \"Think out loud — explain your reasoning\",\n \"Clarify edge cases before diving in\",\n \"State trade-offs of your approach\",\n ],\n \"System Design\": [\n \"Clarify requirements before designing\",\n \"Estimate scale (users, QPS, storage)\",\n \"Discuss trade-offs and bottlenecks\",\n ],\n HR: [\n \"Be honest and specific with examples\",\n \"Tie answers back to the role\",\n \"Show enthusiasm but stay realistic\",\n ],\n};\n\nfunction renderTips() {\n const tips = TIPS[AppState.config.type] || TIPS.Behavioral;\n const ul = $(\"tips-list\");\n ul.innerHTML = \"\";\n tips.forEach((t) => {\n const li = document.createElement(\"li\");\n li.textContent = t;\n ul.appendChild(li);\n });\n}\n\nconst TYPE_EMOJI = {\n Technical: \"💻\",\n Behavioral: \"🗣️\",\n \"System Design\": \"🏗️\",\n HR: \"👔\",\n};\n\nfunction renderCurrentQuestion() {\n const q = AppState.questions[AppState.currentIndex];\n if (!q) { finishSession(); return; }\n\n // Progress\n const total = AppState.questions.length;\n const num = AppState.currentIndex + 1;\n $(\"progress-label\").textContent = `Question ${num} of ${total}`;\n const pct = Math.round((num / total) * 100);\n $(\"progress-percent\").textContent = `${pct}%`;\n $(\"progress-fill\").style.width = `${pct}%`;\n\n // Badges\n $(\"type-badge\").textContent = `${TYPE_EMOJI[AppState.config.type] || \"❓\"} ${AppState.config.type}`;\n const diffEl = $(\"difficulty-badge\");\n diffEl.textContent = (q.difficulty || \"medium\").replace(/^./, (c) => c.toUpperCase());\n diffEl.className = `difficulty-badge ${(q.difficulty || \"medium\").toLowerCase()}`;\n\n // Question with typewriter effect\n typewrite($(\"question-text\"), q.question);\n\n // Reset answer area\n const ta = $(\"answer-input\");\n ta.value = \"\";\n ta.dataset.confirmed = \"\";\n $(\"char-count\").textContent = \"0\";\n $(\"hint-box\").style.display = \"none\";\n $(\"hint-box\").textContent = \"\";\n\n // Stop any voice\n if (AppState.isListening) stopVoiceInput();\n\n // Timer\n setupTimer();\n}\n\nfunction typewrite(el, text) {\n el.textContent = \"\";\n el.classList.add(\"typing\");\n let i = 0;\n const step = () => {\n if (i >= text.length) {\n el.classList.remove(\"typing\");\n return;\n }\n el.textContent = text.slice(0, i + 1);\n i++;\n setTimeout(step, 18);\n };\n step();\n}\n\nfunction setupTimer() {\n const sec = AppState.config.timerDuration;\n const card = $(\"timer-card\");\n if (!sec || sec <= 0) {\n card.style.display = \"none\";\n return;\n }\n card.style.display = \"flex\";\n startTimer(sec);\n}\n\nfunction startTimer(seconds) {\n AppState.timerSeconds = seconds;\n clearInterval(AppState.timerInterval);\n\n const timerEl = $(\"timer-display\");\n const timerCard = $(\"timer-card\");\n const timerCircle = $(\"timer-circle\");\n const totalDash = 2 * Math.PI * 28;\n timerCircle.style.strokeDasharray = totalDash;\n timerCircle.style.strokeDashoffset = 0;\n timerEl.classList.remove(\"timer-danger\");\n timerCard.classList.remove(\"timer-danger\");\n\n const render = () => {\n const mins = Math.floor(AppState.timerSeconds / 60);\n const secs = AppState.timerSeconds % 60;\n timerEl.textContent = `${mins}:${secs.toString().padStart(2, \"0\")}`;\n const progress = AppState.timerSeconds / seconds;\n timerCircle.style.strokeDashoffset = totalDash * (1 - progress);\n if (AppState.timerSeconds <= 15) {\n timerEl.classList.add(\"timer-danger\");\n timerCard.classList.add(\"timer-danger\");\n }\n };\n render();\n\n AppState.timerInterval = setInterval(() => {\n AppState.timerSeconds--;\n render();\n if (AppState.timerSeconds <= 0) {\n clearInterval(AppState.timerInterval);\n showToast(\"Time's up! Submitting your answer...\", \"warning\");\n setTimeout(onSubmitAnswer, 1200);\n }\n }, 1000);\n}\n\nfunction stopTimer() {\n clearInterval(AppState.timerInterval);\n}\n\nfunction updateStats() {\n $(\"stat-avg\").textContent = AppState.avgScore || \"—\";\n const answered = AppState.feedbacks.filter((f) => f).length;\n const skipped = AppState.answers.filter((a) => a === null).length;\n $(\"stat-answered\").textContent = answered;\n $(\"stat-skipped\").textContent = skipped;\n $(\"stat-remaining\").textContent = Math.max(0, AppState.questions.length - AppState.currentIndex);\n}\n\nfunction initInterviewScreen() {\n const ta = $(\"answer-input\");\n ta.addEventListener(\"input\", () => {\n $(\"char-count\").textContent = ta.value.length;\n autoResize(ta);\n });\n\n $(\"btn-submit\").addEventListener(\"click\", onSubmitAnswer);\n $(\"btn-skip\").addEventListener(\"click\", onSkipQuestion);\n $(\"btn-hint\").addEventListener(\"click\", onShowHint);\n $(\"btn-voice\").addEventListener(\"click\", toggleVoiceInput);\n}\n\nfunction autoResize(ta) {\n ta.style.height = \"auto\";\n ta.style.height = Math.min(ta.scrollHeight, 480) + \"px\";\n}\n\nasync function onSubmitAnswer() {\n const ta = $(\"answer-input\");\n const answer = ta.value.trim();\n if (!answer) {\n showToast(\"Write an answer first, or skip the question.\", \"warning\");\n return;\n }\n stopTimer();\n AppState.answers[AppState.currentIndex] = answer;\n saveSession();\n AppState.abortController = new AbortController();\n showLoading(\"Evaluating your answer...\");\n\n try {\n const q = AppState.questions[AppState.currentIndex];\n const messages = [\n { role: \"system\", content: \"You are a strict but fair senior interviewer. Always return valid JSON only.\" },\n { role: \"user\", content: FEEDBACK_PROMPT(q.question, answer, AppState.config.type, AppState.config.jobTitle) },\n ];\n const fb = await callAIJSON(messages, AppState.abortController.signal);\n AppState.feedbacks[AppState.currentIndex] = normalizeFeedback(fb);\n saveSession();\n hideLoading();\n renderFeedback();\n } catch (err) {\n hideLoading();\n if (err.name === \"AbortError\") return;\n console.error(err);\n showToast(\"Failed to evaluate. \" + err.message, \"danger\");\n }\n}\n\nfunction normalizeFeedback(fb) {\n const s = fb.scores || {};\n const clamp = (n) => {\n const v = Math.round(Number(n));\n if (isNaN(v)) return 5;\n return Math.max(1, Math.min(10, v));\n };\n return {\n scores: {\n clarity: clamp(s.clarity),\n depth: clamp(s.depth),\n relevance: clamp(s.relevance),\n star_structure: clamp(s.star_structure ?? s.structure),\n },\n overall: typeof fb.overall === \"number\"\n ? fb.overall\n : parseFloat((( clamp(s.clarity) + clamp(s.depth) + clamp(s.relevance) + clamp(s.star_structure ?? s.structure) ) / 4).toFixed(1)),\n strengths: Array.isArray(fb.strengths) ? fb.strengths.slice(0, 3) : [],\n improvements: Array.isArray(fb.improvements) ? fb.improvements.slice(0, 3) : [],\n tip: fb.tip || \"\",\n model_answer: fb.model_answer || \"\",\n };\n}\n\nfunction onSkipQuestion() {\n stopTimer();\n AppState.answers[AppState.currentIndex] = null;\n AppState.feedbacks[AppState.currentIndex] = null;\n saveSession();\n advanceQuestion();\n}\n\nfunction onShowHint() {\n const q = AppState.questions[AppState.currentIndex];\n if (!q?.hint) {\n showToast(\"No hint available for this question.\", \"info\");\n return;\n }\n const box = $(\"hint-box\");\n box.textContent = `💡 ${q.hint}`;\n box.style.display = \"block\";\n}\n\nfunction advanceQuestion() {\n AppState.currentIndex++;\n if (AppState.currentIndex >= AppState.questions.length) {\n finishSession();\n } else {\n renderCurrentQuestion();\n updateStats();\n showScreen(\"interview\");\n }\n}\n\n// ----- Feedback screen ------------------------------------------------------\n\nfunction renderFeedback() {\n const idx = AppState.currentIndex;\n const q = AppState.questions[idx];\n const fb = AppState.feedbacks[idx];\n if (!fb) return;\n\n $(\"feedback-question-preview\").textContent = `Q${idx + 1}: ${q.question}`;\n\n // Score numbers + bars (animated)\n animateScore(\"score-clarity\", \"bar-clarity\", fb.scores.clarity);\n animateScore(\"score-depth\", \"bar-depth\", fb.scores.depth);\n animateScore(\"score-relevance\", \"bar-relevance\", fb.scores.relevance);\n animateScore(\"score-structure\", \"bar-structure\", fb.scores.star_structure);\n\n // Structure label (rename for non-behavioral)\n $(\"structure-label\").textContent =\n AppState.config.type === \"Behavioral\" ? \"STAR\" : \"Structure\";\n\n // Overall\n const overallEl = $(\"overall-value\");\n overallEl.classList.remove(\"good\", \"ok\", \"bad\");\n const o = fb.overall;\n overallEl.classList.add(o >= 8 ? \"good\" : o >= 5 ? \"ok\" : \"bad\");\n animateCount(overallEl, 0, o, 900, 1);\n\n // Strengths\n const sUl = $(\"strengths-list\");\n sUl.innerHTML = \"\";\n fb.strengths.forEach((s) => {\n const li = document.createElement(\"li\");\n li.textContent = s;\n sUl.appendChild(li);\n });\n\n const iUl = $(\"improvements-list\");\n iUl.innerHTML = \"\";\n fb.improvements.forEach((s) => {\n const li = document.createElement(\"li\");\n li.textContent = s;\n iUl.appendChild(li);\n });\n\n $(\"tip-text\").textContent = fb.tip;\n $(\"model-answer-text\").textContent = fb.model_answer;\n\n updateStats();\n showScreen(\"feedback\");\n}\n\nfunction animateScore(numId, barId, value) {\n const numEl = $(numId);\n const barEl = $(barId);\n animateCount(numEl, 0, value, 700, 0);\n barEl.style.width = \"0%\";\n setTimeout(() => {\n barEl.style.width = `${(value / 10) * 100}%`;\n }, 50);\n}\n\nfunction animateCount(el, from, to, ms, decimals) {\n const start = performance.now();\n const tick = (now) => {\n const t = Math.min(1, (now - start) / ms);\n const eased = 1 - Math.pow(1 - t, 3); // ease-out cubic\n const v = from + (to - from) * eased;\n el.textContent = decimals ? v.toFixed(decimals) : Math.round(v).toString();\n if (t < 1) requestAnimationFrame(tick);\n else el.textContent = decimals ? Number(to).toFixed(decimals) : String(to);\n };\n requestAnimationFrame(tick);\n}\n\nfunction initFeedbackScreen() {\n $(\"btn-next\").addEventListener(\"click\", () => advanceQuestion());\n $(\"btn-retry\").addEventListener(\"click\", () => {\n // Same question, reset answer + feedback\n AppState.answers[AppState.currentIndex] = undefined;\n AppState.feedbacks[AppState.currentIndex] = null;\n saveSession();\n showScreen(\"interview\");\n renderCurrentQuestion();\n });\n $(\"btn-copy-model\").addEventListener(\"click\", () => {\n const text = $(\"model-answer-text\").textContent;\n navigator.clipboard.writeText(text).then(\n () => showToast(\"Copied model answer to clipboard.\", \"success\"),\n () => showToast(\"Copy failed.\", \"danger\"),\n );\n });\n}\n\n// ----- Voice input ----------------------------------------------------------\n\nfunction toggleVoiceInput() {\n if (AppState.isListening) stopVoiceInput();\n else initVoiceInput($(\"answer-input\"));\n}\n\nfunction initVoiceInput(textarea) {\n const SR = window.SpeechRecognition || window.webkitSpeechRecognition;\n if (!SR) {\n showToast(\"Voice input not supported. Try Chrome.\", \"warning\");\n return;\n }\n const recognition = new SR();\n recognition.continuous = true;\n recognition.interimResults = true;\n recognition.lang = \"en-US\";\n\n recognition.onresult = (event) => {\n let interim = \"\";\n let finalText = \"\";\n for (let i = event.resultIndex; i < event.results.length; i++) {\n const t = event.results[i][0].transcript;\n if (event.results[i].isFinal) finalText += t + \" \";\n else interim += t;\n }\n const baseline = textarea.dataset.confirmed || \"\";\n if (finalText) {\n textarea.dataset.confirmed = baseline + finalText;\n textarea.value = textarea.dataset.confirmed + interim;\n } else {\n textarea.value = baseline + interim;\n }\n $(\"char-count\").textContent = textarea.value.length;\n autoResize(textarea);\n };\n\n recognition.onerror = (event) => {\n showToast(\"Microphone error: \" + event.error, \"danger\");\n stopVoiceInput();\n };\n recognition.onend = () => {\n AppState.isListening = false;\n updateVoiceButton(false);\n };\n\n AppState.recognition = recognition;\n try { recognition.start(); } catch (e) { showToast(\"Voice start failed.\", \"danger\"); return; }\n AppState.isListening = true;\n updateVoiceButton(true);\n}\n\nfunction stopVoiceInput() {\n try { AppState.recognition?.stop(); } catch {}\n AppState.isListening = false;\n updateVoiceButton(false);\n}\n\nfunction updateVoiceButton(active) {\n const btn = $(\"btn-voice\");\n const label = $(\"voice-label\");\n if (active) {\n btn.classList.add(\"listening\");\n label.textContent = \"Listening...\";\n } else {\n btn.classList.remove(\"listening\");\n label.textContent = \"Voice\";\n }\n}\n\n// ----- Results screen -------------------------------------------------------\n\nasync function finishSession() {\n stopTimer();\n showScreen(\"results\");\n renderResults();\n // Fire recommendations in background\n fetchRecommendations();\n}\n\nfunction renderResults() {\n const total = AppState.questions.length;\n const scored = AppState.feedbacks.filter((f) => f);\n const avg = scored.length\n ? scored.reduce((a, f) => a + f.overall, 0) / scored.length\n : 0;\n\n const heroScore = $(\"hero-score\");\n heroScore.classList.remove(\"good\", \"ok\", \"bad\");\n heroScore.classList.add(avg >= 8 ? \"good\" : avg >= 5 ? \"ok\" : \"bad\");\n animateCount(heroScore, 0, avg, 1200, 1);\n\n $(\"hero-label\").textContent =\n avg >= 8 ? \"Excellent!\" : avg >= 6 ? \"Good Job!\" : avg >= 4 ? \"Solid Effort\" : \"Keep Practicing\";\n\n // Stats\n $(\"hero-total\").textContent = total;\n $(\"hero-avg\").textContent = avg.toFixed(1);\n\n // Best / weakest topic\n let best = null;\n let weak = null;\n AppState.feedbacks.forEach((fb, i) => {\n if (!fb) return;\n const q = AppState.questions[i];\n if (!best || fb.overall > best.s) best = { s: fb.overall, q };\n if (!weak || fb.overall < weak.s) weak = { s: fb.overall, q };\n });\n $(\"hero-best\").textContent = best ? truncate(best.q.question, 40) : \"—\";\n $(\"hero-weakest\").textContent = weak ? truncate(weak.q.question, 40) : \"—\";\n\n // Radar chart\n drawRadarChart(\"radar-chart\", computeAverageScores());\n\n // Q-by-Q table\n renderQTable();\n}\n\nfunction truncate(s, n) {\n return s.length > n ? s.slice(0, n - 1) + \"…\" : s;\n}\n\nfunction computeAverageScores() {\n const fbs = AppState.feedbacks.filter((f) => f);\n if (!fbs.length) return { clarity: 0, depth: 0, relevance: 0, star_structure: 0 };\n const sum = { clarity: 0, depth: 0, relevance: 0, star_structure: 0 };\n fbs.forEach((f) => {\n sum.clarity += f.scores.clarity;\n sum.depth += f.scores.depth;\n sum.relevance += f.scores.relevance;\n sum.star_structure += f.scores.star_structure;\n });\n return {\n clarity: +(sum.clarity / fbs.length).toFixed(1),\n depth: +(sum.depth / fbs.length).toFixed(1),\n relevance: +(sum.relevance / fbs.length).toFixed(1),\n star_structure: +(sum.star_structure / fbs.length).toFixed(1),\n };\n}\n\nfunction drawRadarChart(canvasId, scores) {\n const canvas = $(canvasId);\n if (!canvas) return;\n const ctx = canvas.getContext(\"2d\");\n const cx = canvas.width / 2;\n const cy = canvas.height / 2;\n const radius = Math.min(cx, cy) - 50;\n const labels = [\"Clarity\", \"Depth\", \"Relevance\", \"Structure\"];\n const values = [scores.clarity, scores.depth, scores.relevance, scores.star_structure];\n const max = 10;\n const sides = 4;\n const angleStep = (Math.PI * 2) / sides;\n\n ctx.clearRect(0, 0, canvas.width, canvas.height);\n\n // Grid\n for (let r = 1; r <= 5; r++) {\n ctx.beginPath();\n for (let i = 0; i < sides; i++) {\n const angle = i * angleStep - Math.PI / 2;\n const x = cx + (radius * r / 5) * Math.cos(angle);\n const y = cy + (radius * r / 5) * Math.sin(angle);\n i === 0 ? ctx.moveTo(x, y) : ctx.lineTo(x, y);\n }\n ctx.closePath();\n ctx.strokeStyle = \"rgba(255,255,255,0.08)\";\n ctx.lineWidth = 1;\n ctx.stroke();\n }\n\n // Axes\n for (let i = 0; i < sides; i++) {\n const angle = i * angleStep - Math.PI / 2;\n ctx.beginPath();\n ctx.moveTo(cx, cy);\n ctx.lineTo(cx + radius * Math.cos(angle), cy + radius * Math.sin(angle));\n ctx.strokeStyle = \"rgba(255,255,255,0.12)\";\n ctx.lineWidth = 1;\n ctx.stroke();\n }\n\n // Data polygon\n ctx.beginPath();\n for (let i = 0; i < sides; i++) {\n const angle = i * angleStep - Math.PI / 2;\n const r = (values[i] / max) * radius;\n const x = cx + r * Math.cos(angle);\n const y = cy + r * Math.sin(angle);\n i === 0 ? ctx.moveTo(x, y) : ctx.lineTo(x, y);\n }\n ctx.closePath();\n ctx.fillStyle = \"rgba(99, 102, 241, 0.28)\";\n ctx.fill();\n ctx.strokeStyle = \"#6366f1\";\n ctx.lineWidth = 2;\n ctx.stroke();\n\n // Dots + labels\n for (let i = 0; i < sides; i++) {\n const angle = i * angleStep - Math.PI / 2;\n const r = (values[i] / max) * radius;\n const x = cx + r * Math.cos(angle);\n const y = cy + r * Math.sin(angle);\n ctx.beginPath();\n ctx.arc(x, y, 4, 0, Math.PI * 2);\n ctx.fillStyle = \"#6366f1\";\n ctx.fill();\n\n const lx = cx + (radius + 28) * Math.cos(angle);\n const ly = cy + (radius + 28) * Math.sin(angle);\n ctx.font = \"600 12px 'DM Sans', sans-serif\";\n ctx.fillStyle = \"#94a3b8\";\n ctx.textAlign = \"center\";\n ctx.textBaseline = \"middle\";\n ctx.fillText(`${labels[i]} (${values[i]})`, lx, ly);\n }\n}\n\nfunction renderQTable() {\n const tbody = $(\"q-table-body\");\n tbody.innerHTML = \"\";\n AppState.questions.forEach((q, i) => {\n const fb = AppState.feedbacks[i];\n const ans = AppState.answers[i];\n const tr = document.createElement(\"tr\");\n tr.className = \"q-row\";\n\n const scoreCls = fb\n ? fb.overall >= 8 ? \"good\" : fb.overall >= 5 ? \"ok\" : \"bad\"\n : \"skip\";\n const scoreText = fb ? fb.overall.toFixed(1) : \"—\";\n const status = ans === null\n ? \"Skipped\"\n : fb\n ? \"Answered\"\n : \"Unanswered\";\n\n tr.innerHTML = `\n ${i + 1}\n ${escapeHtml(truncate(q.question, 80))}\n ${scoreText}\n ${escapeHtml(q.difficulty)}\n ${status}\n `;\n tr.addEventListener(\"click\", () => toggleRowExpand(tr, i));\n tbody.appendChild(tr);\n });\n}\n\nfunction toggleRowExpand(row, i) {\n const next = row.nextElementSibling;\n if (next?.classList.contains(\"expanded-row\")) {\n next.remove();\n return;\n }\n // Remove any other expanded rows\n $$(\".expanded-row\").forEach((r) => r.remove());\n\n const fb = AppState.feedbacks[i];\n const ans = AppState.answers[i];\n const tr = document.createElement(\"tr\");\n tr.className = \"expanded-row\";\n const td = document.createElement(\"td\");\n td.colSpan = 5;\n if (fb) {\n td.innerHTML = `\n Your Answer:
${escapeHtml(ans || \"(empty)\")}

\n Scores: C ${fb.scores.clarity} · D ${fb.scores.depth} · R ${fb.scores.relevance} · S ${fb.scores.star_structure}
\n Tip: ${escapeHtml(fb.tip)}

\n Model Answer:
${escapeHtml(fb.model_answer)}\n `;\n } else {\n td.innerHTML = `${ans === null ? \"Skipped.\" : \"Not answered.\"}`;\n }\n tr.appendChild(td);\n row.after(tr);\n}\n\nfunction escapeHtml(s) {\n return String(s ?? \"\")\n .replace(/&/g, \"&\")\n .replace(//g, \">\")\n .replace(/\"/g, \""\");\n}\n\nasync function fetchRecommendations() {\n const fbs = AppState.feedbacks.filter((f) => f);\n if (!fbs.length) {\n $(\"recommendations-list\").innerHTML = `

No answered questions to analyze.

`;\n return;\n }\n const avgs = computeAverageScores();\n const weak = AppState.questions\n .map((q, i) => ({ q, fb: AppState.feedbacks[i] }))\n .filter(({ fb }) => fb && fb.overall < 6)\n .map(({ q }) => truncate(q.question, 60));\n const overall = (fbs.reduce((a, f) => a + f.overall, 0) / fbs.length).toFixed(1);\n\n AppState.abortController = new AbortController();\n try {\n const messages = [\n { role: \"system\", content: \"You are an interview coach. Always return valid JSON only.\" },\n { role: \"user\", content: RECOMMENDATIONS_PROMPT({\n jobTitle: AppState.config.jobTitle,\n type: AppState.config.type,\n avgClarity: avgs.clarity,\n avgDepth: avgs.depth,\n avgRelevance: avgs.relevance,\n avgStructure: avgs.star_structure,\n weakQuestions: weak,\n overallAvg: overall,\n }) },\n ];\n const recs = await callAIJSON(messages, AppState.abortController.signal);\n renderRecommendations(Array.isArray(recs) ? recs : (recs.recommendations || []));\n } catch (err) {\n console.error(err);\n $(\"recommendations-list\").innerHTML = `

Could not load recommendations.

`;\n }\n}\n\nfunction renderRecommendations(recs) {\n const wrap = $(\"recommendations-list\");\n wrap.innerHTML = \"\";\n if (!recs.length) {\n wrap.innerHTML = `

No recommendations available.

`;\n return;\n }\n recs.forEach((r) => {\n const div = document.createElement(\"div\");\n div.className = \"rec-item fade-in\";\n const priority = (r.priority || \"medium\").toLowerCase();\n div.innerHTML = `\n

\n ${escapeHtml(r.area || \"Focus area\")}\n ${priority}\n

${escapeHtml(r.suggestion || \"\")}

\n ${r.resource ? `

📚 ${escapeHtml(r.resource)}

` : \"\"}\n `;\n wrap.appendChild(div);\n });\n}\n\nfunction initResultsScreen() {\n $(\"btn-download\").addEventListener(\"click\", downloadReport);\n $(\"btn-copy-summary\").addEventListener(\"click\", copySummary);\n $(\"btn-new-session\").addEventListener(\"click\", () => {\n if (!confirm(\"Start a new session? Current results will be cleared.\")) return;\n resetSession();\n showScreen(\"setup\");\n });\n $(\"btn-retry-weak\").addEventListener(\"click\", retryWeakQuestions);\n}\n\nfunction downloadReport() {\n const lines = [\n \"=\".repeat(60),\n \"AI INTERVIEW COACH — SESSION REPORT\",\n \"=\".repeat(60),\n `Date: ${new Date().toLocaleString()}`,\n `Role: ${AppState.config.jobTitle}`,\n `Level: ${AppState.config.level}`,\n `Type: ${AppState.config.type}`,\n `Company: ${AppState.config.companyType}`,\n `Overall Score: ${AppState.avgScore}/10`,\n \"\",\n \"-\".repeat(60),\n ];\n\n AppState.questions.forEach((q, i) => {\n const fb = AppState.feedbacks[i];\n const ans = AppState.answers[i];\n lines.push(`\\nQ${i + 1} [${(q.difficulty || \"\").toUpperCase()}]: ${q.question}`);\n lines.push(`\\nYour Answer:\\n${ans || \"(Skipped)\"}`);\n if (fb) {\n lines.push(`\\nScores: Clarity ${fb.scores.clarity}/10 | Depth ${fb.scores.depth}/10 | Relevance ${fb.scores.relevance}/10 | Structure ${fb.scores.star_structure}/10`);\n lines.push(`Overall: ${fb.overall}/10`);\n lines.push(`\\nStrengths:\\n${fb.strengths.map((s) => ` • ${s}`).join(\"\\n\")}`);\n lines.push(`\\nImprovements:\\n${fb.improvements.map((s) => ` • ${s}`).join(\"\\n\")}`);\n lines.push(`\\nTip: ${fb.tip}`);\n lines.push(`\\nModel Answer:\\n${fb.model_answer}`);\n }\n lines.push(\"\\n\" + \"-\".repeat(60));\n });\n\n const blob = new Blob([lines.join(\"\\n\")], { type: \"text/plain\" });\n const url = URL.createObjectURL(blob);\n const a = document.createElement(\"a\");\n a.href = url;\n a.download = `interview-report-${Date.now()}.txt`;\n document.body.appendChild(a);\n a.click();\n a.remove();\n URL.revokeObjectURL(url);\n showToast(\"Report downloaded.\", \"success\");\n}\n\nfunction copySummary() {\n const avgs = computeAverageScores();\n const summary = [\n `📊 Interview Coach Summary`,\n `Role: ${AppState.config.jobTitle} (${AppState.config.level}, ${AppState.config.type})`,\n `Overall: ${AppState.avgScore}/10 across ${AppState.questions.length} questions`,\n `Breakdown: Clarity ${avgs.clarity} · Depth ${avgs.depth} · Relevance ${avgs.relevance} · Structure ${avgs.star_structure}`,\n ].join(\"\\n\");\n navigator.clipboard.writeText(summary).then(\n () => showToast(\"Summary copied!\", \"success\"),\n () => showToast(\"Copy failed.\", \"danger\"),\n );\n}\n\nfunction retryWeakQuestions() {\n const weakIdx = AppState.feedbacks\n .map((f, i) => ({ f, i }))\n .filter(({ f }) => f && f.overall < 6)\n .map(({ i }) => i);\n if (!weakIdx.length) {\n showToast(\"No weak questions to retry — nice work!\", \"success\");\n return;\n }\n const weakQs = weakIdx.map((i) => AppState.questions[i]);\n AppState.questions = weakQs;\n AppState.answers = [];\n AppState.feedbacks = [];\n AppState.currentIndex = 0;\n AppState.sessionStartTime = Date.now();\n saveSession();\n enterInterviewScreen();\n}\n\nfunction resetSession() {\n clearSession();\n AppState.questions = [];\n AppState.answers = [];\n AppState.feedbacks = [];\n AppState.currentIndex = 0;\n AppState.sessionStartTime = null;\n AppState.config.jobTitle = \"\";\n $(\"input-job-title\").value = \"\";\n $(\"input-question-count\").value = 10;\n $(\"question-count-value\").textContent = \"10\";\n $(\"select-timer\").value = \"0\";\n $(\"select-company\").value = \"Any\";\n AppState.config = {\n jobTitle: \"\",\n level: \"Mid-Level\",\n type: \"Behavioral\",\n companyType: \"Any\",\n totalQuestions: 10,\n timerDuration: 0,\n };\n // Reset chip groups\n $$(`[data-group=\"level\"] button`).forEach((b) => {\n b.classList.toggle(\"active\", b.dataset.value === \"Mid-Level\");\n });\n $$(`[data-group=\"type\"] button`).forEach((b) => {\n b.classList.toggle(\"active\", b.dataset.value === \"Behavioral\");\n });\n}\n\n// ----- Init -----------------------------------------------------------------\n\nfunction init() {\n initSetupScreen();\n initInterviewScreen();\n initFeedbackScreen();\n initResultsScreen();\n\n $(\"loading-cancel\").addEventListener(\"click\", cancelRequest);\n\n // Restore in-progress session\n if (loadSession() && AppState.questions.length && AppState.currentIndex < AppState.questions.length) {\n showToast(\"Resumed previous session.\", \"info\");\n enterInterviewScreen();\n } else {\n showScreen(\"setup\");\n }\n}\n\ndocument.addEventListener(\"DOMContentLoaded\", init);\n",[169],"b6204226-51f9-11f1-b2ea-ee650bb23af1","README.md","019e363c-6c13-7621-bfd9-8a5fc12fb00b",["D",1779026836937],"# 🤖 AI Interview Coach\n\nSimulate real interview sessions, get AI-scored feedback, and improve fast.\n\nBuilt on [Val Town](https://val.town) — runs in your browser, powered by [OpenRouter](https://openrouter.ai) free models.\n\n## Features\n\n- **5 dynamic screens** — Setup → Interview → Feedback → Results, with a global loading overlay\n- **4 interview modes** — Technical, Behavioral, System Design, HR\n- **AI-generated questions** matched to job title, level, and company type\n- **Per-answer scoring** across Clarity, Depth, Relevance, and Structure\n- **Strengths, improvements, coaching tip, and model answer** for every question\n- **Voice input** via the Web Speech API (Chrome)\n- **Optional countdown timer** with circular SVG progress indicator\n- **Hints, skips, and retries** during the session\n- **Session results page** with radar chart, expandable per-question table, and personalized recommendations\n- **Export** session report as `.txt` or copy summary to clipboard\n- **Retry weak questions** to drill the ones you scored lowest on\n- **Auto-resume** an in-progress session on accidental refresh (via `sessionStorage`)\n- **Dark professional theme** with smooth animations, no frameworks\n\n## Architecture\n\n```mermaid\nflowchart LR\n Browser[\"Browser
(index.html + app.js)\"]\n Backend[\"Val Town
main.tsx (Hono)\"]\n OpenRouter[\"OpenRouter API
openrouter/free\"]\n\n Browser -- \"POST /api/ai (messages)\" --> Backend\n Backend -- \"Bearer + body\" --> OpenRouter\n OpenRouter -- \"JSON / SSE stream\" --> Backend\n Backend -- \"JSON / SSE stream\" --> Browser\n```\n\nThe OpenRouter API key is held **only on the server** as the `OPENROUTER_API_KEY`\nenv var — it is never sent to the browser. All AI calls go through `/api/ai`.\n\n## File structure\n\n| File | Role |\n|--------------|---------------------------------------------------------------|\n| `main.tsx` | Hono HTTP server. Hosts static files and the `/api/ai` proxy. |\n| `index.html` | Markup for all four screens + loading overlay. |\n| `styles.css` | Design system, dark theme, animations, responsive layout. |\n| `app.js` | Client logic: state, screens, API calls, voice, timer, radar. |\n| `favicon.svg`| App favicon. |\n\n## Configuration\n\nSet the env var on your val:\n\n| Key | Description |\n|----------------------|------------------------------------------|\n| `OPENROUTER_API_KEY` | Your OpenRouter API key (already configured) |\n\nThe model is `openrouter/free` — OpenRouter's auto-router for free models —\nwhich survives individual model deprecations.\n\n## How it works\n\n1. **Setup screen** — user picks job title, level, type, timer, etc.\n2. **Question generation** — `/api/ai` is called once with a prompt asking for a\n JSON array of N questions. The client parses the JSON (with markdown-fence\n stripping fallback) and stores it in `AppState.questions`.\n3. **Interview screen** — for each question the user types or speaks an answer.\n4. **Per-answer evaluation** — on submit, `/api/ai` is called with a scoring\n prompt; the JSON response feeds the Feedback screen with animated bars and a\n color-coded overall score.\n5. **Session results** — after the last question, a radar chart is drawn from\n the average sub-scores, the per-question table is rendered, and a final\n recommendations call generates 5 study tips.\n\n## Notes\n\n- Free-tier OpenRouter models have rate limits (~200 requests/day on\n unfunded accounts). Heavy testing may exhaust the quota.\n- Voice input requires Chromium-based browsers.\n- WebSockets aren't supported on Val Town — all communication is HTTP.\n\n[View source](/source)\n",[177],"pulls","branches","forks","envVars",{"_189":159,"_191":42},"connections",{"_189":42,"_190":42},"count","unfilledCount","emptyCount",{"_18":176,"_20":177,"_133":178,"_135":-5,"_136":68,"_137":66,"_139":38,"_22":214,"_65":159,"_141":101,"_142":180,"_144":26,"_145":-5,"_199":215,"_90":216},{"_18":168,"_20":169,"_133":170,"_135":-5,"_136":68,"_137":171,"_139":38,"_22":211,"_65":42,"_141":173,"_142":174,"_144":26,"_145":-5,"_199":212,"_90":213},{"_18":162,"_20":163,"_133":164,"_135":-5,"_136":68,"_137":159,"_139":38,"_22":208,"_65":42,"_141":101,"_142":166,"_144":26,"_145":-5,"_199":209,"_90":210},{"_18":155,"_20":156,"_133":157,"_135":-5,"_136":68,"_137":151,"_139":38,"_22":205,"_65":159,"_141":101,"_142":160,"_144":26,"_145":-5,"_199":206,"_90":207},{"_18":147,"_20":148,"_133":36,"_135":-5,"_136":68,"_137":149,"_139":38,"_22":202,"_65":151,"_141":152,"_142":153,"_144":26,"_145":-5,"_199":203,"_90":204},{"_18":131,"_20":132,"_133":134,"_135":-5,"_136":68,"_137":138,"_139":38,"_22":198,"_65":42,"_141":101,"_142":143,"_144":26,"_145":-5,"_199":200,"_90":201},["D",1779026550887],"children",[],[132],["D",1779026785199],[],[148],["D",1779026460816],[],[156],["D",1779026389980],[],[163],["D",1779026709540],[],[169],["D",1779026836937],[],[177],["D",1779026389980],{"_16":17,"_88":84},{"_16":17,"_81":82,"_83":84,"_33":34,"_85":86,"_87":26},{"_65":66,"_20":67,"_18":68,"_69":19,"_70":71,"_72":73,"_74":28,"_75":76,"_77":78,"_79":21,"_80":17},"ctx",{"_58":-5,"_111":254,"_255":256,"_257":258,"_259":26,"_260":26,"_261":26,"_262":38,"_263":-5,"_264":-7,"_265":-7,"_266":42,"_267":26,"_268":26,"_269":-5,"_270":26,"_271":26,"_272":26,"_273":-5},"ENV",{"_225":226,"_227":228,"_229":67,"_230":231,"_232":233,"_234":235,"_236":237,"_238":239,"_240":241,"_242":243,"_244":245,"_246":247,"_248":249,"_250":251,"_252":253},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

AI Interview Coach

Feedback

✅ Strengths

↗ Improvements

Session Complete

Performance Breakdown

Question-by-Question

Recommendations

Search