/* ==========================================================================
   Cubo Mágico — widget de recordação (usado com quiz.js)
   Depende de base.css.
   ========================================================================== */

.quiz {
  background: var(--papel-nota);
  border: 1px solid var(--linha);
  border-radius: 8px;
  padding: 1.2rem 1.3rem;
  margin: 1.8rem 0;
}
.quiz .pergunta { font-weight: 600; margin: 0 0 1rem; }
.quiz .opcoes { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }

.quiz .opcoes button {
  display: block;
  width: 100%;
  text-align: left;
  font: inherit;
  font-size: .95rem;
  color: var(--tinta);
  background: var(--papel);
  border: 1px solid var(--linha);
  border-radius: 6px;
  padding: .65rem .85rem;
  cursor: pointer;
  transition: border-color .12s ease, background .12s ease;
}
.quiz .opcoes button:hover:not(:disabled) { border-color: var(--tinta-suave); }
.quiz .opcoes button:disabled { cursor: default; opacity: .55; }
.quiz .opcoes button.certa   { border-color: var(--crianca); background: var(--crianca-bg); opacity: 1; }
.quiz .opcoes button.errada  { border-color: var(--destaque); background: var(--destaque-bg); opacity: 1; }

.quiz .retorno {
  margin: .9rem 0 0;
  font-size: .92rem;
  line-height: 1.5;
  color: var(--tinta-suave);
}
.quiz .retorno:empty { display: none; }

/* Na impressão: mostra tudo, sem estado de acerto/erro. */
@media print {
  .quiz .opcoes button { opacity: 1; background: #fff; border-color: #bbb; }
  .quiz .retorno { display: none; }
}