dotted line in Firefox with clip-path/poligon/rotate

I try to draw a rectangle with clip-path and rotate it. However in Firefox (not in Chrome!) there's a small dotted line around the original size of the div.

<div id="triangle"></div>
#triangle {
 background-color: rgb(158, 0, 0);
 width: 82.5mm;
 height: 50mm;
 transform: rotate(15deg);
 clip-path: polygon(0 0, 75% 100%, 100% 50%);
}

See https://jsfiddle.net/74bit/fvpky15r/9/

Can anyone tell me how to get rid of this line?

Thanks, Witold