/* Practice-set components. Reuses the guide/article system; adds only what a
   question-and-reveal set needs. */
.practice-set { display: grid; gap: 18px; margin: 0; }
.question {
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--card);
  min-width: 0;
}
.question h3 { margin: 0 0 10px; font-size: 1.06rem; }
.question > p:first-of-type { margin-top: 0; }
.prompt-meta { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 12px; padding: 0; list-style: none; }
.prompt-meta li {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 4px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent-deep);
  font-size: .76rem;
  font-weight: 700;
}
.q-choices { display: grid; gap: 8px; margin: 12px 0 0; padding: 0; list-style: none; }
.q-choices label {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--paper);
  cursor: pointer;
  font-size: .95rem;
  line-height: 1.4;
}
.q-choices label:hover { border-color: var(--accent); }
.q-choices input { flex: 0 0 auto; width: 18px; height: 18px; margin-top: 2px; accent-color: var(--accent); }
.check-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 12px; }
.check-row .btn { min-height: 44px; }
.feedback { margin: 0; font-weight: 700; font-size: .9rem; color: var(--muted); }
.feedback.ok { color: var(--ok); }
.feedback.bad { color: var(--bad); }
details.reveal { margin-top: 14px; border-top: 1px solid var(--line); }
details.reveal > summary {
  display: flex;
  align-items: center;
  min-height: 44px;
  color: var(--accent-deep);
  font-weight: 700;
  cursor: pointer;
}
details.reveal > *:not(summary) { margin-top: 10px; }
details.reveal > *:not(summary):first-of-type { margin-top: 0; }
.passage {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--card);
}
.passage h3 { margin-top: 0; }
.passage p:last-child { margin-bottom: 0; }
.passage .label { margin: 0 0 8px; color: var(--accent-deep); font-size: .76rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.passage ul { margin: 0 0 0 18px; padding: 0; }
.passage li { margin: 4px 0; }
.model-email { padding: 14px 16px; border-inline-start: 3px solid var(--accent); background: var(--paper); border-radius: var(--radius-sm); }
.script-text { white-space: pre-line; }
.model-email p { margin: 0 0 10px; }
.model-email p:last-child { margin-bottom: 0; }
.notes { margin: 10px 0 0; padding-inline-start: 20px; }
.notes li { margin: 6px 0; }
.timer-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0 0 12px; }
.timer-display { font-variant-numeric: tabular-nums; font-weight: 700; color: var(--accent-deep); min-width: 7ch; }
.audio-note { margin: 8px 0 0; color: var(--muted); font-size: .84rem; }
@media (max-width: 420px) {
  .question { padding: 14px; }
  .passage { padding: 12px; }
}