Is there a pure CSS way to continue ordered list numbering across 2 seperated ordered list?

Question

Demo: https://jsfiddle.net/jacobgoh101/uqrkaodc/3/

<ol>
  <li>a</li>
</ol>
<ul>
  <li>b</li>
</ul>
<ol>
  <li>c</li>
  <li>d</li>
  <li>e</li>
</ol>

ol li {
  counter-increment: list-0;
  list-style: none;
}

ol li:before {
  content: counter(list-0, decimal) '. ';
}

current outcome

1 a
• b
1 c
2 d
3 e

Is there a way to achieve this outcome below?

intended outcome

1 a
• b
2 c
3 d
4 e

(Context: Trying to make nested list work with QuillJS. https://github.com/quilljs/quill/issues/979)

UPDATE:

Due to the limitation of the QuillJS library, I am not really able to add start="2" to the ol or change the HTML structure.

I think I need a pure CSS solution, if possible.

Answer 1

ol {
  list-style-type: none;
  /* Remove default numbering */
}

ol > li:before {
  counter-increment: mycounter;
  content: counter(mycounter) ". ";
}

ol:first-of-type {
  counter-reset: mycounter;
}

<ol>
  <li>a</li>
</ol>
<ul>
  <li>b</li>
</ul>
<ol>
  <li>c</li>
  <li>d</li>
  <li>e</li>
</ol>

Answer 2

If you can wrap those OL/UL into a common parent element, then you can reset the counter on that parent, and increment it for ol li only:

div {
  counter-reset: list-0;
}

ol li {
  counter-increment: list-0;
  list-style: none;
}

ol li:before {
  content: counter(list-0, decimal) '. ';
}

<div>
  <ol>
    <li>a</li>
  </ol>
  <ul>
    <li>b</li>
  </ul>
  <ol>
    <li>c</li>
    <li>d</li>
    <li>e</li>
  </ol>
</div>