/* Sure or right: layout only. Colours and type come from lib/base.css. */
.quiz { list-style: none; margin: 0.4rem 0 0; padding: 0; counter-reset: q; }
.quiz .q { counter-increment: q; padding: 0.7rem 0 0.8rem 0.7rem; border-left: 3px solid var(--paper-line); }
.quiz .q + .q { margin-top: 0.4rem; }
.quiz .q > p:first-child { margin: 0 0 0.45rem; color: var(--paper-ink); font-size: 0.98rem; line-height: 1.35; }
.quiz .q > p:first-child::before { content: counter(q) ". "; color: var(--paper-soft); font-variant-numeric: tabular-nums; }
.quiz.shown .q.yes { border-left-color: var(--yellow); }
.quiz.shown .q.no { border-left-color: var(--red); }
.pair { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; }
.pair label { display: grid; gap: 0.25rem; font: 600 0.8rem var(--body); color: var(--paper-soft); }
.pair input { width: 100%; min-width: 0; box-sizing: border-box; padding: 0.5rem; font: 600 1.1rem var(--body); color: var(--paper-ink); background: transparent; border: 1px solid var(--paper-soft); border-radius: 0; font-variant-numeric: tabular-nums; }
.pair input:disabled { opacity: 0.6; }
.strip { position: relative; height: 1.4rem; margin-top: 0.55rem; border-bottom: 1px solid var(--paper-line); }
.strip .span { position: absolute; top: 0.35rem; height: 0.7rem; background: var(--c3); }
.q.yes .strip .span { background: var(--yellow); }
.q.no .strip .span { background: var(--red); }
.strip .truth { position: absolute; left: 50%; top: 0; width: 2px; height: 1.4rem; margin-left: -1px; padding: 0; border-radius: 0; background: var(--paper-ink); }
.said { margin: 0.35rem 0 0; font-size: 0.88rem; color: var(--paper-soft); }
.said b { color: var(--paper-ink); font-variant-numeric: tabular-nums; }
#check { width: 100%; margin-top: 0.9rem; }
.tally { margin: 0.8rem 0 0; font: 300 1.8rem/1.1 var(--display); color: var(--paper-ink); text-align: center; font-variant-numeric: tabular-nums; }