/* Mini-test dentro de los artículos.
 * Hereda el color del texto de la página (los artículos son oscuros y las
 * fichas de tema claras), así que no fija ni fondo ni color de letra salvo en
 * los estados de acierto y fallo, que sí deben leerse igual en ambos. */
.ob-mt {
  margin: 38px 0;
  padding: 24px 24px 26px;
  border: 1px solid rgba(127, 127, 127, .3);
  border-radius: 16px;
}
.ob-mt-cab h2 { margin: 0 0 6px; font-size: 21px; line-height: 1.25; }
.ob-mt-cab p { margin: 0 0 16px; opacity: .78; font-size: 15px; }
.ob-mt-paso {
  margin: 0 0 8px; font-size: 12px; letter-spacing: .09em;
  text-transform: uppercase; opacity: .6;
}
.ob-mt-enunciado { margin: 0 0 14px; font-weight: 600; line-height: 1.5; }
.ob-mt-opciones { display: flex; flex-direction: column; gap: 8px; }
.ob-mt-op {
  display: flex; align-items: flex-start; gap: 10px; width: 100%;
  padding: 12px 14px; text-align: left; font: inherit; font-size: 15px;
  color: inherit; background: rgba(127, 127, 127, .07);
  border: 1px solid rgba(127, 127, 127, .28); border-radius: 11px;
  cursor: pointer; transition: border-color .15s, background .15s;
}
.ob-mt-op:hover:not(:disabled) { border-color: rgba(127, 127, 127, .6); }
.ob-mt-op:disabled { cursor: default; }
.ob-mt-op:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
.ob-mt-letra {
  flex: 0 0 auto; width: 22px; height: 22px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 700; background: rgba(127, 127, 127, .18);
}
.ob-mt-op.acierto { border-color: #16a34a; background: rgba(22, 163, 74, .14); }
.ob-mt-op.fallo { border-color: #dc2626; background: rgba(220, 38, 38, .12); }
.ob-mt-exp {
  margin: 14px 0 0; padding-left: 12px; font-size: 14.5px; line-height: 1.6;
  border-left: 3px solid rgba(127, 127, 127, .35); opacity: .92;
}
.ob-mt-nota { margin: 0 0 4px; font-size: 26px; font-weight: 800; }
.ob-mt-btn {
  margin-top: 16px; padding: 12px 20px; font: inherit; font-weight: 700;
  font-size: 15px; color: inherit; background: rgba(127, 127, 127, .12);
  border: 1px solid rgba(127, 127, 127, .35); border-radius: 11px; cursor: pointer;
}
.ob-mt-btn:hover:not(:disabled) { background: rgba(127, 127, 127, .2); }
.ob-mt-btn:disabled { opacity: .6; cursor: default; }
.ob-mt-btn:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
.ob-mt-cta {
  display: inline-block; margin: 16px 12px 0 0; padding: 13px 22px;
  border-radius: 12px; background: linear-gradient(135deg, #2563eb, #1d4ed8);
  color: #fff; font-weight: 700; text-decoration: none;
}
.ob-mt-cta:hover { filter: brightness(1.08); }
@media (prefers-reduced-motion: reduce) {
  .ob-mt-op { transition: none; }
}