Disable video background if data saver is enabled on visitor device

Hello Webflow community,

I made a fixed video overlay using some custom code for my webflow project to get a vhs effect. This top layer received some “.layer {pointer-events: none;}” in custom code to get layers behind clickable. Custom code also been added to make the video in overlay blending mode. Display perfectly on desktop and mobile EXCEPT if low power mode is activated on iPhone. I know this is normal and explained in the video background university, but I would like to hide the video if this data saver is enable, because a play button appear in that case, none clickable (because of the {pointer-events: none;}). Did anyone know how can I hide this play button if data saver is enable on device without deleting the video for mobile devices?

Another question can I use some custom code to display my overlay in project settings so I can let it hidden in designer, to avoid hiding it and display it back after any modification?

Thanks to anyone!


Here is my site Read-Only: https://preview.webflow.com/preview/gl0w?utm_medium=preview_link&utm_source=dashboard&utm_content=gl0w&preview=1bd4be1d4a7adabc9185be46c20c985e&mode=preview (“new home” page, overlay final result only viewable on live site : https://gl0w.webflow.io/new-home)