Why are there two different results for the numbering of <dl> tags in Edge and Firefox?

The following snippets produce different results in Edge and Firefox:

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-css -->

dd {
  display: list-item;
  list-style-position: inside;
  list-style-type: decimal;
  counter-increment: 1;
}

<!-- language: lang-html -->

<ul>
  <li>A</li>
  <li>B</li>
  <li>C</li>
</ul>
<dl>
  <dt>Title</dt>
  <dd>One</dd>
  <dd>Two</dd>
  <dd>Three</dd>
</dl>

<!-- end snippet -->

In Edge, the <dl> list correctly starts with index 1. On the other hand, that of Firefox is 4.

After I deleted the <ul> node above the <dl> tag, the numbering of the <dd> tags started from 1. I don't know why this happened.

I want the <dd> tags to start from position 1 in Firefox. What should I do?

Looks like Firefox is using the same counter for LI in UL, and DD in DL - but doesn't reset it on the DL element level.

Try adding dl { counter-reset: list-item; }