/* Turabian 101 final quiz and certificate (/turabian-101/final-quiz): the same styles as the APA 101 quiz. */
.quiz-wrap > * { max-width: 46rem; }
.quiz-wrap h2 { font-size: var(--text-2xl); margin-bottom: var(--s-2); }

.q-card { border: 1px solid var(--rule); border-radius: var(--radius-lg); background: var(--ground); padding: var(--s-6); box-shadow: var(--shadow-record); }
.q-card:focus { outline: none; }
.q-field { display: grid; gap: var(--s-2); margin-top: var(--s-5); }
.q-field label { font-weight: 600; }
.q-field input { font: inherit; font-size: var(--text-lg); padding: 0.75rem 0.875rem; border: 1.5px solid #8d949b; border-radius: var(--radius); color: var(--ink); background: #fff; }
.q-field input:focus-visible { outline: 3px solid var(--blue-100); outline-offset: 1px; border-color: var(--action); }
.q-private { font-size: var(--text-sm); color: var(--ink-2); margin: var(--s-5) 0; }
.q-error { color: var(--red-500); font-weight: 600; margin-top: var(--s-4); }

.q-who { font-size: var(--text-sm); color: var(--ink-2); margin-bottom: var(--s-5); }
.q-list { list-style: none; margin: 0; padding: 0; counter-reset: q; }
.q-list > li { counter-increment: q; border-top: 1px solid var(--rule); padding: var(--s-5) 0; }
.q-list fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.q-list legend { display: flex; gap: var(--s-3); font-weight: 600; font-size: var(--text-lg); line-height: 1.4; margin-bottom: var(--s-3); padding: 0; }
.q-list legend::before { content: counter(q); flex: none; width: 1.75rem; height: 1.75rem; border-radius: 50%; background: var(--blue-800); color: #fff; font: 700 0.875rem/1.75rem var(--font-body); text-align: center; margin-top: 0.1rem; }
.q-hint { font-size: var(--text-sm); color: var(--ink-3); margin: 0 0 var(--s-2) 2.5rem; }
.q-opt { display: flex; gap: var(--s-3); align-items: flex-start; margin: 0 0 var(--s-2) 2.5rem; padding: 0.625rem 0.875rem; border: 1px solid var(--rule); border-radius: var(--radius); cursor: pointer; }
.q-opt:hover { border-color: var(--blue-300); background: var(--gray-50); }
.q-opt input { margin-top: 0.3rem; accent-color: var(--action); flex: none; }
.q-opt:has(input:checked) { border-color: var(--action); background: #f1f7fc; }
.q-opt:has(input:focus-visible) { outline: 3px solid var(--blue-100); outline-offset: 1px; }

.q-bar { position: sticky; bottom: 0; display: flex; justify-content: space-between; align-items: center; gap: var(--s-4); padding: var(--s-4) 0; background: var(--ground); border-top: 1px solid var(--rule); }
.q-bar span { color: var(--ink-2); font-size: var(--text-sm); }

.q-score { font: 800 var(--text-5xl)/1 var(--font-display); color: var(--blue-800); margin: var(--s-2) 0 var(--s-4); }
.q-actions { display: flex; flex-wrap: wrap; gap: var(--s-3); margin-top: var(--s-5); }
.q-missed { margin: var(--s-4) 0 0; padding-left: 1.25rem; }
.q-missed li { margin-bottom: var(--s-3); }
.q-missed .fb { display: block; color: var(--ink-2); font-size: var(--text-sm); margin-top: 0.125rem; }

.q-note { margin-top: var(--s-7); padding-top: var(--s-5); border-top: 2px solid var(--ink); }
.q-note h2 { font-size: var(--text-xl); }
.q-note p { color: var(--ink-2); }

@media (max-width: 40rem) {
  .q-card { padding: var(--s-5); }
  .q-opt, .q-hint { margin-left: 0; }
}