I need an HTML ordered list with black circled numbers:

❶ ❷ ❸ ❹ ❺ ❻ ❼ ❽ ❾ ❿

Currently, I’m doing this abomination:

<ol>
  <li style="list-style-type: '❶  '">
    First item
  </li>
  <li style="list-style-type: '❷  '">
    Second item
  </li>
</ol>

What’s the best way to achieve this?

Notably, I need:

1. to customize the font of the numbers separately from the text font,
2. to have spacing match the regular unordered list (instead of padding list-style-type with spaces, as in the example),
3. this to work in Safari.