I think its just a sequence issue. The chart seems to be rendered before you get the data from the wired apex method. 

You need to make sure that before you render the chart, scripts and the data are loaded.

Also, you need to make sure that the chart resources are loaded only once. For that, you need to set a property when the loading is complete.

So in the innermost `loadScript` call create and set a flag `chartResourcesLoaded` to true.

	...
	loadScript(this, HIGHCHARTS + "/accessibility.js")
	.then(() => {
		this.chartResourcesLoaded = true;
		this.runHighcharts();
	}
	...

Now, you also need to make sure that the code in the `runHighcharts()` function does not run until you get the data from the wired call. So wrap that code in `if` condition like below.

     runHighcharts() {
    	if(this.chartResourcesLoaded  && this.data){
    		// all your existing code
    	}
     }


 Also please note that you are using a wrong query selector to get the container of the chart. 

    this.template.querySelector('div')

With the above, you are never sure which div you are querying. So instead of using the generic selector, add a class(say `chart-container`) to the div in which you want to render the chart and use the class selector like below.

    this.template.querySelector('.chart-container')