how to add curved edges to a gauge in Highcharts

Question

I'm seeking assistance in implementing curved edges for a gauge chart in Highcharts. Essentially, I aim to achieve a border radius effect on the gauge edges.

below is my option props of highChart:

const options = {
        chart: {
            type: 'gauge',
            plotBackgroundColor: 'white',
            plotBorderWidth: 0,
            plotShadow: false,
            height: '200px',
        },
        title: {
            text: title,
            verticalAlign: 'bottom',
            align: 'center',
            style: {
                color: '#414D55',
                fontSize: '11px',
                fontWeight: 'bold'
            }
        },
        pane: {
            startAngle: -130,
            endAngle: 130,
            center: ['50%', '75%'],
            size: '160px', 
            background: null,
        },
        yAxis: {
            min,
            max,
            minorTickInterval: 'auto',
            minorTickLength: 2,
            minorTickPosition: 'inside',
            tickInterval: tickInterval,
            tickLength: 2,
            tickWidth: 0,
            offset: -24,
            labels: {
                distance: -12,
                style: {
                    fontSize: '10px',
                }
            },
            lineWidth: 0,
            plotBands: plotBands
        },
        series: [
            {

                name: '',
                data: [min],
                tooltip: {
                    valueSuffix: '',
                    visible: false
                },
                dataLabels: {
                    enabled: false
                },
                dial: {
                    radius: '72%', 
                    backgroundColor: '#414D55',
                    baseWidth: 2.8,  
                    baseLength: '0%',
                    rearLength: '0%',
                    length: 0,
                    zIndex: 123
                },

                
                pivot: {
                    backgroundColor: '#414D55',
                    radius: 1.5,
                    length: 0,
                    zIndex: 230
                },
                states: {
                    hover: {
                        enabled: false,
                    }
                }
            }]
    }; 

I've added the background with these properties. Although it doesn't work at all:

background: [{
            outerRadius: '112%',
            innerRadius: '88%',
            backgroundColor: Highcharts.color(Highcharts.getOptions().colors[0])
                .setOpacity(0.3)
                .get(),
            borderWidth: 0
        }]