/* 全体共通 */
body {
  margin:0; padding:20px;
  font-family:sans-serif;
  background:#fffdf6;
  text-align:center;
}
#container { max-width:600px; margin:0 auto; }
#hero { max-width:80%; margin-bottom:20px; }
.btn {
  display:block; width:80%; max-width:300px;
  margin:10px auto; padding:12px;
  border:2px solid #333; border-radius:8px;
  background:#fff; color:#000; cursor:pointer;
  font-size:1em; transition:background .2s;
  text-align:center;
}
.btn:hover { background:#f0f0f0; }
.row {
  width:80%; max-width:300px;
  margin:20px auto; display:flex;
  justify-content:space-between;
}
.row .btn { width:48%; margin:0; }
.section {
  display:none; text-align:left;
  margin:20px auto; max-width:600px;
}
h2,h3 { font-size:1.3em; margin-bottom:12px; text-align:center; }
.close-btn {
  display:block; margin:10px auto;
  padding:8px 16px; border:1px solid #333;
  border-radius:6px; background:#fff;
  color:#000; cursor:pointer;
}
table { width:100%; border-collapse:collapse; margin-bottom:20px; }
th,td { border:1px solid #ccc; padding:6px; font-size:0.9em; }
ul { padding-left:20px; margin-bottom:20px; }

/* 日本語クイズ */
#jp-quiz .score-remaining { font-size:0.9em; margin-bottom:12px; text-align:left; }
#jp-quiz .question {
  background:#fff8d0; border:1px solid #e0c060;
  border-radius:6px; padding:12px; margin-bottom:16px;
  font-size:1.1em; text-align:left; position:relative;
}
#jp-quiz .question .ipa {
  margin-left:8px; font-size:0.9em; color:#666;
}
#jp-quiz .choices button {
  display:block; width:100%; margin:6px 0; padding:10px;
  border:1px solid #333; border-radius:6px;
  background:#fafafa; cursor:pointer; text-align:left;
  font-size:1em;
}
#jp-quiz .choices button.correct { border-color:green; }
#jp-quiz .choices button.wrong   { border-color:red;   }
#jp-quiz #explanation {
  font-style:italic; margin:12px 0; min-height:1.2em;
  text-align:left;
}
#jp-quiz #btn-next {
  display:block; margin:20px auto; padding:10px 20px;
  border:2px solid #333; border-radius:8px;
  background:#fff; cursor:pointer;
}

/* 英語クイズ */
#en-quiz .score-remaining { font-size:0.9em; margin-bottom:12px; text-align:left; }
#en-quiz .question {
  background:#e8f4ff; border:1px solid #a0c8ff;
  border-radius:6px; padding:12px; margin-bottom:16px;
  font-size:1.1em; text-align:left;
}
#en-quiz .choices button {
  display:block; width:100%; margin:6px 0; padding:10px;
  border:1px solid #333; border-radius:6px;
  background:#fff; cursor:pointer; text-align:left;
  font-size:1em;
}
#en-quiz .choices button.correct { border-color:green; }
#en-quiz .choices button.wrong   { border-color:red;   }
#en-quiz #en-explanation {
  font-style:italic; margin:12px 0; min-height:1.2em;
  text-align:left;
}
#en-quiz #en-btn-next {
  display:block; margin:20px auto; padding:10px 20px;
  border:2px solid #333; border-radius:8px;
  background:#fff; cursor:pointer;
}

/* 語句一覧・ランキングは quiz-template.php のスタイルが流用 */

/* モーダルは quiz.css では非表示 */
#settings-modal {
  display: none !important;
  pointer-events: none !important;
}

/* 質問欄内アイコン */
.question {
  padding-left:40px;
  position:relative;
}
.question::before {
  content:'❓';
  position:absolute; top:12px; left:12px;
  font-size:1.2em; color:#f9d23b;
}
.question > span#question-text {
  margin-left:1.5em;
}

/* 🔊ボタンも非表示 */
#play-audio {
  display:none!important;
}

/* audio要素も非表示 */
#audio-player {
  display:none!important;
}

/* クイズ領域を最前面に */
#container,
#jp-quiz,
#en-quiz,
#vocab-list,
#ranking {
  position:relative!important;
  z-index:20000!important;
  pointer-events:auto!important;
}