Use attribute selector instead of class to avoid prefixing the wrong class

[adamwathan]

This PR swaps any usage of .lead in our default CSS for [class~="lead"] to avoid a unexpected output when generating the responsive variants of the prose class.

Currently, Tailwind always adds the responsive prefix (sm: for example) to the last class in a selector, and only that class. That means that before this PR, we were getting output like this:

@media (min-width: 640px) {
  .sm\:prose {
    color: #4a5568;
    max-width: 65ch;
  }

  .prose .sm\:lead {
    color: #4a5568;
    font-size: 1.25em;
    /* ... */
  }

  .sm\:prose a {
    color: #1a202c;
    text-decoration: underline;
  }

  /* ... */
}

Notice how the second selector is incorrect, it should be .sm\:prose .lead for the plugin to behave the way people expect.

Tailwind's behavior is justifiable and makes more sense in a lot of circumstances, which means this is a hard problem to solve at its very root.

This solution is sort of a temporary-but-maybe-permanent workaround until we decide if there's a good way to solve this in Tailwind itself.