[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_221":222,"_223":224},"routes/_app.x.$handle.$name",{"_104":103,"_37":48,"_113":90,"_32":114,"_13":14,"_115":-5,"_11":116,"_117":118,"_119":120,"_121":122,"_123":124,"_26":-5,"_125":126,"_127":128,"_129":30,"_130":131,"_132":62,"_133":-5,"_134":-5,"_135":136},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":18,"_19":-5},"project",{"_46":47,"_37":48,"_41":49,"_50":-5,"_51":30,"_52":53,"_54":53,"_55":56,"_57":-5,"_19":58,"_59":60,"_61":62,"_63":-5,"_64":-5,"_65":66,"_67":68,"_69":-5,"_70":-5,"_71":-5,"_72":-5,"_73":74,"_75":74,"_76":77,"_78":77,"_79":77,"_80":74,"_81":74,"_82":83,"_84":85,"_86":87,"_88":30},"version",6,"changes",[25],"aiChatInfo",{"_20":21,"_22":-5,"_23":-5,"_24":-5},"userId","aiChatMessageId","0ae5c615-1e12-4290-a5da-d8bcdc627e4a","aiChatThreadId","aiChatThreadUserId","aiChatThreadTitle",{"_26":27,"_28":-7,"_29":30,"_31":30,"_32":33,"_34":33},"file",{"_35":36,"_37":33,"_38":26,"_39":40,"_41":42,"_43":14,"_44":45,"_29":30},"previous","deleted",false,"deletedHere","path","styles.css","latestPath","fileId","0ba02a28-51f9-11f1-bf17-ee650bb23af1","name","fileType","content","/* ==========================================================================\n AI Interview Coach — Styles\n Dark professional theme · DM Sans · animations · responsive\n ========================================================================== */\n\n:root {\n --bg: #0f1117;\n --surface: #1a1d2e;\n --surface2: #242840;\n --surface3: #2c3050;\n --accent: #6366f1;\n --accent-2: #818cf8;\n --accent-glow: rgba(99, 102, 241, 0.15);\n --success: #10b981;\n --warning: #f59e0b;\n --danger: #ef4444;\n --text: #e2e8f0;\n --text-muted: #94a3b8;\n --text-dim: #64748b;\n --border: rgba(255, 255, 255, 0.08);\n --border-strong: rgba(255, 255, 255, 0.16);\n --radius: 12px;\n --radius-sm: 8px;\n --radius-lg: 16px;\n --shadow: 0 8px 32px rgba(0, 0, 0, 0.35);\n}\n\n*,\n*::before,\n*::after { box-sizing: border-box; }\n\nhtml,\nbody {\n margin: 0;\n padding: 0;\n background: var(--bg);\n color: var(--text);\n font-family: \"DM Sans\", -apple-system, system-ui, sans-serif;\n font-size: 16px;\n line-height: 1.5;\n min-height: 100vh;\n}\n\nbody {\n background:\n radial-gradient(1200px 600px at 10% -10%, rgba(99,102,241,0.10), transparent 60%),\n radial-gradient(800px 500px at 100% 100%, rgba(129,140,248,0.06), transparent 60%),\n var(--bg);\n}\n\nh1, h2, h3, h4 { margin: 0; font-weight: 600; letter-spacing: -0.01em; }\nh1 { font-size: 2.25rem; }\nh2 { font-size: 1.75rem; }\nh4 { font-size: 1rem; color: var(--text); margin-bottom: 12px; }\np { margin: 0; }\na { color: var(--accent-2); text-decoration: none; }\na:hover { text-decoration: underline; }\nul { padding: 0; margin: 0; list-style: none; }\n\n/* ----- Layout ----- */\n.screen { display: none; min-height: 100vh; padding: 32px 0 80px; }\n.screen.active { display: block; }\n.container { max-width: 1100px; margin: 0 auto; padding: 0 24px; }\n\n/* ----- Buttons ----- */\n.btn {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 8px;\n padding: 12px 20px;\n border-radius: var(--radius-sm);\n border: 1px solid var(--border);\n background: var(--surface2);\n color: var(--text);\n font-family: inherit;\n font-size: 0.95rem;\n font-weight: 500;\n cursor: pointer;\n transition: all 0.15s ease;\n}\n.btn:hover { background: var(--surface3); border-color: var(--border-strong); }\n.btn:active { transform: translateY(1px); }\n.btn:disabled { opacity: 0.5; cursor: not-allowed; }\n\n.btn-primary {\n background: var(--accent);\n border-color: var(--accent);\n color: white;\n box-shadow: 0 4px 14px var(--accent-glow);\n}\n.btn-primary:hover { background: var(--accent-2); border-color: var(--accent-2); }\n\n.btn-ghost {\n background: transparent;\n border-color: var(--border-strong);\n}\n.btn-ghost:hover { background: rgba(255,255,255,0.04); }\n\n.btn-large {\n padding: 16px 24px;\n font-size: 1.05rem;\n width: 100%;\n margin-top: 8px;\n}\n.btn-small { padding: 6px 12px; font-size: 0.85rem; }\n\n.btn-icon {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 6px 12px;\n font-size: 0.85rem;\n font-family: inherit;\n background: var(--surface2);\n color: var(--text-muted);\n border: 1px solid var(--border);\n border-radius: var(--radius-sm);\n cursor: pointer;\n transition: all 0.15s ease;\n}\n.btn-icon:hover { background: var(--surface3); color: var(--text); }\n.btn-icon.listening {\n background: var(--danger);\n color: white;\n border-color: var(--danger);\n animation: pulse 1.4s infinite;\n}\n\n/* ----- Forms ----- */\n.form-group { margin-bottom: 20px; }\n.form-group label {\n display: flex;\n align-items: center;\n justify-content: space-between;\n font-size: 0.9rem;\n font-weight: 500;\n color: var(--text-muted);\n margin-bottom: 8px;\n}\n.form-row {\n display: grid;\n grid-template-columns: 1fr 1fr 1fr;\n gap: 16px;\n}\n@media (max-width: 720px) {\n .form-row { grid-template-columns: 1fr; }\n}\n\ninput[type=\"text\"],\nselect,\ntextarea {\n width: 100%;\n padding: 12px 14px;\n background: var(--surface2);\n border: 1px solid var(--border);\n border-radius: var(--radius-sm);\n color: var(--text);\n font-family: inherit;\n font-size: 0.95rem;\n transition: border-color 0.15s, box-shadow 0.15s;\n}\ninput[type=\"text\"]:focus,\nselect:focus,\ntextarea:focus {\n outline: none;\n border-color: var(--accent);\n box-shadow: 0 0 0 3px var(--accent-glow);\n}\n\nselect {\n appearance: none;\n background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2394a3b8' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E\");\n background-repeat: no-repeat;\n background-position: right 14px center;\n padding-right: 36px;\n}\n\ntextarea {\n resize: vertical;\n min-height: 140px;\n line-height: 1.55;\n}\n\ninput[type=\"range\"] {\n width: 100%;\n appearance: none;\n -webkit-appearance: none;\n background: transparent;\n margin: 8px 0;\n}\ninput[type=\"range\"]::-webkit-slider-runnable-track {\n height: 6px;\n background: var(--surface3);\n border-radius: 3px;\n}\ninput[type=\"range\"]::-webkit-slider-thumb {\n appearance: none;\n -webkit-appearance: none;\n width: 18px;\n height: 18px;\n background: var(--accent);\n border-radius: 50%;\n margin-top: -6px;\n box-shadow: 0 0 0 4px var(--accent-glow);\n cursor: pointer;\n}\ninput[type=\"range\"]::-moz-range-track {\n height: 6px;\n background: var(--surface3);\n border-radius: 3px;\n}\ninput[type=\"range\"]::-moz-range-thumb {\n width: 18px;\n height: 18px;\n background: var(--accent);\n border: none;\n border-radius: 50%;\n cursor: pointer;\n}\n\n.value-badge {\n display: inline-block;\n padding: 2px 10px;\n background: var(--accent-glow);\n color: var(--accent-2);\n border-radius: 999px;\n font-family: \"Space Mono\", monospace;\n font-size: 0.85rem;\n}\n\n/* ----- Chip / button group ----- */\n.btn-group { display: flex; gap: 8px; flex-wrap: wrap; }\n.chip {\n flex: 1;\n padding: 10px 16px;\n background: var(--surface2);\n border: 1px solid var(--border);\n border-radius: var(--radius-sm);\n color: var(--text-muted);\n cursor: pointer;\n font-family: inherit;\n font-size: 0.9rem;\n transition: all 0.15s ease;\n}\n.chip:hover { background: var(--surface3); color: var(--text); }\n.chip.active {\n background: var(--accent-glow);\n border-color: var(--accent);\n color: var(--accent-2);\n}\n\n/* ----- Interview type cards ----- */\n.type-cards {\n display: grid;\n grid-template-columns: repeat(4, 1fr);\n gap: 12px;\n}\n@media (max-width: 720px) {\n .type-cards { grid-template-columns: repeat(2, 1fr); }\n}\n.type-card {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n gap: 6px;\n padding: 16px;\n background: var(--surface2);\n border: 1px solid var(--border);\n border-radius: var(--radius);\n cursor: pointer;\n font-family: inherit;\n color: var(--text);\n text-align: left;\n transition: all 0.15s ease;\n}\n.type-card:hover {\n background: var(--surface3);\n border-color: var(--border-strong);\n transform: translateY(-1px);\n}\n.type-card.active {\n background: var(--accent-glow);\n border-color: var(--accent);\n}\n.type-icon { font-size: 1.5rem; }\n.type-title { font-weight: 600; font-size: 0.95rem; }\n.type-desc { font-size: 0.8rem; color: var(--text-muted); }\n\n/* ----- Setup screen ----- */\n.setup-header {\n text-align: center;\n margin-bottom: 32px;\n}\n.logo-block {\n display: inline-flex;\n align-items: center;\n gap: 12px;\n}\n.logo-emoji { font-size: 2rem; }\n.subtitle { color: var(--text-muted); font-size: 1.05rem; margin-top: 8px; }\n.setup-card {\n background: var(--surface);\n border: 1px solid var(--border);\n border-radius: var(--radius-lg);\n padding: 32px;\n box-shadow: var(--shadow);\n}\n.setup-footer {\n text-align: center;\n margin-top: 24px;\n font-size: 0.85rem;\n color: var(--text-dim);\n}\n\n/* ----- Cards (generic) ----- */\n.card {\n background: var(--surface);\n border: 1px solid var(--border);\n border-radius: var(--radius);\n padding: 20px;\n}\n\n/* ----- Progress bar ----- */\n.progress-bar { margin-bottom: 24px; }\n.progress-info {\n display: flex;\n justify-content: space-between;\n font-size: 0.85rem;\n color: var(--text-muted);\n margin-bottom: 8px;\n}\n.progress-track {\n width: 100%;\n height: 6px;\n background: var(--surface2);\n border-radius: 3px;\n overflow: hidden;\n}\n.progress-fill {\n height: 100%;\n background: linear-gradient(90deg, var(--accent), var(--accent-2));\n border-radius: 3px;\n transition: width 0.5s cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n/* ----- Interview layout ----- */\n.interview-layout {\n display: grid;\n grid-template-columns: 1fr 320px;\n gap: 24px;\n}\n@media (max-width: 900px) {\n .interview-layout { grid-template-columns: 1fr; }\n}\n.interview-main {\n background: var(--surface);\n border: 1px solid var(--border);\n border-radius: var(--radius-lg);\n padding: 24px;\n}\n.interview-side {\n display: flex;\n flex-direction: column;\n gap: 16px;\n}\n\n.badge-row {\n display: flex;\n gap: 8px;\n margin-bottom: 16px;\n flex-wrap: wrap;\n}\n.type-badge,\n.difficulty-badge {\n padding: 4px 12px;\n background: var(--surface2);\n border-radius: 999px;\n font-size: 0.8rem;\n color: var(--text-muted);\n}\n.difficulty-badge.easy { color: var(--success); background: rgba(16,185,129,0.12); }\n.difficulty-badge.medium { color: var(--warning); background: rgba(245,158,11,0.12); }\n.difficulty-badge.hard { color: var(--danger); background: rgba(239,68,68,0.12); }\n\n.question-box {\n background: var(--surface2);\n border-radius: var(--radius);\n padding: 24px;\n margin-bottom: 20px;\n border-left: 4px solid var(--accent);\n}\n.question-text {\n font-size: 1.15rem;\n line-height: 1.6;\n color: var(--text);\n min-height: 1.6em;\n}\n.question-text.typing::after {\n content: \"▋\";\n display: inline-block;\n color: var(--accent);\n animation: blink 1s steps(2) infinite;\n margin-left: 2px;\n}\n\n.answer-block label {\n display: block;\n font-size: 0.9rem;\n color: var(--text-muted);\n margin-bottom: 8px;\n}\n.textarea-wrap { position: relative; }\n.textarea-meta {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-top: 8px;\n font-size: 0.85rem;\n color: var(--text-muted);\n}\n.char-count { font-family: \"Space Mono\", monospace; }\n\n.actions-row {\n display: flex;\n gap: 12px;\n margin-top: 20px;\n flex-wrap: wrap;\n}\n.actions-row .btn { flex: 0 1 auto; }\n\n.hint-box {\n margin-top: 16px;\n padding: 12px 16px;\n background: rgba(245,158,11,0.08);\n border: 1px solid rgba(245,158,11,0.25);\n border-radius: var(--radius-sm);\n color: #fcd34d;\n font-size: 0.92rem;\n}\n\n/* ----- Sidebar cards ----- */\n.interviewer-card {\n display: flex;\n align-items: center;\n gap: 12px;\n}\n.avatar {\n width: 48px;\n height: 48px;\n border-radius: 50%;\n background: var(--accent-glow);\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 1.5rem;\n}\n.avatar-name { font-weight: 600; }\n.avatar-sub { font-size: 0.85rem; color: var(--text-muted); }\n\n.tips-card ul li {\n position: relative;\n padding: 6px 0 6px 18px;\n font-size: 0.88rem;\n color: var(--text-muted);\n line-height: 1.45;\n}\n.tips-card ul li::before {\n content: \"•\";\n position: absolute;\n left: 4px;\n color: var(--accent);\n}\n\n.stats-card .stat-row {\n display: flex;\n justify-content: space-between;\n padding: 6px 0;\n font-size: 0.88rem;\n color: var(--text-muted);\n border-bottom: 1px solid var(--border);\n}\n.stats-card .stat-row:last-child { border-bottom: none; }\n.stat-value {\n font-family: \"Space Mono\", monospace;\n color: var(--text);\n}\n\n/* ----- Timer ----- */\n.timer-card {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n.timer-svg {\n width: 64px;\n height: 64px;\n transform: rotate(-90deg);\n}\n.timer-track-circle {\n fill: none;\n stroke: var(--surface2);\n stroke-width: 4;\n}\n.timer-progress-circle {\n fill: none;\n stroke: var(--accent);\n stroke-width: 4;\n stroke-linecap: round;\n stroke-dasharray: 175.93;\n stroke-dashoffset: 0;\n transition: stroke-dashoffset 1s linear, stroke 0.3s;\n}\n.timer-display {\n font-family: \"Space Mono\", monospace;\n font-size: 1.4rem;\n font-weight: 700;\n}\n.timer-display.timer-danger { color: var(--danger); }\n.timer-card.timer-danger .timer-progress-circle { stroke: var(--danger); }\n\n/* ----- Feedback ----- */\n.feedback-header { margin-bottom: 20px; }\n.muted { color: var(--text-muted); font-size: 0.9rem; }\n\n.score-grid {\n display: grid;\n grid-template-columns: repeat(4, 1fr);\n gap: 12px;\n margin-bottom: 20px;\n}\n@media (max-width: 720px) {\n .score-grid { grid-template-columns: repeat(2, 1fr); }\n}\n.score-card {\n background: var(--surface);\n border: 1px solid var(--border);\n border-radius: var(--radius);\n padding: 16px;\n text-align: center;\n}\n.score-label {\n font-size: 0.85rem;\n color: var(--text-muted);\n margin-bottom: 8px;\n}\n.score-value {\n font-family: \"Space Mono\", monospace;\n font-size: 2rem;\n font-weight: 700;\n color: var(--text);\n margin-bottom: 8px;\n}\n.score-bar {\n height: 6px;\n background: var(--surface2);\n border-radius: 3px;\n overflow: hidden;\n}\n.score-bar > div {\n height: 100%;\n width: 0;\n background: var(--accent);\n transition: width 0.9s cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.overall-box {\n display: flex;\n align-items: baseline;\n justify-content: center;\n gap: 8px;\n padding: 24px;\n background: var(--surface);\n border: 1px solid var(--border);\n border-radius: var(--radius-lg);\n margin-bottom: 20px;\n}\n.overall-label {\n font-size: 1rem;\n color: var(--text-muted);\n margin-right: 8px;\n}\n.overall-value {\n font-family: \"Space Mono\", monospace;\n font-size: 3rem;\n font-weight: 700;\n}\n.overall-value.good { color: var(--success); }\n.overall-value.ok { color: var(--warning); }\n.overall-value.bad { color: var(--danger); }\n.overall-suffix { color: var(--text-muted); font-size: 1.25rem; }\n\n.feedback-grid {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 16px;\n margin-bottom: 20px;\n}\n@media (max-width: 720px) {\n .feedback-grid { grid-template-columns: 1fr; }\n}\n.bullet-list li {\n padding: 8px 0;\n padding-left: 24px;\n position: relative;\n font-size: 0.92rem;\n line-height: 1.5;\n}\n.feedback-section:nth-child(1) .bullet-list li::before {\n content: \"✓\";\n position: absolute;\n left: 0;\n color: var(--success);\n font-weight: 700;\n}\n.feedback-section:nth-child(2) .bullet-list li::before {\n content: \"↗\";\n position: absolute;\n left: 0;\n color: var(--warning);\n font-weight: 700;\n}\n\n.tip-box {\n display: flex;\n gap: 12px;\n padding: 16px 20px;\n background: var(--accent-glow);\n border-left: 4px solid var(--accent);\n border-radius: var(--radius-sm);\n margin-bottom: 20px;\n}\n.tip-icon { font-size: 1.5rem; flex-shrink: 0; }\n\n.model-answer {\n background: var(--surface);\n border: 1px solid var(--border);\n border-radius: var(--radius);\n margin-bottom: 20px;\n}\n.model-answer summary {\n padding: 16px 20px;\n cursor: pointer;\n font-weight: 500;\n user-select: none;\n}\n.model-answer summary:hover { background: var(--surface2); }\n.model-answer-body { padding: 0 20px 20px; }\n.model-answer-body blockquote {\n margin: 0 0 12px;\n padding: 16px;\n background: var(--surface2);\n border-left: 3px solid var(--accent);\n border-radius: var(--radius-sm);\n font-style: italic;\n line-height: 1.6;\n color: var(--text-muted);\n}\n\n/* ----- Results ----- */\n.results-hero {\n text-align: center;\n padding: 32px;\n background: var(--surface);\n border: 1px solid var(--border);\n border-radius: var(--radius-lg);\n margin-bottom: 24px;\n}\n.hero-score {\n font-family: \"Space Mono\", monospace;\n font-size: 4.5rem;\n font-weight: 700;\n line-height: 1;\n margin: 16px 0 8px;\n}\n.hero-score.good { color: var(--success); }\n.hero-score.ok { color: var(--warning); }\n.hero-score.bad { color: var(--danger); }\n.hero-label { color: var(--text-muted); font-size: 1.1rem; }\n.hero-stats {\n display: grid;\n grid-template-columns: repeat(4, 1fr);\n gap: 12px;\n margin-top: 24px;\n}\n@media (max-width: 720px) {\n .hero-stats { grid-template-columns: repeat(2, 1fr); }\n}\n.hero-stats > div {\n display: flex;\n flex-direction: column;\n gap: 4px;\n padding: 12px;\n background: var(--surface2);\n border-radius: var(--radius-sm);\n}\n.hero-stats span { font-size: 0.8rem; color: var(--text-muted); }\n.hero-stats strong { font-family: \"Space Mono\", monospace; font-size: 1.1rem; }\n\n.chart-card { display: flex; flex-direction: column; align-items: center; margin-bottom: 24px; }\n.chart-card canvas { max-width: 100%; height: auto; }\n\n.table-wrap { overflow-x: auto; }\n.q-table {\n width: 100%;\n border-collapse: collapse;\n font-size: 0.9rem;\n}\n.q-table th,\n.q-table td {\n text-align: left;\n padding: 12px 8px;\n border-bottom: 1px solid var(--border);\n}\n.q-table th {\n color: var(--text-muted);\n font-weight: 500;\n font-size: 0.85rem;\n}\n.q-table tr.q-row { cursor: pointer; }\n.q-table tr.q-row:hover { background: var(--surface2); }\n.q-table tr.expanded-row td {\n background: var(--surface2);\n padding: 16px;\n font-size: 0.88rem;\n color: var(--text-muted);\n line-height: 1.6;\n}\n.score-pill {\n display: inline-block;\n padding: 2px 10px;\n border-radius: 999px;\n font-family: \"Space Mono\", monospace;\n font-size: 0.8rem;\n}\n.score-pill.good { background: rgba(16,185,129,0.18); color: var(--success); }\n.score-pill.ok { background: rgba(245,158,11,0.18); color: var(--warning); }\n.score-pill.bad { background: rgba(239,68,68,0.18); color: var(--danger); }\n.score-pill.skip { background: var(--surface3); color: var(--text-muted); }\n\n.rec-item {\n padding: 12px 0;\n border-bottom: 1px solid var(--border);\n}\n.rec-item:last-child { border-bottom: none; }\n.rec-head {\n display: flex;\n align-items: center;\n gap: 8px;\n margin-bottom: 4px;\n font-weight: 600;\n}\n.rec-priority {\n font-size: 0.75rem;\n padding: 2px 8px;\n border-radius: 999px;\n text-transform: uppercase;\n font-weight: 700;\n}\n.rec-priority.high { background: rgba(239,68,68,0.18); color: var(--danger); }\n.rec-priority.medium { background: rgba(245,158,11,0.18); color: var(--warning); }\n.rec-priority.low { background: rgba(16,185,129,0.18); color: var(--success); }\n.rec-body { color: var(--text-muted); font-size: 0.9rem; line-height: 1.55; }\n.rec-resource { margin-top: 4px; font-size: 0.85rem; color: var(--accent-2); }\n\n/* ----- Loading overlay ----- */\n.loading-overlay {\n position: fixed;\n inset: 0;\n background: rgba(15, 17, 23, 0.85);\n backdrop-filter: blur(6px);\n z-index: 5000;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.loading-card {\n background: var(--surface);\n border: 1px solid var(--border);\n border-radius: var(--radius-lg);\n padding: 32px;\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 16px;\n min-width: 280px;\n}\n.spinner {\n width: 48px;\n height: 48px;\n border: 3px solid var(--surface3);\n border-top-color: var(--accent);\n border-radius: 50%;\n animation: spinCw 0.9s linear infinite;\n}\n\n/* ----- Toasts ----- */\n#toast-container {\n position: fixed;\n bottom: 24px;\n right: 24px;\n z-index: 9999;\n display: flex;\n flex-direction: column;\n gap: 8px;\n pointer-events: none;\n}\n.toast {\n padding: 12px 18px;\n border-radius: var(--radius-sm);\n font-size: 0.9rem;\n color: #fff;\n opacity: 0;\n transform: translateY(8px);\n transition: all 0.3s ease;\n max-width: 320px;\n box-shadow: var(--shadow);\n pointer-events: auto;\n}\n.toast.show { opacity: 1; transform: translateY(0); }\n.toast-info { background: #1e40af; }\n.toast-success { background: #065f46; }\n.toast-warning { background: #92400e; }\n.toast-danger { background: #991b1b; }\n\n/* ----- Animations ----- */\n@keyframes fadeIn {\n from { opacity: 0; transform: translateY(12px); }\n to { opacity: 1; transform: translateY(0); }\n}\n@keyframes pulse {\n 0%, 100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.5); }\n 50% { box-shadow: 0 0 0 10px rgba(239, 68, 68, 0); }\n}\n@keyframes blink {\n to { opacity: 0; }\n}\n@keyframes spinCw {\n to { transform: rotate(360deg); }\n}\n\n.fade-in { animation: fadeIn 0.4s ease forwards; }\n.stagger-1 { animation-delay: 0.05s; opacity: 0; }\n.stagger-2 { animation-delay: 0.15s; opacity: 0; }\n.stagger-3 { animation-delay: 0.25s; opacity: 0; }\n.stagger-4 { animation-delay: 0.35s; opacity: 0; }\n","createdAt",["D",1779026550887],"branchVersion","branchId","abbbff88-51f8-11f1-954b-ee650bb23af1","id","abb80752-51f8-11f1-954b-ee650bb23af1","ai-interview-coach",["D",1779026389980],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","Basic HTML starter template based on Glitch's starter","imageUrl","865860e1-6856-4710-840c-6721187ddf29","pinnedFileId","019e363c-6c13-7621-bfd9-941852df03b4","pinPreview",true,"pinMigrated","screenshotVersion","likeCount",0,"orgId","019e3625-1940-7278-b9e1-b62a35ffb292","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_104":103,"_112":108},"org",{"_104":103,"_105":106,"_107":108,"_19":58,"_109":110,"_111":30},"branch",{"_13":89,"_37":90,"_46":45,"_91":47,"_92":93,"_94":95,"_96":53,"_97":98,"_99":100,"_101":48,"_102":103},"isOwned",12,"main","projectId","forkedBranchId","7a3b261a-4186-11f0-ae9b-76b3cceeab13","forkedBranchVersion",75,"forkedProjectPrivacy","forkedProjectId","7a3abcf2-4186-11f0-ae9b-76b3cceeab13","forkedProjectOrgId","019aa807-52c2-709c-928b-2029bae9a558","projectName","userHandle","cobra19","handle","displayName","Cobra","avatar","https://lh3.googleusercontent.com/a/ACg8ocLa-d50DMEIfhHk_TZucQjVtHs18LhDFFKn_p8yBO5lDhEfnQ=s96-c","tier","free","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_46":47,"_37":48,"_41":217,"_50":-5,"_51":30,"_52":53,"_54":53,"_55":56,"_57":-5,"_19":58,"_59":60,"_61":62,"_63":-5,"_64":-5,"_65":66,"_67":68,"_69":-5,"_70":-5,"_71":-5,"_72":-5,"_73":74,"_75":74,"_76":77,"_78":77,"_79":77,"_80":74,"_81":74,"_82":218,"_84":219,"_86":220,"_88":30},"tree",[196,197,198,199,200],"files",[196,197,198,199,200],"counts",{"_186":66,"_187":163,"_188":66,"_189":190,"_191":192},"contents",[148,149,150,151,152],"upstreamProject",{"_46":98,"_37":144,"_55":56,"_57":145,"_52":53,"_82":146},"upstreamBranch",{"_46":93,"_41":137,"_138":139,"_37":90,"_91":98,"_13":140,"_92":-5,"_94":-5,"_141":142,"_50":-5,"_88":30,"_52":53,"_102":143,"_67":100,"_101":144},"emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},["D",1749070628054],"updatedAt",["D",1779896149804],76,"lockfileKey","1779896350378-esm.town_v_templates_basic-html-starter@76-main","templates","basic-html-starter","https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/1e130d76-f5f9-42d2-df67-91517700ff00/square512?exp=1789592399&sig=b404cb1e8c001706d6cdf6fda9bec1d4b698921c910bef823903e227e4b26d4c",{"_104":143,"_112":147},"https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/129cab32-3bd7-4c3e-f39b-f12900c76100/square512?exp=1789592399&sig=e3667930a878fd5db49e47cce78fe270a8ba33317e34775a1ada2dd4a7c49d8d",{"_46":180,"_37":181,"_35":182,"_154":-5,"_44":45,"_43":163,"_155":30,"_41":183,"_13":66,"_38":26,"_39":184,"_29":30,"_157":-5,"_32":185},{"_46":174,"_37":175,"_35":176,"_154":-5,"_44":45,"_43":163,"_155":62,"_41":177,"_13":66,"_38":26,"_39":178,"_29":30,"_157":-5,"_32":179},{"_46":167,"_37":168,"_35":169,"_154":-5,"_44":45,"_43":170,"_155":62,"_41":171,"_13":163,"_38":26,"_39":172,"_29":30,"_157":-5,"_32":173},{"_46":159,"_37":160,"_35":60,"_154":-5,"_44":45,"_43":161,"_155":30,"_41":162,"_13":163,"_38":164,"_39":165,"_29":30,"_157":-5,"_32":166},{"_46":153,"_37":33,"_35":36,"_154":-5,"_44":45,"_43":14,"_155":62,"_41":156,"_13":66,"_38":26,"_39":40,"_29":30,"_157":-5,"_32":158},"0ba0296a-51f9-11f1-bf17-ee650bb23af1","parentId","latest",["D",1779026550887],"label",[33],"ba9f7e76-51f8-11f1-ae19-ee650bb23af1","main.tsx",2,["D",1779026414985],1,"http","import { Hono } from \"npm:hono\";\nimport { serveFile } from \"https://esm.town/v/std/utils/index.ts\";\n\nconst app = new Hono();\n\n// Full stack traces on errors\napp.onError((err) => Promise.reject(err));\n\nconst MODEL = \"mistralai/mistral-7b-instruct:free\";\n\n/**\n * Proxy endpoint for OpenRouter chat completions.\n * Keeps the API key on the server (never exposed to the browser).\n * Body: { messages, stream? }\n * - If stream=true, returns the raw OpenRouter SSE stream.\n * - Otherwise returns the JSON response.\n */\napp.post(\"/api/ai\", async (c) => {\n const apiKey = Deno.env.get(\"OPENROUTER_API_KEY\");\n if (!apiKey) {\n return c.json({ error: \"OPENROUTER_API_KEY not configured\" }, 500);\n }\n\n let body: { messages?: unknown; stream?: boolean; model?: string };\n try {\n body = await c.req.json();\n } catch {\n return c.json({ error: \"Invalid JSON body\" }, 400);\n }\n\n const messages = body.messages;\n if (!Array.isArray(messages) || messages.length === 0) {\n return c.json({ error: \"messages must be a non-empty array\" }, 400);\n }\n\n const stream = body.stream === true;\n\n const upstream = await fetch(\"https://openrouter.ai/api/v1/chat/completions\", {\n method: \"POST\",\n headers: {\n \"Authorization\": `Bearer ${apiKey}`,\n \"Content-Type\": \"application/json\",\n \"HTTP-Referer\": \"https://val.town\",\n \"X-Title\": \"AI Interview Coach\",\n },\n body: JSON.stringify({\n model: body.model || MODEL,\n stream,\n messages,\n }),\n });\n\n if (!upstream.ok) {\n const text = await upstream.text();\n return c.json(\n { error: \"Upstream error\", status: upstream.status, body: text },\n 502,\n );\n }\n\n if (stream) {\n // Pipe the SSE stream straight back to the browser\n return new Response(upstream.body, {\n status: 200,\n headers: {\n \"Content-Type\": \"text/event-stream; charset=utf-8\",\n \"Cache-Control\": \"no-cache\",\n \"Connection\": \"keep-alive\",\n },\n });\n }\n\n const json = await upstream.json();\n return c.json(json);\n});\n\n// Serve static frontend files\napp.get(\"/\", (c) => serveFile(\"./index.html\", import.meta.url));\napp.get(\"/index.html\", (c) => serveFile(\"./index.html\", import.meta.url));\napp.get(\"/styles.css\", (c) => serveFile(\"./styles.css\", import.meta.url));\napp.get(\"/app.js\", (c) => serveFile(\"./app.js\", import.meta.url));\napp.get(\"/favicon.svg\", (c) => serveFile(\"./favicon.svg\", import.meta.url));\n\nexport default app.fetch;\n",[160],"d5f1251c-51f8-11f1-95e1-ee650bb23af1","index.html","019e363c-6c13-7621-bfd9-90a6f435edf0",5,["D",1779026460816],"\n\n\n \n \n AI Interview Coach\n \n \n \n \n\n\n

\n\n \n \n\n \n

\n 🤖\n

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",[168],"abc0ef7a-51f8-11f1-954b-ee650bb23af1","favicon.svg","019e363c-6c13-7621-bfd9-8c305625455d",["D",1779026389980],"",[175],"abc0dba2-51f8-11f1-954b-ee650bb23af1","README.md","019e363c-6c13-7621-bfd9-8a5fc12fb00b",["D",1779026389980],"# Welcome to Val Town\n\nVal Town is the simplest way to get code running in the cloud.\n\nThis is a basic HTML starter template.\n\n1. Click `Remix` on this val to get a copy of it\n2. Click `main.tsx` to view the website\n3. Saves to any file will instantly deploy\n\n### ← main.tsx\n\nThis HTTP server hosts all of the other files in this val.\n\nTo view your site in a new tab, click on the `...` menu of `main.tsx` to copy\nyour live HTTP endpoint.\n\n### ← README.md\n\nThat's this file, where you can tell people what your cool website does and how\nyou built it.\n\n### ← index.html\n\nWhere you'll write the content of your website.\n\n### ← style.css\n\nCSS files add styling rules to your content.\n\n### ← script.js\n\nIf you're feeling fancy you can add interactivity to your site with JavaScript.\n\nIf you want more interactivity, check out this\n[React starter](https://www.val.town/x/std/reactHonoStarter).\n\n### ← favicon.svg\n\nThe icon that shows up in the brower tab. Tip: AIs are pretty good at writing\nSVG favicons.\n\n---\n\nThis template was inspired by https://glitch.new/blank.",[181],"pulls","branches","forks","envVars",{"_193":163,"_195":66},"connections",{"_193":66,"_194":66},"count","unfilledCount","emptyCount",{"_46":180,"_37":181,"_35":182,"_154":-5,"_44":45,"_43":163,"_155":30,"_41":214,"_13":66,"_38":26,"_39":184,"_29":30,"_157":-5,"_202":215,"_32":216},{"_46":174,"_37":175,"_35":176,"_154":-5,"_44":45,"_43":163,"_155":62,"_41":211,"_13":66,"_38":26,"_39":178,"_29":30,"_157":-5,"_202":212,"_32":213},{"_46":167,"_37":168,"_35":169,"_154":-5,"_44":45,"_43":170,"_155":62,"_41":208,"_13":163,"_38":26,"_39":172,"_29":30,"_157":-5,"_202":209,"_32":210},{"_46":159,"_37":160,"_35":60,"_154":-5,"_44":45,"_43":161,"_155":30,"_41":205,"_13":163,"_38":164,"_39":165,"_29":30,"_157":-5,"_202":206,"_32":207},{"_46":153,"_37":33,"_35":36,"_154":-5,"_44":45,"_43":14,"_155":62,"_41":201,"_13":66,"_38":26,"_39":40,"_29":30,"_157":-5,"_202":203,"_32":204},["D",1779026550887],"children",[],[33],["D",1779026414985],[],[160],["D",1779026460816],[],[168],["D",1779026389980],[],[175],["D",1779026389980],[],[181],["D",1779026389980],{"_104":103,"_112":108},{"_104":103,"_105":106,"_107":108,"_19":58,"_109":110,"_111":30},{"_13":89,"_37":90,"_46":45,"_91":47,"_92":93,"_94":95,"_96":53,"_97":98,"_99":100,"_101":48,"_102":103},"ctx",{"_82":-5,"_134":254,"_255":256,"_257":258,"_259":30,"_260":30,"_261":30,"_262":62,"_263":-5,"_264":-7,"_265":-7,"_266":66,"_267":30,"_268":30,"_269":-5,"_270":30,"_271":30,"_272":30,"_273":-5},"ENV",{"_225":226,"_227":228,"_229":90,"_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","5015b8df46402d8bba4f485ecc37aec202b0e06b","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

Diff · v6