Несовместимость некоторых эффектов панели div в css ⇐ CSS

[Anonymous]

Мне нужно, чтобы фон размывал изображение на 15 пикселей и имел прозрачность 10 %,
и что еще интереснее, это граница, которая должна иметь градиент от левого верхнего угла к правому нижнему, будучи полупрозрачным и с закругленными краями. Задача казалась проще, пока после двух дней попыток я не зашел в тупик.
код для ближайшего варианта:

Код: Выделить всё

body {
background-image: url("images\\PC_register_with_3d_elements.png");
background-position: center top 50%;
background-size: cover;
}

.global_labels {
color: white;
text-align: center;
margin-top: 150px;
}

.projname_label {
font-size: 120%;
font-family: "Montserrat", sans-serif;
}

.welcome_label {
margin-top: 10px;
font-size: 200%;
font-family: "Montserrat", sans-serif;
}

.global_registration_widget {
background-image: linear-gradient(rgba(112, 112, 112, 0.05), rgba(112, 112, 112, 0.05)), radial-gradient(circle at top left, rgba(255, 255, 255, 0.25), rgba(255, 255, 255, 0.05));
background-origin: border-box;
background-clip: padding-box, border-box;
border: Mixed solid;
border-image-source: linear-gradient(135deg, rgba(255, 255, 255, 0.25) 0%, rgba(255, 255, 255, 0.05) 50%);
border: 3px solid transparent;
border-radius: 20px;
backdrop-filter: blur(15px);
margin: auto;
margin-top: 30px;
width: 377px;
height: 595px;
top: 269px;
left: 530px;
border-radius: 20px;
opacity: 0px;
}

Код: Выделить всё

projname

Добро пожаловать!

ссылка:


помогите мне с фоном div и рамкой, пожалуйста, заранее спасибо!
P.S. Я проверяю большую часть варианта решения, но он не работает

Подробнее здесь: https://stackoverflow.com/questions/783 ... nel-in-css