Is it possible to conditionally displaying and hiding of customizer controls for each device preview?

I am working on a WordPress theme and need to allow theme users to set different values for some controls for each device (desktop, tablet, mobile) I am thinking to show/hide device specific variant of some controls on the basis of what device/size user is previewing in customizer (desktop, tablet, mobile).

Is there a way to show/hide controls when user switch devices from customizer responsive previewer?

Also note that I am using Kirki for all my customizer controls, all done using kirki.

Here is a use case to understand this better. I got a typography control for headlines as follows.

Kirki::add_field( 'start', array(
'type'        => 'typography',
'settings'    => 'headings_typography',
'label'       => __( 'Headings', 'start' ),
'section'     => 'base_typography',
'transport' => 'auto',
'default'     => array(
    'font-family'    => '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif',
    'variant'        => 'regular',
),
'output'      => array(
    array(
        'element' => array( 'h1', 'h2', 'h3', 'h4', 'h5', 'h6' ),
    ),
),
) );

I may create 2 more variants of the same control each for (desktop, tablet & mobile) and may output the values based on media queries.

The only thing I am not able to do is how to show/hide control for device-specific preview in the customizer?

TIA,
Munir