Фоновый фильтр не работает после включения API View Transitions и назначения имени view-transition-name ⇐ Javascript

[Anonymous]

Я реализую плавные переходы страниц с помощью View Transitions API в своем svelte-приложении.
Вот проблема, с которой я столкнулся: после установки пользовательского корня перехода представления и присвоения имени view-transition-name моему основному контейнеру и нижней панели навигации CSS-фоновый фильтр (и -webkit-backdrop-filter) в моей нижней навигации полностью перестает работать.
До добавления свойства view-transition-name все работало отлично.
before
введите сюда описание изображения
after
введите здесь описание изображения
.main-container {
position: relative;
height: 100dvh;
overflow: hidden;
isolation: isolate;
z-index: 2;
view-transition-name: main;
}

.bottomBar_wrapper {
position: relative;
overflow: hidden;
border-top: var(--theme-nav-border);
isolation: isolate;
z-index: 3;
view-transition-name: bottom-navigation;
}

.bottomBar_wrapper::before {
content: "";
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
z-index: 1;
isolation: isolate;
background: var(--theme-bottom-navbar-background-before) !important;
backdrop-filter: var(--theme-nav-backdrop-filter-blur) !important;
-webkit-backdrop-filter: var(--theme-nav-backdrop-filter-blur) !important;
}

.bottomBar_wrapper::after {
content: "";
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
z-index: 100;
isolation: isolate;
background: var(--theme-bottom-navbar-background-after) !important;
}

html:active-view-transition-type(forwards) {
&::view-transition-old(main) {
animation-name: slide-out-to-left;
}
&::view-transition-new(main) {
animation-name: slide-in-from-right;
}
}
html:active-view-transition-type(backwards) {
&::view-transition-old(main) {
animation-name: slide-out-to-right;
}
&::view-transition-new(main) {
animation-name: slide-in-from-left;
}
}


Подробнее здесь: https://stackoverflow.com/questions/797 ... signing-vi