You can't (unless there's a trick I don't know) change the width of the scrollbar when hovering over it. However... you can keep the width constant and have the apparent-width of the scroll thumb be determined by transparent borders.

This would give the appearance of your current 2px scrollbar, but it'd be usable, and would visually expand out to show its grabbable area on hover:

  html::-webkit-scrollbar {
   width: 8px;
  }
  html::-webkit-scrollbar-track {
   background-color: transparent
  }
  html::-webkit-scrollbar-thumb {
   background: #d73f00;
   background-clip: padding-box;
   border-left: 6px solid transparent;
  }
  html::-webkit-scrollbar-thumb:hover {
   border: 0;
  }

(The key to it is the background-clip property, that lets you use the border to control where the background is drawn.)

You could also do exactly-this but without the :hover state, and it'd effectively just increase the grabbable-area of the thumb without any visual change to your current style. I like changing the visible width as a form of feedback though. :D