diff --git a/index.html b/index.html
new file mode 100644
index 0000000..0d07995
--- /dev/null
+++ b/index.html
@@ -0,0 +1,122 @@
+
+
+
+
+
+ 學科刷題系統
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ ![題目圖片]()
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
正確答案：${String.fromCharCode(65 + answer)}. ${correctText}
`;
+ }
+ return;
+ }
+
+ const isCorrect = selected === answer;
+ const correctText = question.option[answer] + optionSuffix;
+ const explainBlock = question.explain ? `${question.explain}
` : "";
+ const psBlock = question.ps ? `${question.ps}
` : "";
+
+ if (state.mode === "practice" || state.showSolutions) {
+ elements.feedback.classList.add(isCorrect ? "correct" : "incorrect");
+ const statusLine = isCorrect ? "答對了！" : "答錯了。";
+ elements.feedback.innerHTML = `${statusLine}
正確答案：${String.fromCharCode(65 + answer)}. ${correctText}
${explainBlock}${psBlock}`;
+ } else {
+ elements.feedback.textContent = `已選擇選項 ${String.fromCharCode(65 + selected)}`;
+ }
+}
+
+function updateProgress() {
+ const answered = state.userAnswers.filter((ans) => ans != null).length;
+ const total = state.questionOrder.length;
+ elements.progressCount.textContent = answered;
+ elements.progressTotal.textContent = total;
+ const percent = total ? (answered / total) * 100 : 0;
+ elements.progressFill.style.width = `${percent}%`;
+}
+
+function updateNavButtons() {
+ elements.prevBtn.disabled = state.currentIndex === 0;
+ elements.nextBtn.disabled = state.currentIndex === state.questionOrder.length - 1;
+}
+
+function goToQuestion(targetIndex) {
+ if (targetIndex < 0 || targetIndex >= state.questionOrder.length) return;
+ state.currentIndex = targetIndex;
+ updateQuestionView();
+ closeStatusPanel();
+}
+
+function updateStatusPanel() {
+ elements.statusList.innerHTML = "";
+ state.questionOrder.forEach((originalIndex, idx) => {
+ const item = document.createElement("button");
+ item.type = "button";
+ item.className = "status-item";
+ if (idx === state.currentIndex) {
+ item.classList.add("current");
+ }
+ if (state.userAnswers[idx] != null) {
+ item.classList.add("answered");
+ }
+ if (state.bookmarks.has(idx)) {
+ item.classList.add("bookmarked");
+ }
+ item.innerHTML = `#${originalIndex + 1}`;
+ if (state.bookmarks.has(idx)) {
+ item.innerHTML += '🔖';
+ }
+ item.addEventListener("click", () => goToQuestion(idx));
+ elements.statusList.appendChild(item);
+ });
+}
+
+function toggleBookmark() {
+ if (state.bookmarks.has(state.currentIndex)) {
+ state.bookmarks.delete(state.currentIndex);
+ } else {
+ state.bookmarks.add(state.currentIndex);
+ }
+ updateQuestionView();
+ updateStatusPanel();
+}
+
+function nextQuestion() {
+ if (state.currentIndex < state.questionOrder.length - 1) {
+ state.currentIndex += 1;
+ updateQuestionView();
+ }
+}
+
+function prevQuestion() {
+ if (state.currentIndex > 0) {
+ state.currentIndex -= 1;
+ updateQuestionView();
+ }
+}
+
+function handleJump(event) {
+ event.preventDefault();
+ const value = Number(elements.jumpInput.value);
+ if (!value) return;
+ const targetOriginal = value - 1;
+ const targetIndex = state.questionOrder.indexOf(targetOriginal);
+ if (targetIndex >= 0) {
+ goToQuestion(targetIndex);
+ elements.jumpInput.value = "";
+ } else {
+ alert("目前測驗中不包含此題號。");
+ }
+}
+
+function finishAssessment() {
+ if (state.mode === "practice") return;
+ const total = state.questionOrder.length;
+ const results = state.questionOrder.map((questionIdx, idx) => {
+ const question = state.questions[questionIdx];
+ const userAnswer = state.userAnswers[idx];
+ const correct = userAnswer === question.answer;
+ return {
+ questionNumber: questionIdx + 1,
+ userAnswer,
+ correctAnswer: question.answer,
+ correct
+ };
+ });
+
+ const answered = results.filter((item) => item.userAnswer != null).length;
+ const correctCount = results.filter((item) => item.correct).length;
+ const unanswered = total - answered;
+ const score = Math.round((correctCount / total) * 100);
+
+ elements.resultsBody.innerHTML = `
+
+
得分：${score} 分
+
+ - 作答題數：${answered} 題
+ - 答對題數：${correctCount} 題
+ - 未作答題數：${unanswered} 題
+
+