Replace default mouse cursor in Gmail and Chromium

I am trying to replace the default (ugly) mouse cursors that Gmail uses within Chromium. This problem does not happen in Firefox.

So far, I have the following code…

1. I detect the custom icon
2. I replace that icon by local one by appending a property to head

This does seem to work, but the default icon still appears, as it first needs to be detected.

Is there a better approach to accomplish my goal?

let custom_cursor_a = 'url("https://ssl.gstatic.com/ui/v1/icons/mail/images/2/openhand.cur") 7 5, default';
let custom_cursor_b = 'url("https://ssl.gstatic.com/ui/v1/icons/mail/images/2/closedhand.cur") 7 5, move';
document.addEventListener('mouseover',function(e){
  var cursor = getComputedStyle(e.target).cursor;
  //console.log(cursor);
  const cursorStyle = document.createElement('style');
  cursorStyle.id = 'cursor-style';
  if (cursor == custom_cursor_a) {
    console.log("custom_cursor_a");
    cursorStyle.innerHTML = '* {cursor: -webkit-grab !important; cursor: -moz-grab !important; cursor: -o-grab !important; cursor: -ms-grab !important; cursor: grab !important}';
    document.head.appendChild(cursorStyle);
  } else {
    if (cursor == custom_cursor_b) {
      console.log("custom_cursor_b");
      cursorStyle.innerHTML = '* {cursor: -webkit-grabbing !important; cursor: -moz-grabbing !important; cursor: -o-grabbing !important; cursor: -ms-grabbing !important; cursor: grabbing !important;}';
      document.head.appendChild(cursorStyle);
    } else {
      console.log(cursor);
      if (document.getElementById('cursor-style')) { document.getElementById('cursor-style').remove(); }
    }
  }
});