Support <style scoped> to apply inline style to current page

[yhatt]

By default, the content of inline <style> is appended to the end of theme and would effect to whole of slide deck. It is useful for tweaking current theme, but we thought some people want to apply style only to current page.

Currently it could apply customized section CSS to single page by the combination with class spot directive.

<!-- _class: title -->

<style>
section.title h1 {
  text-align: center;
}
</style>

# Centered!

---

# Aligned to left

However, this way is a bit verbose. If you don't intend to re-use style, it may nice to be able writing scoped style to current page like this:

<style scoped>
h1 {
  text-align: center;
}
</style>

# Centered!

It would convert into scoped HTML and CSS. The scoping target is section element for slide page.

<section data-marpit-scope-d318a2c1>
  <h1>Centered!</h1>
</section>

section[data-marpit-scope-d318a2c1] h1 {
  text-align: center;
}

We would have to make it be able to change enable or disable in Marpit constructor. <style scoped> is already removed from the specification of HTML, and not supported on modern browsers. Nevertheless, this syntax is still favored in Vue component.