.embed .topbar,
.embed .sidebar,
.embed .footer,
.embed .cookie-banner,
.embed [data-embed-hide] { display: none !important; }

.embed body { margin: 0; }
.embed .container { padding-top: 0; padding-bottom: 0; }
.embed .card { box-shadow: none; border: 0; }

/* «Отключить, но оставить в DOM» */
.embed [data-embed-disable], .embed [data-embed-disable] * {
  pointer-events: none !important;
  opacity: .5;
  filter: grayscale(1);
}

.dynamic-button {
	background: linear-gradient(270deg, #0078D7, #00aaff, #0078D7);
	background-size: 600% 600%;
	color: white;
	border: 1px solid #0078D7;
	padding: 5px 15px 5px 15px;
	border-radius: 5px;
	font-weight: bold;
	cursor: pointer;
	transition: box-shadow 0.3s ease;
	animation: idleGradient 10s ease infinite;
	box-shadow: 0 1px 3px 0 rgba(20,50,80,0.70);
	max-height: 35px;
	vertical-align: middle;
}

.dynamic-button:hover {
	animation: hoverGradient 2s ease infinite;
	box-shadow: 0 0 3px rgba(0, 120, 215, 0.7);
}

.dynamic-button-small {
	background: linear-gradient(270deg, #0078D7, #00aaff, #0078D7);
	background-size: 300% 300%;
	color: white;
	border: none;
	padding: 0px 5px 0px 5px;
	border-radius: 2px;
	font-weight: bold;
	cursor: pointer;
	transition: box-shadow 0.3s ease;
	animation: idleGradient 10s ease infinite;
	box-shadow: 0 2px 5px 0 rgba(20,50,80,0.70);
	max-height: 25px;
	vertical-align: middle;
}

.dynamic-button-small:hover {
	animation: hoverGradient 2s ease infinite;
	box-shadow: 0 0 10px rgba(0, 120, 215, 0.7);
}


@keyframes idleGradient {
	0% { background-position: 0% 50%; }
	50% { background-position: 100% 50%; }
	100% { background-position: 0% 50%; }
}

@keyframes hoverGradient {
	0% { background-position: 0% 50%; }
	50% { background-position: 100% 50%; }
	100% { background-position: 0% 50%; }
}

.gradient-img {
    position: relative;
    z-index: 1;
    border-radius: 8px;
    overflow: hidden;
    display: inline-block;
    animation: shimmerMove 6s ease infinite;
    -webkit-mask-image: linear-gradient(
        270deg,
        rgba(0, 120, 215, 0.6),
        rgba(0, 120, 215, 1),
        rgba(0, 120, 215, 0.6)
    );
    -webkit-mask-size: 400% 100%;
    mask-image: linear-gradient(
        270deg,
        rgba(0, 120, 215, 0.6),
        rgba(0, 120, 215, 1),
        rgba(0, 120, 215, 0.6)
    );
    mask-size: 400% 100%;
}

@keyframes shimmerMove {
    0% { -webkit-mask-position: 0% 0%; mask-position: 0% 0%; }
    100% { -webkit-mask-position: 100% 0%; mask-position: 100% 0%; }
}

/* CRT Анимация при загрузке страницы */

/* Фоновая картинка с fade-in */
/*
body {
    margin: 0;
    height: 100vh;
    width: 100vw;
    overflow: hidden;
    background: #000;
    font-family: Arial, sans-serif;
}*/


#ai-bg-fade {
  position: fixed;
  left: 0; top: 0; width: 100vw; height: 100vh;
  pointer-events: none;
  z-index: 99; /* поверх canvas, но под контентом */
  background: url("/static/images/deep_space_nebula.jpg") top center / 100% repeat; 
  animation: parallaxZoom 30s ease-in-out infinite alternate;
  transition: width 0.3s ease-in-out;
  opacity: 1;
  transition: none !important;
}
@keyframes parallaxZoom {
	0% {
		background-size: 100%;
		background-position: 50% 0%;
	}
	30% {
		background-size: 105%;
		background-position: 48% 2%;
	}
	70% {
		background-size: 108%;
		background-position: 52% 4%;
	}
	100% {
		background-size: 100%;
		background-position: 50% 0%;
	}
}
#matrix-bang {
  position: fixed;
  left: 0; top: 0; width: 100vw; height: 100vh;
  z-index: 100;
  pointer-events: none;
}
#main-content {
  position: relative;
  z-index: 200;
}

#page-fade {
  position: fixed;
  z-index: 99999;
  left: 0; top: 0; width: 100vw; height: 100vh;
  background: #000;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.7s cubic-bezier(.7,0,.3,1);
}

@media screen and (max-width: 768px) {
.dynamic-button {
	background: linear-gradient(270deg, #0078D7, #00aaff, #0078D7);
	background-size: 600% 600%;
	color: white;
	border: 1px solid #0078D7;
	padding: 2px 5px 2px 5px;
	border-radius: 5px;
	font-weight: normal;
	font-size: 14px;
	cursor: pointer;
	transition: box-shadow 0.3s ease;
	animation: idleGradient 10s ease infinite;
	box-shadow: 0 2px 10px 0 rgba(20,50,80,0.70);
	max-height: 35px;
	vertical-align: middle;
}

.dynamic-button:hover {
	animation: hoverGradient 2s ease infinite;
	box-shadow: 0 0 10px rgba(0, 120, 215, 0.7);
}

.dynamic-button-small {
	background: linear-gradient(270deg, #0078D7, #00aaff, #0078D7);
	background-size: 300% 300%;
	color: white;
	border: none;
	padding: 0px 5px 0px 5px;
	border-radius: 2px;
	font-weight: bold;
	cursor: pointer;
	transition: box-shadow 0.3s ease;
	animation: idleGradient 10s ease infinite;
	box-shadow: 0 2px 5px 0 rgba(20,50,80,0.70);
	max-height: 25px;
	vertical-align: middle;
}

.dynamic-button-small:hover {
	animation: hoverGradient 2s ease infinite;
	box-shadow: 0 0 10px rgba(0, 120, 215, 0.7);
}


@keyframes idleGradient {
	0% { background-position: 0% 50%; }
	50% { background-position: 100% 50%; }
	100% { background-position: 0% 50%; }
}

@keyframes hoverGradient {
	0% { background-position: 0% 50%; }
	50% { background-position: 100% 50%; }
	100% { background-position: 0% 50%; }
}
}

