/* ============================================================
   quiz.css — 歴史クイズ(no=46) 専用CSS。quiz.php で読込。
   ★style.css は改変しない。全セレクタ .quiz_ 配下にスコープ。
   ============================================================ */
.quiz_wrap { max-width: 680px; margin: 0 auto; }
.quiz_q { border: 1px solid var(--color-text-muted, #ccc); border-radius: 8px; padding: 16px; margin: 16px 0; }
.quiz_type { font-size: .8em; color: var(--color-text-muted, #777); font-weight: bold; }
.quiz_prompt { font-weight: bold; margin: 6px 0 10px; }
.quiz_hint { background: #f7f7f6; border-radius: 6px; padding: 10px; margin: 0 0 12px; font-size: .95em; }
.quiz_hint li { margin: 2px 0; }
.quiz_opt { display: block; width: 100%; text-align: left; padding: 10px 14px; margin: 6px 0; border: 1px solid var(--color-text-muted, #bbb); border-radius: 6px; background: #fff; cursor: pointer; color: inherit; font-size: 1em; }
.quiz_opt:hover { background: #f2f2f2; }
.quiz_opt.is_correct { background: #e3f4e6; border-color: #3a9d54; font-weight: bold; }
.quiz_opt.is_wrong { background: #fbe6e6; border-color: #c0392b; }
.quiz_opt:disabled { cursor: default; }
.quiz_result { font-size: 1.2em; font-weight: bold; text-align: center; margin: 20px 0; }
.quiz_actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; margin: 16px 0; }
/* no=11 Step0同梱: 半死ダークブロック撤去。body/surfaceは:root固定でライトのみ=親が白のままquizだけダーク化する不整合(未適用)を解消し面の一貫性を優先。将来ダーク採用時は:root一元でトークン化(方針案 論点5)。 */