JSFiddle - React, Tailwind, and code Playground

by int32_t

HTML

Shadow DOM<br>
<input value=before>

CSS

button { -webkit-appearance:none; }

JavaScript

const parent = document.createElement('div');
const shadow1 = parent.attachShadow({mode:'closed'});
parent.tabIndex = -1;
shadow1.innerHTML = '<style>button { -webkit-appearance:none; }</style><button type=button>Button</button>';
document.body.appendChild(parent);
document.body.insertAdjacentHTML('beforeend', '<input value=after>' +
'<div>Light DOM<br><input value=before><div tabidex=-1><button type=button>Button</button></div><input value=after></div>');