// 次へボタン const nextBtn = document.getElementById('nextButton'); if (nextBtn) nextBtn.addEventListener('click', () => if (!answerLocked) return; goToNextQuestion(); );
.next-btn:active transform: scale(0.97);
body background: linear-gradient(145deg, #fef7e0 0%, #f8e9c0 100%); font-family: 'Segoe UI', 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', 'Yu Gothic', Roboto, system-ui, sans-serif; min-height: 100vh; display: flex; justify-content: center; align-items: center; padding: 1.5rem; nihongo challenge n3
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes"> <title>NIHONGO CHALLENGE N3 | 日本語クイズ</title> <style> * margin: 0; padding: 0; box-sizing: border-box; user-select: none; /* better mobile tap feel, optional */
.result-score font-size: 3rem; font-weight: 800; color: #b13e3e; margin: 1rem 0; // 次へボタン const nextBtn = document
.score-box span, .question-counter span color: #b13e3e; font-size: 1.3rem; margin-left: 6px; font-weight: 800;
// ヘルパー: 配列シャッフル (Fisher-Yates) function shuffleArray(arr) for (let i = arr.length - 1; i > 0; i--) const j = Math.floor(Math.random() * (i + 1)); [arr[i], arr[j]] = [arr[j], arr[i]]; return arr; if (nextBtn) nextBtn.addEventListener('click'
.header h1 span:first-child background: #ffd966; padding: 0.2rem 0.8rem; border-radius: 60px; font-size: 1.3rem; color: #9e2a2a;
// メイン: 問題をレンダリング＋フィードバック表示 (回答後も再利用) function renderQuestionWithFeedback(selectedIdx, correctIdx, explanation, isUserCorrect) const q = currentQuestionObj; if (!q) return;