:root {
	--a-color-white: #fff;
	--a-font: 'SF Pro Display';
	--a-transition: .2s;
}
html {
	overflow-x: hidden !important;
}

body {
	font-family: var(--a-font);
	background-color: #1e1e1e;
	color: #8e8e8e;
	overflow-x: hidden !important;
}

.max-content {
	width: max-content;
}

/* Header */
header {
	padding: 32px 0px;
}

.search {
	width: 100%;
}

.search__box {
	display: flex;
	column-gap: 4%;
	max-width: 830px;
}

.search__form input {
	width: 100%;
	height: 20px;
	background-color: #262626;
	background-position: 24px;
	background-repeat: no-repeat;
	background-size: 20px;
	border: 1px solid #2e2e2e;
	opacity: .8;
	padding-left: 24px;
	transition: all .2s ease 0s;
	border-radius: 6px;
	color: #fff;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 24px;
	position: relative;
	z-index: 999;
}

.search__form input:hover {
	opacity: 1;
	outline: none;

}

.search__form input:focus {
	background-color: #262626;
	border: 1px solid #409fff;
	border-radius: 8px;
	outline: none;
	opacity: 1;
	box-shadow: 0px 0px 0px 9999px rgba(0, 0, 0, 0.7);
}

.search__form {
	position: relative;
}

.search__btn {
	position: absolute;
	right: 15px;
	top: 12px;
	opacity: .5;
	transition: opacity .2s ease 0s;
	z-index: 1000;
}

.search__btn:hover {
	opacity: 1 !important;
}


.lang__btn {
	height: 50px;
	display: flex;
	align-items: center;
	gap: 10px;
	color: #fff;
	opacity: .5;
	font-size: 14px;
	font-weight: 400;
	line-height: 24px;
	transition: opacity .2s ease 0s;
}

.lang__btn:hover {
	opacity: 1;
}

.user {
	display: flex;
	align-items: center;
	justify-content: end;
	column-gap: 25px;
	height: 50px;

}

.notify__btn {
	opacity: .5;
	transition: opacity .2s ease 0s;
}

.notify__btn:hover {
	opacity: 1;
}

.notify__dropdown {
	padding: 0px;
	width: 320px;
	min-height: 155px;
}


.notify__dropdown .head {
	display: flex;
	align-items: center;
	background: #2e2e2e;
	border-bottom: 1px solid #262626;
	justify-content: space-between;
	padding: 16px 24px;
	border-radius: 8px 8px 0px 0px;
}

.notify__dropdown .head span {
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: .02em;
	line-height: 24px;

}

.notify__dropdown p {
	padding: 12px 24px;
	color: #8e8e8e;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 24px;
	margin-bottom: 0;
}

/* Login */
.userlogin__btn img {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	object-fit: cover;
}

.user__dropdown {
	width: 274px;
}

.user__dropdown .head {
	padding: 10px 10px 15px;
	display: flex;
	justify-content: space-between;
	border-bottom: 1px solid #2e2e2e;
	margin-bottom: 10px;
}

.user__dropdown .logout__btn {
	opacity: .5;
	transition: opacity .2s ease 0s;
	margin-top: 5px;
}

.user__dropdown .logout__btn:hover {
	opacity: 1;
}

.user__dropdown .name {
	line-height: 24px;
	text-transform: capitalize;
	color: #fff;
}

.user__dropdown .name:hover {
	text-decoration: underline;
}

.user__dropdown .email {
	color: #8e8e8e;
	font-size: 12px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 20px;
	margin-bottom: 0;
	margin-top: 3px;
}

.user__nologin {
	display: flex;
	justify-content: end;
	align-items: center;
	height: 50px;
}

.gohome__btn {
	display: flex;
	gap: 5px;
	align-items: center;
	color: var(--a-color-white) !important;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 24px;
	opacity: .5;
	transition: var(--a-transition);
	margin-bottom: 20px;
	width: max-content;
}

.gohome__btn:hover {
	opacity: 1;
}

.login__container {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100vh;
	width: 100%;
}

.login__container .content {

	max-width: 500px;
	width: 100%;
}

.login__form {
	padding: 32px;
	background: linear-gradient(157.87deg, hsla(0, 0%, 100%, .06), hsla(0, 0%, 100%, .024));
	border-radius: 8px;
	backdrop-filter: blur(12px);
	position: relative;
}

.login__form::before {
	background: linear-gradient(157.87deg, hsla(0, 0%, 100%, .2), hsla(0, 0%, 100%, .02));
	border-radius: 8px;
	content: "";
	inset: 0;
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	padding: 1px;
	position: absolute;
	z-index: -1;
}

.login__form h2 {
	font-size: 20px;
	letter-spacing: .02em;
	line-height: 32px;
	font-weight: 600;
	color: var(--a-color-white);
}


.login__container .login__footer {
	display: flex;
	justify-content: center;
	column-gap: 10px;
	color: #8e8e8e;
	margin-top: 16px;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 24px;
}

.login__container .login__footer a {
	display: block;
	max-width: max-content;
}

.login__container .login__footer a:hover,
.lostpass__btn:hover {
	text-decoration: underline;
}

.lostpass__btn {
	display: flex;
	justify-content: center;
	margin-top: 8px;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 24px;
}

.social__title {
	display: flex;
	justify-content: center;
	margin-bottom: 16px;
	color: #8e8e8e;
	font-size: 13px;
	font-weight: 400;
	line-height: 16px;
	text-transform: uppercase;
}

.login_btn {
	opacity: .5;
	transition: var(--a-transition);

}

.login_btn:hover {
	opacity: 1;
}

/* Sidebar */
.logo {
	margin-left: 15px;
}

.sidebar {
	height: 100vh;
	position: fixed;
	width: 100%;
	padding-top: 40px;
	z-index: 2;
	top: 0;
	max-width: 220px;
	border-right: 1px solid #2e2e2e;
}

.sidebar .menu {
	display: flex;
	flex-direction: column;
	margin-top: 30px;
	padding-left: 10px;
	list-style: none;
}

.sidebar .menu li {
	display: flex;
	align-items: center;
}

.sidebar .menu .item {
	display: flex;
	align-items: center;
	border-radius: 8px;
	height: 48px;
	column-gap: 12px;
	transition: all .2s ease 0s;
	max-width: 187px;
	width: 100%;
	padding: 0px 12px;

}

.sidebar .menu .item span {
	color: #fff;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 24px;
	opacity: .5;

}

.sidebar .menu .item:hover {
	background: #262626;
}

.sidebar .menu .item svg {
	opacity: .5;
}

.sidebar {
    /* Ваши текущие стили (background, padding, width и т.д.) оставляем */
    
    /* 👇 ДОБАВЛЯЕМ ЭТИ СТРОКИ ДЛЯ СКРОЛЛА 👇 */
    height: calc(100vh - 40px); /* Заставляем сайдбар растягиваться ровно на высоту экрана */
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

/* Нацеливаемся на сам список меню, чтобы скроллился именно он, а не весь сайдбар вместе с логотипом */
.sidebar .acc-menu {
    flex-grow: 1;
    overflow-y: auto; /* Включает вертикальную прокрутку, когда пункты не влезают */
    padding-right: 4px; /* Легкий отступ, чтобы скроллбар не лип к тексту */
}

/* Стилизуем полосу прокрутки под вашу красивую темную тему (чтобы не была уродливой стандартной) */
.sidebar .acc-menu::-webkit-scrollbar {
    width: 4px; /* Делаем её очень тонкой и аккуратной */
}
.sidebar .acc-menu::-webkit-scrollbar-track {
    background: transparent;
}
.sidebar .acc-menu::-webkit-scrollbar-thumb {
    background: #3a3a3a; /* Цвет бегунка скролла */
    border-radius: 4px;
}
.sidebar .acc-menu::-webkit-scrollbar-thumb:hover {
    background: #4a4a4a;
}


.drop__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: #4e4e4e;
	opacity: .5;
	transition: .2s;
	margin-left: -15px;
}

.drop__btn:hover {
	background: #4e4e4e;
	opacity: 1;
}

.sidebar__dropmenu {
	margin-top: 10px;
	;
	width: 255px;

	max-height: 345px;
	overflow-y: auto;
}

.sidebar__dropmenu::-webkit-scrollbar {
	width: 10px;
}

.sidebar__dropmenu::-webkit-scrollbar-track {
	background: #262626;
}

.sidebar__dropmenu::-webkit-scrollbar-thumb {
	background-color: #4e4e4e;
	border-radius: 20px;
	border: 3px solid #262626;
}


.favourites_nologin {
	color: #8e8e8e;
	font-size: 12px;
	font-weight: 400;
	line-height: 20px;
}

.favourites {
	padding-left: 25px;
	margin-top: 20px;
}

.favourites .head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-right: 15px;


}

.favourites .head span {
	font-size: 12px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 20px;
	color: #8e8e8e;
	text-transform: uppercase;
}

.favourites p {
	color: #8e8e8e;
	font-size: 12px;
	font-weight: 400;
	line-height: 20px;
	margin-top: 16px;

}

.favourites .right__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	background: #4e4e4e;
	border-radius: 50%;
	opacity: .5;
	width: 24px;
	height: 24px;
	transition: .2s;
}

.favourites .right__btn:hover {
	opacity: 1;
}


footer {
	padding: 0px 18px 32px;
	position: fixed;
	bottom: 0;
	max-width: 220px;
	z-index: 3;
}

footer .menu {
	display: flex;
	flex-wrap: wrap;

}

footer .menu a {
	color: #8e8e8e;
	font-size: 12px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 20px;
}

footer .menu a:hover {
	text-decoration: underline;
}

.btn_menu_mobile {
	background: #262626;
    border: 1px solid #2e2e2e;
    border-radius: 12px;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    padding: 12px;
	opacity: .5;
	transition: all .2s ease 0s;
}
.btn_menu_mobile:hover {
	opacity: 1;
}
/* Main */
main {
	padding-bottom: 300px;
}

/* Carusel */
.main__carusel {
	width: 100%;
	height: 400px;
	overflow: hidden;
	border-radius: 10px;
	position: relative;
}

.main__carusel .cover img {
	width: 100%;
	height: 400px;
	object-fit: cover;
}

.main__carusel .info {
	position: absolute;
	top: 0;
	left: 0;
	padding: 36px 32px;
	max-width: 362px;
	color: var(--a-color-white);
}

.main__carusel .info p {
	margin-bottom: 16px;
	font-size: 14px;
	font-weight: 400;
	line-height: 24px;
	text-transform: uppercase;
}

.main__carusel .info h5 {
	font-size: 20px;
	letter-spacing: .02em;
	line-height: 32px;
	font-weight: 600;
	margin-bottom: 24px;
}

.owl-main {
	padding-bottom: 30px;
}


/* Widgets */
.title__main {
	display: flex;
	align-items: end;
	justify-content: space-between;
	margin-top: 32px;
	margin-bottom: 16px;
}

.title__main h2 {
	color: #fff;
	font-weight: 600;
	font-size: 20px;
	letter-spacing: .02em;
	line-height: 32px;
	margin-bottom: 0;
}

.title__main a {
	font-size: 12px;
	font-weight: 600;
	line-height: 20px;
	transition: .2s;
}

.title__main a:hover {
	text-decoration: underline;
}

/* Lostpassword */
.lostpass__capha img {
	max-height: 50px;
	border-radius: 5px;
}

/* Static */
.static {
	max-width: 740px;
}

.static h1 {
	color: var(--a-color-white);
	font-weight: 600;
	font-size: 32px;
	line-height: 40px;
}

.static .text {
	color: var(--a-color-white);
	font-size: 16px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 24px;
}


/* Userinfo */
.userinfo .content {
	max-width: 750px;
}

.userinfo h1 {
	color: var(--a-color-white);
	font-size: 32px;
	line-height: 40px;
	font-weight: 600;
}

.avatar__box {
	display: flex;
	justify-content: center;
}

.avatar__box .avatar {
	width: 80px;
	height: 80px;

	position: relative;

}

.avatar__box .avatar img {
	width: 80px;
	height: 80px;
	object-fit: cover;
	border-radius: 50%;
}

.avatar__box .online {
	background: #00ab00;
	border: 4px solid #262626;
	border-radius: 50px;
	display: block;
	height: 23px;
	width: 23px;
	position: absolute;
	right: 0;
	top: 0;
}

.avatar__box .offline {
	background: #e32323;
	border: 4px solid #262626;
	border-radius: 50px;
	display: block;
	height: 23px;
	width: 23px;
	position: absolute;
	right: 0;
	top: 0;
}

.user__count {
	display: flex;
	justify-content: center;
	gap: 45px;
	margin: 24px 0;
	padding: 16px 48px;
	background: #2e2e2e;
	border-radius: 16px;
	text-align: center;
	max-width: 350px;
	width: 100%;
}

.user__count h5 {
	font-size: 20px;
	font-weight: 600;
	line-height: 24px;
}

.user__count p {
	color: #8e8e8e;
	font-size: 13px;
	line-height: 18px;
	margin-top: 4px;
	margin-bottom: 0;
}


input[type='checkbox'] {
	position: absolute;
	z-index: -1;
	opacity: 0;
}

input[type='checkbox']+label {
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;

}

input[type='checkbox']+label::before {
	content: '';
	display: inline-block;
	flex-shrink: 0;
	flex-grow: 0;
	width: 24px;
	height: 24px;
	border-radius: 0.25em;
	background-repeat: no-repeat;
	background-position: center center;
	margin-left: -15px;
	margin-right: 10px;
	background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3e%3cpath stroke='%238E8E8E' d='M12 21.5c-3.722 0-6.044-.627-7.459-2.041C3.127 18.044 2.5 15.722 2.5 12c0-3.722.627-6.044 2.041-7.459C5.956 3.127 8.278 2.5 12 2.5c3.722 0 6.044.627 7.459 2.041C20.873 5.956 21.5 8.278 21.5 12c0 3.722-.627 6.044-2.041 7.459C18.044 20.873 15.722 21.5 12 21.5Z'/%3e%3c/svg%3e");
	transition: .2s;
}

input[type='checkbox']:checked+label::before {

	background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3e%3cpath fill='%230080FF' fill-rule='evenodd' d='M2 12c0 7.5 2.5 10 10 10s10-2.5 10-10S19.5 2 12 2 2 4.5 2 12Z' clip-rule='evenodd'/%3e%3cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m9 12 2 2 4-4'/%3e%3c/svg%3e");
}


input[type='checkbox']:not(:disabled):not(:checked)+label:hover::before {
	background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3e%3cpath fill='url(%23a)' fill-opacity='.06' stroke='%238E8E8E' d='M12 21.5c-3.722 0-6.044-.627-7.459-2.041C3.127 18.044 2.5 15.722 2.5 12c0-3.722.627-6.044 2.041-7.459C5.956 3.127 8.278 2.5 12 2.5c3.722 0 6.044.627 7.459 2.041C20.873 5.956 21.5 8.278 21.5 12c0 3.722-.627 6.044-2.041 7.459C18.044 20.873 15.722 21.5 12 21.5Z'/%3e%3cdefs%3e%3clinearGradient id='a' x1='2' x2='11.817' y1='2' y2='26.141' gradientUnits='userSpaceOnUse'%3e%3cstop stop-color='%23fff'/%3e%3cstop offset='1' stop-color='%23fff' stop-opacity='.4'/%3e%3c/linearGradient%3e%3c/defs%3e%3c/svg%3e");
}


input[type='checkbox']:not(:disabled):checked+label:hover::before {
	background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3e%3cpath fill='%23409FFF' fill-rule='evenodd' d='M2 12c0 7.5 2.5 10 10 10s10-2.5 10-10S19.5 2 12 2 2 4.5 2 12Z' clip-rule='evenodd'/%3e%3cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m9 12 2 2 4-4'/%3e%3c/svg%3e");
}

.timezones select {
	background: #262626;

	border: 1px solid #4e4e4e;
	border-radius: 6px;
	-webkit-box-shadow: none;
	box-shadow: none;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	color: #fff;
	display: inline-block;
	font-size: 14px;
	font-weight: 400;
	height: 50px;
	letter-spacing: .04em;
	line-height: 24px;
	opacity: .8;
	padding: 12px 32px 12px 16px;
	position: relative;
	-webkit-transition: all .2s ease 0s;
	-o-transition: all .2s ease 0s;
	transition: all .2s ease 0s;
	width: 100%;
	z-index: 1;
	opacity: .5;
}

.timezones,
.user__item {
	position: relative;
}

.timezones::after,
.user__item::after {
	content: '';
	position: absolute;
	z-index: 3;
	top: 45px;
	right: 17px;
	opacity: .5;
	width: 24px;
	height: 24px;
	background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg height='24' width='24' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='none' fill-rule='evenodd'%3e%3cpath d='M0 0h24v24H0z'/%3e%3cpath d='M0 0h24v24H0z'/%3e%3cpath d='M7 10l5 5 5-5' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5'/%3e%3c/g%3e%3c/svg%3e");
	background-repeat: no-repeat;
	transition: var(--a-transition);
}

select {
	font: inherit;
	letter-spacing: inherit;
	word-spacing: inherit;
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
}

select::-ms-expand {
	display: none;
}

.timezones select:hover,
.timezones:hover::after {
	opacity: 1;
}

.timezones select:focus {
	background-color: #262626;
	border: 1px solid #409fff;
	outline: none;
}

.checkbox {
	margin-bottom: 10px;
}

.checkbox label {
	font-size: 14px;
	font-weight: 400;
	line-height: 24px;
	color: var(--a-color-white);
	margin-left: 10px;
}

.avatar__upload {
	background: #262626;
	border: 1px solid #4e4e4e;
	border-radius: 6px;
	color: #fff;
	opacity: .5;
	transition: var(--a-transition);
	height: 50px;
	padding-top: 11px;
	padding-left: 10px;
	width: 100%;
	display: block;
	overflow: hidden;
}

.avatar__upload:hover {
	opacity: 1;
}

.sociallogin {
	border-radius: 6px;
	transition: all .2s ease 0s;
	padding: 8px 16px;
	color: #fff;
	background-color: #262626;
	background-clip: padding-box;
	border: 1px solid #4e4e4e;
	height: 50px;
	display: flex;
	align-items: center;
}

.sociallogin .vk {
	display: flex;
	align-items: center;
	background: #4e4e4e;
	border-radius: 4px;
	padding: 6px 8px;
	font-size: 12px;
	font-weight: 600;
	line-height: 20px;
	color: var(--a-color-white);
}

.sociallogin .vk::before {
	background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='32' height='32' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M17.161 24C8.278 24 3.211 17.994 3 8h4.45c.146 7.335 3.426 10.442 6.025 11.083V8h4.19v6.326c2.566-.272 5.261-3.155 6.17-6.326h4.19c-.698 3.908-3.621 6.79-5.7 7.976 2.079.96 5.408 3.475 6.675 8.024h-4.612c-.99-3.043-3.46-5.397-6.723-5.718V24h-.504z' fill='%23fff'/%3e%3c/svg%3e");
	background-position: 0;
	background-repeat: no-repeat;
	background-size: 24px;
	content: "";
	display: block;
	height: 14px;
	margin-right: 8px;
	width: 24px;
}

.user__field {
	font-size: 14px;
	font-weight: 400;
	line-height: 24px;

	color: #fff;
}

.user__field select {
	display: block;
	width: 100%;
	font-size: 14px;
	font-weight: 300;
	letter-spacing: .04em;
	line-height: 24px;
	opacity: .5;
	color: #fff;
	background-color: #262626;
	background-clip: padding-box;
	border: var(--bs-border-width) solid #4e4e4e;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border-radius: 6px;
	transition: all .2s ease 0s;
	padding: 12px 16px;
}

.user__field select:hover {
	opacity: 1;
}

.user__field select:focus {
	border-color: #409fff;
	outline: 0;
}

.user__item {
	position: relative;
}

.user__item::after {
	content: '';
	position: absolute;
	z-index: 3;
	top: 12px;
	right: 17px;
	opacity: .5;
	width: 24px;
	height: 24px;
	background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg height='24' width='24' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='none' fill-rule='evenodd'%3e%3cpath d='M0 0h24v24H0z'/%3e%3cpath d='M0 0h24v24H0z'/%3e%3cpath d='M7 10l5 5 5-5' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5'/%3e%3c/g%3e%3c/svg%3e");
	background-repeat: no-repeat;
	transition: var(--a-transition);
}

.user__item:hover::after {
	opacity: 1;
}


/* Custom */

/* Apps */
.main__apps {
	display: block;
	background: #262626;
	border: 1px solid #2e2e2e;
	border-radius: 8px;
	overflow: hidden;
	position: relative;
	transition: all .2s ease 0s;
	width: 100%;
	padding: 12px 16px;
	color: var(--a-color-white);
}

.main__apps:hover {
	background: #2e2e2e;
	border: 1px solid #4e4e4e;
}

.main__apps:hover .size {
	opacity: 1;
}

.main__apps .head {
	display: flex;
	justify-content: center;
	flex-shrink: 1;
	position: relative;
}

.main__apps .update {
	background: #4e4e4e;
	border-radius: 100%;
	display: flex;
	flex-shrink: 1;
	width: 20px;
	height: 20px;
	position: absolute;
	left: 0;
	top: 0;
}

.main__apps .cover {
	height: 56px;
	margin-bottom: 15px;
	width: 56px;
	object-fit: cover;
	border-radius: 15px;
	flex-shrink: 1;
	display: block;
}

.main__apps .size {
	background: #262626;
	color: #8e8e8e;
	font-size: 10px;
	font-weight: 600;
	letter-spacing: .04em;
	line-height: 16px;
	padding: 2px 5px;
	text-transform: uppercase;
	height: max-content;
	position: absolute;
	right: 0;
	top: 0;
	opacity: 0;
	transition: var(--a-transition);
	border-radius: 2px;
}

.main__apps h2 {
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 24px;
	color: var(--a-color-white);
	margin-bottom: 5px;
}

.main__apps p {
	color: var(--a-color-white);
	display: block;
	font-size: 12px;
	line-height: 20px;
	margin-bottom: 5px;
}

.main__apps .short {
	font-size: 12px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 20px;
	color: #8e8e8e;
}

/* Game */
.main__game {
	background: #262626;
	border: 1px solid #2e2e2e;
	border-radius: 8px;
	overflow: hidden;
	padding: 0;
	position: relative;
	transition: var(--a-transition);
	display: block;

}

.main__game:hover {
	background: #2e2e2e;
	border: 1px solid #4e4e4e;
}

.main__game .cover {
	width: 100%;
	border-radius: 9px 8px 0px 0px;
	overflow: hidden;
}

.main__game .cover img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.main__game .text {
	padding: 8px 16px;
}

.main__game h2 {
	color: var(--a-color-white);
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 24px;
	margin-bottom: 0;
	margin-bottom: 2px;
}

.main__game .category {
	display: flex;
	color: #8e8e8e;
}

.main__game .category a {
	color: #8e8e8e;
	font-size: 13px;
	transition: var(--a-transition);
}

.main__game .category a:hover {
	text-decoration: underline;
}

.main__game .size,
.main__extensions .size,
.main__os .size {
	position: absolute;
	top: 16px;
	right: 16px;
	background: #262626;
	color: #8e8e8e;
	border-radius: 3px;
	font-size: 10px;
	font-weight: 600;
	letter-spacing: .04em;
	line-height: 16px;
	height: 20px;
	display: flex;
	align-items: center;
	padding: 0px 5px;
	opacity: 0;
	transition: var(--a-transition);
}

.main__game:hover .size,
.main__extensions:hover .size,
.main__os:hover .size {
	opacity: 1;
}

.main__game .new,
.main__extensions .new,
.main__os .new,
.main__store .new,
.main__apps .new {
	position: absolute;
	left: 16px;
	top: 16px;
	background: #0a0;
	font-size: 10px;
	font-weight: 600;
	letter-spacing: .04em;
	line-height: 16px;
	border-radius: 2px;
	text-transform: uppercase;
	padding: 2px 4px;
	color: var(--a-color-white);
}

/* Extensions */
.main__extensions {
	background: #262626;
	border: 1px solid #2e2e2e;
	border-radius: 8px;
	overflow: hidden;
	padding: 0;
	position: relative;
	transition: var(--a-transition);
	display: block;
}

.main__extensions:hover {
	background: #2e2e2e;
	border: 1px solid #4e4e4e;
}

.main__extensions .cover {
	width: 100%;
	/* Включаем режим идеального квадрата */
	aspect-ratio: 1 / 1; 
	overflow: hidden;
	border-radius: 8px 8px 0px 0px;
}

/* Добавьте это правило для самой картинки внутри блока, если его нет */
.main__extensions .cover img {
	width: 100%;
	height: 100%;
	object-fit: cover; /* Картинка аккуратно заполнит квадрат без деформации */
}

.main__extensions .cover img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.main__extensions .text {
	max-height: 68px;
	padding: 8px 16px;
}

.main__extensions .title {
	display: flex;
	justify-content: space-between;
}

.main__extensions .title h2 {
	margin-right: 8px;
	overflow: hidden;
	-o-text-overflow: ellipsis;
	text-overflow: ellipsis;
	white-space: nowrap;
	max-width: calc(100% - 50px);
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 24px;
	color: var(--a-color-white);
	margin-bottom: 2px;
}

.main__extensions .title span {
	color: #8e8e8e;
	display: block;
	font-size: 12px;
	font-weight: 400;
	line-height: 24px;
	overflow: hidden;
	-o-text-overflow: ellipsis;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.main__extensions .category {
	display: flex;
	color: #8e8e8e;
}

.main__extensions .category a {
	color: #8e8e8e;
	position: relative;
	font-size: 12px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 20px;
}

.main__extensions .update,
.main__game .update,
.main__os .update {
	background: #4e4e4e;
	border-radius: 100%;
	display: flex;
	flex-shrink: 1;
	width: 20px;
	height: 20px;
	position: absolute;
	left: 16px;
	top: 16px;
}


/* OS */
.main__os {
	background: #262626;
	border: 1px solid #2e2e2e;
	border-radius: 8px;
	position: relative;
	padding: 12px 16px;
	display: block;
	transition: var(--a-transition);
	text-align: center;
}

.main__os:hover {
	background: #2e2e2e;
	border: 1px solid #4e4e4e;
}

.main__os .cover {
	margin: 0 auto;
	height: 56px;
	margin-bottom: 15px;
	width: 56px;
}

.main__os .cover img {
	width: 100%;
	height: 100%;
	border-radius: 50%;
	object-fit: cover;
}

.main__os h2 {
	color: var(--a-color-white);
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 24px;
}

.main__os p {
	font-size: 12px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 20px;
	color: #8e8e8e;
	margin-bottom: 0;
}

/* Articles */
.main__articles {
	display: block;
	background: #262626;
	border-radius: 8px;
	height: 256px;
	position: relative;
	transition: all .2s ease 0s;
	overflow: hidden;
	border: 1px solid #2e2e2e;
}

.main__articles:hover {
	background: #2b2b2b;
	border: 1px solid #4e4e4e;
}

.main__articles .cover {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.main__articles .date {
	display: block;
	position: absolute;
	top: 16px;
	left: 16px;
	color: #8e8e8e;
	font-size: 12px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 20px;
}

.main__articles .text {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	padding: 16px;
}

.main__articles h2 {
	color: var(--a-color-white);
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 24px;
}

.main__articles p {
	color: #8e8e8e;
	font-size: 12px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 20px;
	-webkit-line-clamp: 3;
	line-clamp: 3;
	word-wrap: break-word;
	-webkit-box-orient: vertical;
	box-orient: vertical;
	display: -webkit-box;
	display: box;
	overflow: hidden;
	-o-text-overflow: ellipsis;
	text-overflow: ellipsis;
	margin-bottom: 0;
}

/* Store */
.main__store {
	background: #262626;
	border: 1px solid #2e2e2e;
	border-radius: 8px;
	overflow: hidden;
	padding: 0;
	position: relative;
	transition: all .2s ease 0s;
	display: block;
}

.main__store:hover {
	border: 1px solid #4e4e4e;
	background: #2e2e2e;
}

.main__store .cover {
	width: 100%;
	border-radius: 8px 8px 0px 0px;
	overflow: hidden;
}

.main__store .cover img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.main__store .text {
	max-height: 68px;
	padding: 6px 16px;
}

.main__store h2 {
	display: block;
	max-width: 100%;
	overflow: hidden;
	-o-text-overflow: ellipsis;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 24px;
	color: var(--a-color-white);
	margin-bottom: 0px;
}

.main__store .price {
	color: var(--a-color-white);
	display: flex;
	gap: 8px;
	justify-content: start;
	align-items: center;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: .02em;
	line-height: 24px;
}

.main__store .price .old {
	color: #8e8e8e;
	text-decoration: line-through;
	font-size: 12px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 20px;
}


/* Widgers */
.cat__title {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 30px;
	flex-wrap: wrap;
}

.cat__title h1 {
	font-size: 20px;
	line-height: 40px;
	font-weight: 600;
	color: var(--a-color-white);
}

.cat__title h1 span {
	color: #8e8e8e;
	margin-left: 8px;
}

.sort__toggle {
	font-size: 12px;
	line-height: 20px;
	padding: 6px 45px 6px 12px;
	background: #1e1e1e;
	border: 1px solid #2e2e2e;
	border-radius: 6px;
	color: #8e8e8e;
	position: relative;
	transition: all .2s ease 0s;
}

.sort__toggle span {
	position: absolute;
	top: 5px;
	right: 10px;
}

.sort {
	margin-bottom: 0;
	padding-left: 0;
	list-style: none;
}

.sort a {
	display: block;
	width: 100%;
	padding: 4px 10px;
	clear: both;
	font-size: 14px;
	font-weight: 400;
	text-align: inherit;
	text-decoration: none;
	white-space: nowrap;
	background-color: transparent;
	border: 0;
	border-radius: 6px;
	color: #fff;
	line-height: 24px;
	transition: var(--a-transition);
}

.sort a:hover {
	background-color: #2e2e2e;
}

.cat__tags {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.cat__tags a {
	font-size: 12px;
	font-weight: 400;
	line-height: 20px;
	color: var(--a-color-white);
	background: #2e2e2e;
	border: 1px solid #4e4e4e;
	border-radius: 4px;
	display: block;
	opacity: .5;
	padding: 6px 12px;
	transition: all .2s ease 0s;
}

.cat__tags a:hover {
	opacity: 1;
}


/* Engine */
.navigation {
	background: #262626;
	border: 1px solid #2e2e2e;
	border-radius: 6px;
	max-width: max-content;
	margin: 0 auto;
	display: flex;
	width: 100%;
}

.page_next span,
.page_next a,
.page_prev span,
.page_prev a,
.navigation .pages a,
.navigation .pages span {
	background: #262626;
	color: #fff;
	font-size: 12px;
	font-weight: 600;
	height: 32px;
	line-height: 20px;
	opacity: .5;
	text-decoration: none;
	-webkit-transition: all .2s ease 0s;
	-o-transition: all .2s ease 0s;
	transition: all .2s ease 0s;
	width: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.page_next a:hover,
.page_prev a:hover,
.navigation .pages a:hover,
.navigation .pages span {
	background: #2e2e2e;
	opacity: 1;
}

.navigation .pages {
	display: flex;
}


/* Gotop */
.gotop {
	bottom: 40px;
	display: block;
	position: fixed;
	right: 40px;
	opacity: 0;
	/* also add a translate effect */
	transform: translateY(100px);
	/* and a transition */
	transition: all 0.5s ease;
}

.help__btn {
	display: flex;
	justify-content: center;
	align-items: center;
	background: #4e4e4e;
	border-radius: 50%;
	margin-bottom: 16px;
	transition: all .2s ease 0s;
	width: 40px;
	height: 40px;
}

.help__btn:hover {
	background: #8e8e8e;
}

.scroll__btn {
	background: #0080ff;
	border-radius: 50%;
	color: #fff;
	display: flex;
	height: 40px;
	width: 40px;
	align-items: center;
	justify-content: center;
	transition: all .2s ease 0s;
}

.scroll__btn:hover {
	background: #409fff;
}

.scroll__btn svg {
	transform: rotate(180deg);
}

.showBtn {
	opacity: 1;
	transform: translateY(0);
}


/* Page */
.donate h6 {
	color: #8e8e8e;
	font-size: 13px;
	font-weight: 400;
	line-height: 16px;
	text-transform: uppercase;
	margin-bottom: 30px;
}

.donate p {
	color: var(--a-color-white);
	margin-bottom: 0;
}

.static .text {
	color: var(--a-color-white) !important;
	font-size: 16px;
	line-height: 24px;
}

.card .head {
	border-bottom: 1px solid #2e2e2e;
	padding: 25px 0px 20px;
}

.card .head h4 {
	font-size: 20px;
	letter-spacing: .02em;
	line-height: 32px;
	font-weight: 600;
	color: var(--a-color-white);
}

.helper .social {
	max-width: 70%;
	margin-top: 30px;
	padding-left: 5%;
}

.helper .social img {
	width: 100%;
	height: auto;
}


/* Fullstory */
.fullstory h1 {
	font-weight: 600;
	font-size: 32px;
	line-height: 40px;
	color: var(--a-color-white);
	margin-bottom: 30px;
}

/* fullstory article */

.full_article {
	max-width: 740px;
	width: 100%;
}

.full_article .short,
.full_article .text {
	color: var(--a-color-white);
	font-size: 16px;
	line-height: 24px;
	font-weight: 400;
}

.full_article .text a:hover {
	text-decoration: underline;
}

.full_article .cover {
	width: 100%;
	display: block;
	margin-top: 30px;
	margin-bottom: 30px;
}

.full_article .cover img {
	width: 100%;
	height: auto;
	object-fit: cover;
	border-radius: 15px;
}

.full_article .save h6 {
	color: var(--a-color-white);
	font-size: 16px;
	line-height: 24px;
	margin-bottom: 0;
}

.full_article .save p {
	color: #777777;
	font-size: 16px;
	line-height: 24px;
}

.full_article .save a {
	display: block;
	margin-bottom: 3px;
	max-width: max-content;
}

.full_article .save a:hover {
	text-decoration: underline;
}

.views p {
	color: #8e8e8e;
	font-size: 12px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 20px;
	margin-bottom: 0;
}

.full_article .favorites a {
	height: 78px;
	display: flex;
	align-items: center;
	width: 100%;
	justify-content: start;
	padding: 0 25px;
	color: var(--a-color-white);

}

.full_article .favorites svg {
	margin-right: 10px;
}

.full_article .favorites a div {
	display: flex;
	align-items: center;
}

.full_article .favorites .add {
	opacity: .5;
	transition: var(--a-transition);
}

.full_article .favorites a:hover .add {
	opacity: 1;
}

.full_article .favorites .del {
	color: #ff6464 !important;
	transition: var(--a-transition);
}

.full_article .favorites a:hover .del {
	opacity: .8;
}

.label__title {
	color: #8e8e8e;
	display: block;
	margin-bottom: 16px;
	text-transform: uppercase;
	font-size: 12px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 20px;
}

.related__news {
	display: flex;
	flex-direction: column;
}

.related__news .item {
	display: flex;

	padding: 12px 16px;
	transition: all .2s ease 0s;
}

.related__news .item:hover {
	background: #2e2e2e;
}

.related__news .item:not(:first-child) {
	border-top: 1px solid #2e2e2e;
}

.related__news .item img {
	height: 32px;
	margin-right: 12px;
	position: relative;
	width: 32px;
}

.related__news .item h2 {
	-webkit-line-clamp: 1;
	line-clamp: 1;
	word-wrap: break-word;
	-webkit-box-orient: vertical;
	box-orient: vertical;
	display: -webkit-box;
	display: box;
	max-width: 300px;
	overflow: hidden;
	-o-text-overflow: ellipsis;
	text-overflow: ellipsis;
	color: var(--a-color-white);
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 30px;
	margin-bottom: 0;
}

.help {
	display: flex;
	flex-wrap: wrap;
	gap: 15px;
	column-gap: 50px !important;
	align-items: center;
}

.help h6 {
	color: var(--a-color-white);
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 24px;
	margin-bottom: 0;
}

/* Fullstory store */
.f-carousel__slide {
	max-height: 460px;
	width: 100%;
	border-radius: 15px;
	overflow: hidden;
}

.f-carousel img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.full__store .text {
	font-size: 16px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 24px;
	color: var(--a-color-white);
}

.full__store .bottom {
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 24px;
}

.card_blur {
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-moz-box-orient: vertical;
	-moz-box-direction: normal;
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
	background: -o-linear-gradient(292.13deg, hsla(0, 0%, 100%, .06) 0, hsla(0, 0%, 100%, .024) 100%);
	background: linear-gradient(157.87deg, hsla(0, 0%, 100%, .06), hsla(0, 0%, 100%, .024));
	border-radius: 8px;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-direction: column;
	flex-direction: column;
	height: -webkit-fit-content;
	height: -moz-fit-content;
	height: fit-content;
	margin-bottom: 24px;
	overflow: hidden;
	padding: 0;
	position: relative;
}

.card_blur::before {
	background: linear-gradient(157.87deg, hsla(0, 0%, 100%, .2), hsla(0, 0%, 100%, .02));
	border-radius: 8px;
	content: "";
	inset: 0;
	-webkit-mask: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff)) content-box, -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff));
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
	padding: 1px;
	position: absolute;
	width: calc(100% - 2px);
	z-index: -1;
}

.store_card span {
	color: #00ab00;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 24px;
}

.store_card h3 {
	font-weight: 600;
	font-size: 32px;
	line-height: 40px;
	text-align: left;
	color: var(--a-color-white);
}

.store_card ul {
	font-size: 15px;
	line-height: 24px;
	color: var(--a-color-white);
	padding-left: 20px;
}

.store_card ul li {
	margin-bottom: 8px;
	padding-left: 5px;
}

.store_card .info {
	color: #8e8e8e;
	font-size: 12px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 20px;
}

.store_card .info a:hover {
	text-decoration: underline;
}

.infobox {
	color: #8e8e8e;
	font-size: 12px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 20px;
}

.is-horizontal .f-carousel__nav .f-button.is-next,
.is-horizontal .f-carousel__nav .f-button.is-prev {
	transition: .2s;
}

.is-horizontal .f-carousel__nav .f-button.is-next:hover,
.is-horizontal .f-carousel__nav .f-button.is-prev:hover {
	background: rgba(46, 46, 46, .5);
}


/* Fullstory game */
.full__game .title {
	display: flex;
	column-gap: 16px;
}

.full__game .title img {
	width: 64px;
	height: 64px;
	object-fit: cover;
	border-radius: 15px;
}

.full__game .title h1 {
	color: var(--a-color-white);
	font-size: 32px;
	line-height: 40px;
	font-weight: 600;
	margin-bottom: 0;
}

.full__game .title .category a {
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 24px;
	color: #409fff;
}

.full__game .title .category a:hover {
	text-decoration: underline;
}

.comm__title2 h3 {
	font-size: 20px;
	letter-spacing: .02em;
	line-height: 32px;
	font-weight: 600;
	color: var(--a-color-white);
}

.comm__title2 span {
	color: #8e8e8e;
}

.card_blur .info__box h6,
.info__box_full h6 {
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 24px;
	color: #8e8e8e;
	margin-bottom: 0;
}

.card_blur .info__box p,
.card_blur .info__box a,
.info__box_full a {
	margin-bottom: 0;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 24px;
	color: var(--a-color-white);
}

.card_blur .info__box a:hover,
.info__box_full a:hover {
	text-decoration: underline;
}

.card_blur .bottom,
.card_blur2 .bottom {
	display: flex;
	align-items: center;
	gap: 5px;
	color: #8e8e8e;
	font-size: 12px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 20px;
}

.card_blur .bottom a:hover,
.card_blur2 .bottom a:hover {
	text-decoration: underline;
}

.info__box_full {
	display: flex;
}

.arrow__down__btn {
	opacity: .5;
	transition: var(--a-transition);
}

.arrow__down__btn:hover {
	opacity: 1;
}

.link__set {
	height: 48px;
	overflow: hidden;
	transition: var(--a-transition);
}

.link__set_full {
	height: auto;
	transition: var(--a-transition);
}

.arrow__down__btn__a {
	transition: var(--a-transition);
}

.arrow__down__btn__a svg {
	transform: rotate(180deg);
}

.full__options {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	flex-wrap: nowrap;
	flex-direction: row;
}

.full__options .site {
	opacity: .5;
	transition: var(--a-transition);
	color: var(--a-color-white);
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 24px;
}

.full__options .site:hover {
	opacity: 1;
}

.full__favorites a {
	font-size: 14px;
	font-weight: 400;
	line-height: 24px;
	display: flex;
	align-items: center;

	width: 100%;
	justify-content: start;

	color: var(--a-color-white);

}

.full__favorites svg {
	margin-right: 10px;
}

.full__favorites a div {
	display: flex;
	align-items: center;
}

.full__favorites .add {
	opacity: .5;
	transition: var(--a-transition);
}

.full__favorites a:hover .add {
	opacity: 1;
}

.full__favorites .del {
	color: #ff6464 !important;
	transition: var(--a-transition);
}

.full__favorites a:hover .del {
	opacity: .8;
}

.card__share {
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-moz-box-orient: vertical;
	-moz-box-direction: normal;
	background: url(../images/pirat.png) no-repeat scroll 50% 50% #262626;
	background-position: 100%;
	background-size: contain;
	border: 1px solid #2e2e2e;
	border-radius: 8px;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-direction: column;
	flex-direction: column;
	padding: 24px;
	min-height: 165px;
}

.card__share p {
	max-width: 135px;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 24px;
	color: var(--a-color-white);
}

.card__share .social {
	display: flex;
	gap: 15px;

}

.card__share .social a {
	transition: var(--a-transition);
}

.card__share .social a:hover {
	opacity: .9;
}

.fulltext__btn_box {
	position: absolute;
	bottom: 0;
	left: -0px;
	width: 100%;
}

.fulltext__btn {
	background: #2a2a2a;
	border-radius: 0 0 8px 8px;
	border: none;
	border-top: 1px solid #4e4e4e;
	color: rgba(255, 255, 255, .5);
	font-size: 14px;
	font-weight: 600;
	line-height: 24px;
	outline: none !important;
	padding: 12px;
	text-align: center;
	text-decoration: none;
	width: 100%;
	display: block;
	position: relative;
	transition: .2s;
}

.fulltext__btn:hover {
	color: #fff;
	background: #2e2e2e;
}

.fulltext__btn_box::before {
	background: linear-gradient(180deg, rgba(38, 38, 38, 0), #262626);
	bottom: 49px;
	content: "";
	height: 80px;
	left: 0;
	position: absolute;
	right: 0;
	opacity: 1 !important;
}

.tab-limit {
	height: 250px;
	overflow: hidden;
	padding-bottom: 66px;
}

.tab-limit-none {
	height: auto !important;
	overflow: visible;
}

.tab-content:focus-visible {
	border: none;
	outline: none !important;
}


/* Fullstory game */

.full__os .title {
	display: flex;
	column-gap: 16px;
}

.full__os .title img {
	width: 64px;
	height: 64px;
	object-fit: cover;
	border-radius: 50%;
}

.full__os .title h1 {
	color: var(--a-color-white);
	font-size: 32px;
	line-height: 40px;
	font-weight: 600;
	margin-bottom: 0;
}

.full__os .title .category a {
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 24px;
	color: #409fff;
}

.full__os .title .category a:hover {
	text-decoration: underline;
}


.info__box_full2 {
	display: flex;
}

.card_blur .info__box h6,
.info__box_full2 h6 {
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 24px;
	color: #8e8e8e;
	margin-bottom: 0;
}

.card_blur .info__box2 p,
.card_blur .info__box2 a,
.info__box_full2 a {
	margin-bottom: 0;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 24px;
	color: var(--a-color-white);
}

.card_blur .info__box2 a:hover,
.info__box_full2 a:hover {
	text-decoration: underline;
}


.link__set2 {
	height: 48px;
	overflow: hidden;
	transition: var(--a-transition);
}

.link__set_full2 {
	height: auto;
	transition: var(--a-transition);
}

.arrow__down__btn__a2 svg {
	transform: rotate(180deg);
}

.arrow__down__btn2 {
	opacity: .5;
	transition: var(--a-transition);
}

.arrow__down__btn2:hover {
	opacity: 1;
}

.link_side h6 {
	color: #8e8e8e;
	display: block;
	margin-bottom: 8px;
	text-transform: uppercase;
	font-size: 12px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 20px;
}

.link_side nav {
	display: flex;
	flex-direction: column;
}

.link_side nav a {
	max-width: max-content;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 24px;
}

.link_side nav a:hover {
	text-decoration: underline;
}


/* full__extensions */
.full__extensions .title h1 {
	font-size: 32px;
	line-height: 40px;
	font-weight: 600;
	color: var(--a-color-white);
}

.card_blur2 {
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-moz-box-orient: vertical;
	-moz-box-direction: normal;
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
	background: -o-linear-gradient(292.13deg, hsla(0, 0%, 100%, .06) 0, hsla(0, 0%, 100%, .024) 100%);
	background: linear-gradient(157.87deg, hsla(0, 0%, 100%, .06), hsla(0, 0%, 100%, .024));
	border-radius: 8px;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-direction: column;
	flex-direction: column;
	height: -webkit-fit-content;
	height: -moz-fit-content;
	height: fit-content;
	margin-bottom: 24px;
	overflow: hidden;
	padding: 0;
	position: relative;
}


.card_blur2::before {
	background: linear-gradient(157.87deg, hsla(0, 0%, 100%, .2), hsla(0, 0%, 100%, .02));
	border-radius: 8px;
	content: "";
	inset: 0;
	-webkit-mask: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff)) content-box, -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff));
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
	padding: 1px;
	position: absolute;
	width: calc(100% - 2px);
	z-index: -1;
}

.card_blur2 .cover-mini {
	border-radius: 0;
	height: 150px;
	overflow: hidden;
	width: 100%;
	z-index: -2;
}

.card_blur2 .cover-mini img {
	height: 100%;
	-o-object-fit: cover;
	object-fit: cover;
	width: 100%;
}

.card_blur2 h6 {
	color: #8e8e8e;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 24px;
	margin-bottom: 0;
}

.card_blur2 a,
.card_blur2 p {
	color: var(--a-color-white);
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 24px;
}

.card_blur2 .bottom a {
	color: #409fff;
	;
	font-size: 12px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 20px;
}

.tag__side {
	display: flex;
	gap: 5px;
}

.tag__side a {
	background: #2e2e2e;
	border: 1px solid #4e4e4e;
	border-radius: 4px;
	color: #fff;
	display: inherit;
	font-size: 12px;
	font-weight: 400;
	line-height: 20px;
	margin: 0 8px 8px 0;
	opacity: .5;
	padding: 6px 12px;
	position: relative;
	text-decoration: none;
	-webkit-transition: all .2s ease 0s;
	-o-transition: all .2s ease 0s;
	transition: all .2s ease 0s;
}

.tag__side a:hover {
	opacity: 1;
}

.full__app .title {
	display: flex;
	column-gap: 16px;
}

.full__app .title img {
	width: 64px;
	height: 64px;
	object-fit: cover;
	border-radius: 15px;
}

.full__app .title h1 {
	color: var(--a-color-white);
	font-size: 32px;
	line-height: 40px;
	font-weight: 600;
	margin-bottom: 0;
}

.full__app .title .category a {
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 24px;
	color: #409fff;
}

.full__app .title .category a:hover {
	text-decoration: underline;
}


/* Addcomments */
.comm__title {
	font-size: 20px;
	letter-spacing: .02em;
	line-height: 32px;
	font-weight: 600;
	color: var(--a-color-white);
}

.addcomment__bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 15px;
}

.addcomm__btn {
	display: flex;
	opacity: .5;
	color: var(--a-color-white) !important;
	gap: 8px;
	font-size: 14px;
	font-weight: 400;
	line-height: 24px;
	transition: var(--a-transition);
	background-color: transparent;
	border: none;
	outline: none;
}

.addcomm__btn:hover {
	opacity: 1;
}

.comm__imgupload {
	opacity: .5;
	transition: var(--a-transition);
}

.comm__imgupload:hover {
	opacity: 1;
}

#comments {
	background: transparent;

	border: none;
	border-bottom: 1px solid #4e4e4e;
	opacity: .8;
	transition: var(--a-transition);
	color: var(--a-color-white);
	padding-bottom: 20px !important;
	width: 100%;
	font-size: 14px;
	letter-spacing: .04em;
	line-height: 24px;
	max-width: 100%;
	outline: none;
}

#comments:hover {
	opacity: 1;
}

#comments:focus {
	border-bottom: 1px solid #409fff;
	opacity: 1;
	outline: none;
}


/* Coments */
.comment {
	border-bottom: 1px solid #4e4e4e;
	padding-bottom: 30px;
}

.comment {
	margin-bottom: 20px;
}

.comment .head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	color: var(--a-color-white);
}

.comment .head .info {
	display: flex;
	column-gap: 15px;
}

.comment .head img {
	width: 48px;
	height: 48px;
	border-radius: 50%;
	object-fit: cover;
}

.comment .head .info a {
	color: var(--a-color-white);
	display: block;
	max-width: max-content;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: .02em;
	line-height: 24px;
}

.comment .head .info a:hover {
	text-decoration: underline;
}

.comment .head .info p {
	margin-bottom: 0;
	color: #8e8e8e;
	font-size: 12px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 20px;
}

.mass_comments_action {
	display: none;
}

.comment .text {
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 24px;
	color: var(--a-color-white);
}

.comment .options {
	display: flex;
	column-gap: 20px;
	align-items: center;
}

.comment .reply a,
.comment .like a {
	display: flex;
	align-items: center;
	gap: 10px;
	color: var(--a-color-white);
	opacity: .5;
	transition: var(--a-transition);
	font-size: 14px;
	font-weight: 400;
	line-height: 24px;
}

.comment .reply a:hover,
.comment .like a:hover {
	opacity: 1;
}

.comm__drop__btn {
	background-color: transparent;
	outline: none;
	border: none;
	transition: var(--a-transition);
	opacity: .5;
}

.comm__drop__btn:hover {
	opacity: 1;
}

.comm__drop a {
	display: block;
	width: 100%;
	padding: 4px 10px;
	clear: both;
	font-size: 14px;
	font-weight: 400;
	color: var(--bs-dropdown-link-color);
	text-align: inherit;
	text-decoration: none;
	white-space: nowrap;
	background-color: transparent;
	border: 0;
	border-radius: 6px;
	color: #fff;
	line-height: 24px;
}

.comm__drop a:hover {
	background-color: #2e2e2e;
}


.bb-editor textarea {
	background: transparent;

	border: none;
	border-bottom: 1px solid #4e4e4e;
	opacity: .8;
	transition: var(--a-transition);
	color: var(--a-color-white);
	padding-bottom: 20px !important;
	width: 100%;
	font-size: 14px;
	letter-spacing: .04em;
	line-height: 24px;
	max-width: 100%;
	outline: none;
	height: 100px !important;
}

.bb-editor textarea:hover {
	opacity: 1;
}

.comment .bbcodes {

	opacity: .5;
	color: var(--a-color-white) !important;

	font-size: 14px;
	font-weight: 400;
	line-height: 24px;
	transition: var(--a-transition);
	background-color: transparent;
	border: none;
	outline: none;
}

.comment .bbcodes:hover {
	opacity: 1;
}


/* Engine */
#searchsuggestions {
	z-index: 2200;
	background: #262626;
	border: 1px solid #2e2e2e;
	border-radius: 8px;
	color: #757575;
	width: 40%;
	background-clip: padding-box;
	font-size: .9em;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	margin-top: 15px !important;
	padding: 6px;
	top: 78px !important;
}

#searchsuggestions a,
#searchsuggestions span.notfound {
	padding: 15px 25px;
	display: block;
	text-decoration: none;
}

#searchsuggestions a {
	color: inherit;
	border-radius: 8px;
}

#searchsuggestions a:hover {
	background-color: #2E2E2E;
}

#searchsuggestions a span {
	display: block;
	cursor: pointer;
}

#searchsuggestions span.searchheading {
	display: block;
	font-weight: bold;
	margin-bottom: .2em;
}

#searchsuggestions span.seperator {
	display: block;
}

#searchsuggestions span.seperator a {
	padding: 10px 0;
	text-align: center;
	border: 0 none;
	background-color: transparent;
	color: #919191;
}

#searchsuggestions span.notfound {
	padding: 15px 25px;
	display: block;
}

#searchsuggestions .break {
	display: none;
}


/*---Диалоговые и всплывающие окна jQuery UI---*/
.ui-front {
	z-index: 1000;
}

.ui-widget-overlay {
	background: #000;
	opacity: 0.5;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	position: fixed;
}

.ui-helper-clearfix:after {
	clear: both;
	content: ".";
	display: block;
	height: 0;
	visibility: hidden
}

.ui-helper-clearfix {
	display: inline-block
}

* html .ui-helper-clearfix {
	height: 1%
}

.ui-helper-clearfix {
	display: block
}

.ui-dialog {
	text-align: left;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 370px;
	border-radius: 8px;
	box-shadow: 0 8px 40px -10px rgba(0, 0, 0, 0.3);
	background-color: #323232;
	background-clip: padding-box;
	outline: none;
	z-index: 9999;
}

.ui-dialog-titlebar {
	padding: 20px 20px 5px;
	position: relative;
	color: var(--a-color-white);
}

.ui-dialog-title {
	float: left;
	font-weight: bold;
	font-size: 1.25em;
}

.ui-dialog-titlebar-close {
	position: absolute;
	right: 10px;
	top: 50%;
	margin-top: -16px !important;
	height: 23px !important;
	width: 32px;
	border: 0 none !important;
	background-color: inherit !important;
	box-shadow: none !important;
	padding: 0px !important;
}

.ui-dialog-titlebar-close .ui-icon {
	display: block;
	margin: 10px auto 0 auto;
	width: 12px;
	height: 12px;
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYBAMAAAASWSDLAAAAG1BMVEUAAAA1NTU1NTU1NTU1NTU1NTU1NTU1NTU1NTW7eCkWAAAACHRSTlMA8DiyCsELwNb3saQAAABlSURBVBjTY2AxYoACZQcG10YFCJtJooTBokMIwlHsaAZioBRYAigKJoAAJAghoRIQCiYEoSEiUCmIBFQKLAGTAkvApCASCA6GMoQBGEYjLEV1DopDUbyA4jlUb6ciAiSMgQ0pqAB4linXHtbaoQAAAABJRU5ErkJggg==);
	-webkit-background-size: 12px auto;
	background-size: 12px auto;
	opacity: .5;
}

.ui-dialog-titlebar-close:after {
	transform: rotate(-45deg);
}

.ui-dialog-titlebar-close:before {
	transform: rotate(45deg);
}

.ui-dialog-titlebar-close:before,
.ui-dialog-titlebar-close:after {
	position: absolute;
	left: 15px;
	content: ' ';
	height: 17px;
	width: 2px;
	background-color: #7c7c7c;
}

.ui-dialog-titlebar-close:before,
.ui-dialog-titlebar-close:after {
	position: absolute;
	left: 15px;
	content: ' ';
	height: 17px;
	width: 2px;
	background-color: #7c7c7c;
}

.ui-dialog-titlebar-close:hover {
	background-color: red;
	transition: all ease .1s;
}

.ui-button {
	float: right;
	border: 0 none;
	vertical-align: middle;
	cursor: pointer;
	height: 36px;
	border-radius: 18px;
	line-height: 22px;
	outline: none;
	background-color: #3394e6;
	color: #fff;
	border: 0 none;
	padding: 7px 22px;
	text-decoration: none !important;
	box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
	-webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all ease .1s;
	transition: all ease .1s;
}

.ui-dialog-titlebar-close:hover .ui-icon {
	opacity: 1;
}

.ui-icon,
.ui-button-icon-only {
	overflow: hidden;
	text-indent: -9999px;
}

.ui-dialog label {
	color: #575757;
}

.ui-dialog-content {
	padding: 20px;
	height: auto;
	position: relative;
	zoom: 1;
}

.loginbox.ui-dialog,
.loginbox .ui-dialog-content {
	overflow: visible !important;
}

.ui-dialog-content h2 {
	display: inline;
	font-size: 1em;
	font-weight: bold
}

.ui-dialog .ui-dialog-buttonpane {
	padding: 20px;
}

.ui-dialog .ui-resizable-se {
	bottom: 3px;
	height: 14px;
	right: 3px;
	width: 14px;
}

.ui-draggable .ui-dialog-titlebar {
	cursor: move;
}

.ui-state-error {
	background: #fef1ec 50% 50% repeat-x !important;
	border: 1px solid #cd0a0a;
	color: #cd0a0a;
}

.ui-button {
	margin: 0 3px;
}

.ui-helper-hidden-accessible {
	display: none;
}

.ui-dialog-buttonset {
	display: flex;
	column-gap: 10px;
}

.ui-dialog-buttonset button {
	border: 1px solid #4e4e4e;
	color: #8e8e8e !important;
	background-color: transparent;
	padding: 8px 15px;
	border-radius: 8px;
	transition: var(--a-transition);
}

.ui-dialog-buttonset button:hover {
	background-color: #2e2e2e;
	border-color: #4e4e4e;
}

/* Mobile menu */
.aside_mobile_footer {
	position: absolute;
	bottom:0;
	width: 100%;
	padding: 16px 20px;
	background-color: #2c2c2c;
	color:#fff;
	display: flex;
	align-items:center;
	justify-content: space-between;
}
.btn-close-aside {
background: linear-gradient(157.87deg,hsla(0,0%,100%,.06),hsla(0,0%,100%,.024));
border-radius: 16px;
padding: 21px;
border:none;
outline: none;
width: 56px;
height: 56px;
display: flex;
align-items:center;
justify-content: center;
}



/* Контейнер поисковой формы в сайдбаре */
.aside__search {
	position: relative;
	width: 100%;
	padding: 16px 20px !important; /* Выровняли боковые отступы в тон меню */
}

/* Иконка лупы внутри поиска */
.aside__search svg {
	position: absolute;
	right: 36px;
	top: 30px;
	color: #666666 !important; /* Приглушенный серый цвет для иконки */
	transition: color 0.2s ease !important;
	pointer-events: none; /* Чтобы клик проходил сквозь иконку в само поле */
}

/* Поле ввода (инпут) */
.aside__form {
	background: rgba(255, 255, 255, 0.03) !important; /* Полупрозрачный темный фон */
	border: 1px solid rgba(255, 255, 255, 0.05) !important; /* Тонкая грань */
	border-radius: 8px;
	color: #ffffff !important; /* Цвет вводимого текста теперь белый и читаемый */
	margin-top: 0;
	padding: 12px 50px 12px 16px !important; /* Оптимизировали внутренние отступы */
	width: 100%;
	height: 44px !important; /* Сделали инпут чуть аккуратнее по высоте */
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .04em;
	line-height: 24px;
	transition: all 0.2s ease-in-out !important;
}

/* Изменяем цвет подсказки (placeholder) "Поиск по сайту..." */
.aside__form::placeholder {
	color: rgba(255, 255, 255, 0.4) !important;
}

/* Эффект при клике на поле поиска (активное состояние) */
.aside__form:focus {
	outline: none;
	background: rgba(0, 123, 255, 0.05) !important; /* Легкий синий оттенок внутри */
	border-color: rgba(0, 123, 255, 0.4) !important; /* Синее свечение рамки */
	box-shadow: 0 0 10px rgba(0, 123, 255, 0.15) !important;
}

/* Подсветка иконки лупы при фокусе на поиске */
.aside__search:focus-within svg {
	color: #007bff !important; /* Лупа загорается синим, когда пользователь пишет */
}


/* Кнопка открытия меню на мобильных */
.mobile__aside__btn {
	position: fixed;
	z-index: 999;
	bottom: 20px;
	left: 20px;
	height: 56px;
	width: 56px;
	border-radius: 16px;
	overflow: hidden;
	background-color: #007bff; /* Наш фирменный синий цвет */
	box-shadow: 0 4px 15px rgba(0, 123, 255, 0.4); /* Мягкое неоновое свечение */
	display: flex;
	align-items: center;
	justify-content: center;
	border: none;
}
.mobile__aside__btn svg {
	margin: 0 !important; /* Центрируем иконку внутри кнопки */
	width: 24px;
	height: 24px;
}

/* Сам контейнер выплывающего мобильного меню */
.offcanvas-aside {
	background-color: rgba(24, 24, 28, 0.95) !important; /* Глубокий темный фон в тон сайта */
	backdrop-filter: blur(15px) !important; /* Эффект матового стекла */
	-webkit-backdrop-filter: blur(15px) !important;
	border-right: 1px solid rgba(255, 255, 255, 0.05) !important; /* Тонкая светящаяся грань */
	box-shadow: 8px 0 32px rgba(0, 0, 0, 0.5) !important;
}

/* Шапка мобильного меню */
.offcanvas-aside .offcanvas-header {
	display: flex;
	padding: 16px 24px;
	position: relative;
	width: 100%;
	background: linear-gradient(157.87deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.01)) !important;
	height: 80px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
	align-items: center;
}

/* Ссылка закрытия или крестик в шапке (если есть) */
.offcanvas-aside .btn-close {
	filter: invert(1) grayscale(1) brightness(2); /* Перекрашиваем крестик Bootstrap в белый цвет */
}

/* Навигация внутри меню */
.offcanvas-aside nav {
	display: flex;
	flex-direction: column;
	padding: 10px 0;
}

/* Пункты меню на мобильном */
.offcanvas-aside nav a {
	border-bottom: 1px solid rgba(255, 255, 255, 0.03) !important; /* Едва заметные тонкие разделители */
	color: rgba(255, 255, 255, 0.75) !important; /* Приглушенный белый для текста */
	display: flex !important;
	align-items: center !important;
	font-size: 15px !important;
	font-weight: 400;
	line-height: 24px;
	padding: 14px 24px !important; /* Чуть увеличили отступы для удобного тапа пальцем */
	transition: all .2s ease 0s;
	gap: 12px;
	text-decoration: none !important;
}

/* Поведение пунктов при нажатии / наведении */
.offcanvas-aside nav a:hover, 
.offcanvas-aside nav a:active {
	background: rgba(255, 255, 255, 0.03) !important;
	color: #ffffff !important; /* Текст загорается белым */
	text-decoration: none !important; /* Убрали некрасивое подчеркивание */
}

/* Мини-профиль пользователя в меню */
.login_mini_profile .info__user {
	display: flex;
	gap: 16px;
	align-items: center;
	color: #ffffff !important;
	padding: 16px 24px;
}
.login_mini_profile .info__user img {
	width: 44px;
	height: 44px;
	border-radius: 50%; /* Делаем аватарку круглой в современном стиле */
	border: 2px solid rgba(255, 255, 255, 0.1);
	object-fit: cover;
}

/* Base short */
.base__short a {
	display: grid;
	/* Сетка: увеличили 2-ю колонку со 100px до 200px для длинных кодеков, 
	   а 3-ю уменьшили с 220px до 120px — этого за глаза хватит для типов релизов */
	grid-template-columns: 1fr 200px 120px 120px;
	align-items: center;
	background: #262626;
	border: 1px solid #2e2e2e;
	width: 100%;
	padding: 12px 16px;
	transition: var(--a-transition);
	height: 56px;
	color: #8e8e8e;
	font-size: 13px;
	font-weight: 400;
	line-height: 16px;
	text-transform: uppercase;
}

.base__short a:hover {
	background: #2e2e2e;
}
.base__short a img {
	width: 32px;
	height: 32px;
	object-fit: cover;
	border-radius:10px;
}
.base__short .title {
	color:var(--a-color-white);
}
/* Исправление вертикального стека */
.base__short .d-flex.flex-column {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: flex-start !important; /* Выравнивание по левому краю */
    overflow: hidden;
    width: 100%;
}

/* Стили для жанров */
.base__short .genres-list {
    display: block !important; /* Принудительный перенос на новую строку */
    font-size: 11px;
    line-height: 14px;
    color: #808080; /* Сделали чуть ярче, чтобы текст не пропадал на темном фоне */
    text-transform: none; /* Отключаем капс */
    margin-top: 2px; /* Легкий отступ от названия */
    width: 100%;
}


.card__main {
	overflow: hidden;
	border-radius:10px;
}
@media screen and (max-width:940px) {
	.link__mobile {
		display: none;
	}
	.base__short a {
		/* Перестраиваем сетку на 2 колонки для мобильных */
		grid-template-columns: 1fr 60px;
	}
}

/* Repositive */
@media screen and (max-width:1210px) {
	.sidebar .menu .item span, .sidebar .favourites, footer .menu, .sidebar__dropmenu__btn,
	.logo__desctop {
	   display: none !important;
	}
	.sidebar {
		border:none;
		margin: 0px 6% 0px;
	}
	.sidebar .menu .item {
		width: max-content;
	}
	footer {
		padding: 0px 6% 32px;
	}
	.menu__mobile {
		padding-left:6%;
	}
   }
   @media screen and (min-width:1210px) {
	.logo__mobile, footer .menu__mobile {
		display: none;
	}
   }

   @media screen and (max-width:768px) {
	header, .sidebar, aside, .userlogin__btn .avatar, .desk-none {
		display: none !important;
	}
	.login_mini_profile {
		display: flex;
		align-items:center;
		justify-content: space-between;
		width: 100%;
	}
	
	.col-10, .btn-group {
		width: 100% !important;
	}
   }
   @media screen and (min-width:768px) {
   .mobile__aside__btn, .userlogin_more, .login_mini_profile .info__user, .mob-none {
display: none;
   }
  
}

   .full__game::before { background: radial-gradient(50% 100% at 50% 0,rgba(30,30,30,.5) 0,#1e1e1e 100%));
   background-repeat: no-repeat;
   background-size: 64%;
   background-position: 70% 50%;
   content: "";
   display: block;
   height: 500px;
   position: absolute;
   right: 0;
   top: 0;
   width: 100%;
   z-index: -1;
   } 

/* 1. Обрезание длинного текста троеточием */
.base__short .truncate {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    max-width: 100%;
}

/* Ограничиваем флекс-контейнер названия, чтобы троеточие работало корректно */
.base__short .d-flex {
    min-width: 0; 
}

/* Базовый сброс для нового списка */
.acc-menu, .acc-submenu {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.acc-menu-li {
    position: relative !important;
    display: block !important;
    margin-bottom: 8px !important;
}

/* Обертка для ссылки и стрелочки */
.acc-item-wrapper {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    width: 100% !important;
}

/* Главные ссылки меню (Программы, Игры) */
.acc-main-link {
    display: block !important;
    padding: 10px 15px !important;
    color: #ffffff !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    flex-grow: 1 !important;
}

/* Одиночные ссылки без стрелочек */
.acc-main-link.single-link {
    padding: 10px 15px !important;
}

/* Кнопка-стрелочка справа */
.acc-toggle-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 40px !important;
    height: 40px !important;
    text-decoration: none !important;
    cursor: pointer !important;
}

/* Сама панель гармошки */
.acc-collapse-panel {
    position: static !important;
    display: none;
    width: 100% !important;
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
}
.acc-collapse-panel.show {
    display: block !important;
}

/* Контейнер выпадающего подменю */
.acc-submenu {
    padding-left: 25px !important; /* Сдвиг вправо под текст */
    margin-top: 4px !important;
    margin-bottom: 10px !important;
}

/* Ссылки внутри подменю (Безопасность, Гонки и т.д.) */
.acc-submenu-item {
    display: block !important;
    padding: 6px 12px !important;
    color: rgba(255, 255, 255, 0.6) !important;
    font-size: 14px !important;
    text-decoration: none !important;
    border-radius: 6px !important;
    transition: all 0.2s ease !important;
}

.acc-submenu-item:hover {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.05) !important;
}

/* Плавный разворот стрелочки */
.acc-arrow-icon {
    transition: transform 0.2s ease !important;
}

/* Поворачиваем стрелку вверх, когда панель открыта (у кнопки нет класса .collapsed) */
.acc-toggle-btn:not(.collapsed) .acc-arrow-icon {
    transform: rotate(180deg) !important;
}

/* Контейнер для плашек лейблов */
.developer-tag {
    display: flex !important;
    flex-wrap: wrap !important; /* Разрешаем красивый перенос, если лейблов много */
    gap: 6px !important;       /* Расстояние между кнопочками */
    align-items: center !important;
    color: transparent !important; /* Фишка: делаем стандартную запятую DLE невидимой */
    font-size: 0px !important;     /* Сжимаем шрифт запятой в ноль, чтобы не занимала место */
    background: none !important;   /* Убираем фон с общего контейнера, если он там был */
    border: none !important;       /* Убираем общую рамку */
    padding: 0 !important;         /* Сбрасываем общие отступы */
}

/* Настраиваем стиль для каждой отдельной ссылки-лейбла внутри контейнера */
.developer-tag a {
    display: inline-block !important;
    font-size: 13px !important;    /* Возвращаем нормальный читаемый размер шрифта тексту */
    background: rgba(0, 119, 204, 0.15) !important; /* Красивый синий полупрозрачный фон */
    border: 1px solid rgba(0, 119, 204, 0.3) !important; /* Аккуратная синяя рамка */
    color: #38a1f3 !important;     /* Светло-синий цвет текста */
    padding: 4px 10px !important;  /* Внутренние отступы каждой плашки */
    border-radius: 4px !important; /* Скругление углов */
    text-decoration: none !important;
    transition: var(--a-transition) !important;
}

/* Эффект при наведении курсора на конкретный лейбл */
.developer-tag a:hover {
    background: rgba(0, 119, 204, 0.3) !important;
    color: var(--a-color-white) !important;
}


/* Контейнер для плашек групп / исполнителей */
.series-tag {
    display: flex !important;
    flex-wrap: wrap !important; /* Перенос на новую строку, если имен несколько */
    gap: 6px !important;       /* Отступ между плашками артистов */
    align-items: center !important;
    color: transparent !important; /* Прячем текстовую запятую DLE */
    font-size: 0px !important;     /* Сжимаем разделитель в ноль */
    background: none !important;   /* Сбрасываем фон общего блока */
    border: none !important;
    padding: 0 !important;
}

/* Стили для каждой отдельной плашки артиста */
.series-tag a {
    display: inline-block !important;
    font-size: 13px !important;    /* Возвращаем размер шрифта для текста */
    background: rgba(40, 167, 69, 0.15) !important; /* Полупрозрачный зеленый фон (под стиль вашего сайта) */
    border: 1px solid rgba(40, 167, 69, 0.3) !important; /* Зеленая аккуратная рамка */
    color: #28a745 !important;     /* Яркий зеленый цвет текста */
    padding: 4px 10px !important;  /* Внутренние отступы */
    border-radius: 4px !important; /* Скругление */
    text-decoration: none !important;
    transition: var(--a-transition) !important;
}

/* Эффект при наведении на артиста */
.series-tag a:hover {
    background: rgba(40, 167, 69, 0.3) !important;
    color: var(--a-color-white) !important;
}

/* Контейнер для плашек версий / переизданий */
.version-tag {
    display: flex !important;
    flex-wrap: wrap !important; /* Перенос на новую строку, если версий несколько */
    gap: 6px !important;       /* Отступ между кнопками */
    align-items: center !important;
    color: transparent !important; /* Глушим уродливую запятую DLE */
    font-size: 0px !important;     /* Сжимаем её размер в ноль */
    background: none !important;
    border: none !important;
    padding: 0 !important;
}

/* Благородные золотисто-оранжевые плашки для спецификаций релиза */
.version-tag a {
    display: inline-block !important;
    font-size: 13px !important;
    background: rgba(230, 126, 34, 0.12) !important; /* Полупрозрачный теплый оранжевый */
    border: 1px solid rgba(230, 126, 34, 0.3) !important; /* Янтарная рамка */
    color: #f39c12 !important;     /* Красивый золотистый цвет текста */
    padding: 4px 10px !important;
    border-radius: 4px !important;
    text-decoration: none !important;
    transition: var(--a-transition) !important;
}

/* Наведение на версию */
.version-tag a:hover {
    background: rgba(230, 126, 34, 0.25) !important;
    color: var(--a-color-white) !important;
    border-color: #f39c12 !important;
}

/* Контейнер для верхних категорий */
.top-categories-box {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin-top: 12px !important;
    font-size: 0 !important; /* Прячем стандартные текстовые запятые DLE */
}

/* Превращаем каждую ссылку категории в тег */
.top-categories-box a {
    display: inline-block !important;
    background: rgba(139, 92, 246, 0.15) !important; /* Полупрозрачный фиолетовый фон */
    color: #a78bfa !important; /* Светло-фиолетовый текст */
    padding: 4px 12px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    border-radius: 6px !important;
    border: 1px solid rgba(139, 92, 246, 0.3) !important;
    text-decoration: none !important;
    transition: all 0.2s ease-in-out !important;
}

/* Эффект при наведении на категорию */
.top-categories-box a:hover {
    background: #8b5cf6 !important; /* Насыщенный фиолетовый */
    color: #ffffff !important;
    box-shadow: 0 0 12px rgba(139, 92, 246, 0.4) !important;
    transform: translateY(-1px) !important;
}

/* Превращаем ссылку года выпуска в красивый зеленый тег */
.top-year-tag a {
    display: inline-block !important;
    background: rgba(16, 185, 129, 0.15) !important; /* Полупрозрачный мятно-зеленый фон */
    color: #34d399 !important; /* Яркий мятный цвет текста */
    padding: 4px 12px !important;
    font-size: 13px !important;
    font-weight: 700 !important; /* Сделаем цифры года чуть жирнее */
    border-radius: 6px !important;
    border: 1px solid rgba(16, 185, 129, 0.3) !important;
    text-decoration: none !important;
    transition: all 0.2s ease-in-out !important;
}

/* Эффект при наведении на год */
.top-year-tag a:hover {
    background: #10b981 !important; /* Насыщенный изумрудный цвет */
    color: #ffffff !important;
    box-shadow: 0 0 12px rgba(16, 185, 129, 0.4) !important; /* Зеленое свечение */
    transform: translateY(-1px) !important;
    text-decoration: none !important;
}

/* Оформление краткого SEO-описания сверху */
.seo-preview-text {
    background: rgba(255, 255, 255, 0.02) !important; /* Очень легкий полупрозрачный фон */
    border: 1px dashed rgba(255, 255, 255, 0.1) !important; /* Пунктирная рамка, чтобы отделить блок */
    font-size: 15px !important;
    line-height: 1.6 !important;
    color: rgba(255, 255, 255, 0.8) !important; /* Слегка приглушенный цвет текста */
}

.seo-preview-text strong {
    color: #ffffff !important;
}

/* Главные ссылки меню */
.acc-main-link {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important; /* Небольшой аккуратный отступ */
    padding: 8px 12px !important; /* Компактные отступы строк */
    color: rgba(255, 255, 255, 0.75) !important; /* Цвет текста как на скрине */
    font-size: 15px !important;
    font-weight: 400 !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

/* Исправленные иконки: мелкие, серые, с тонкими линиями */
.menu-icon {
    width: 16px !important;  /* Уменьшили до миниатюрного размера */
    height: 16px !important;
    flex-shrink: 0 !important;
    color: #888888 !important; /* Приглушенный серый цвет в тон темы */
    stroke-width: 1.5px !important; /* Делаем линии изящными и тонкими */
    transition: color 0.2s ease !important;
}

/* Тонкая стрелочка шеврона справа */
.acc-toggle-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 32px !important;
    height: 32px !important;
    color: #666666 !important;
    text-decoration: none !important;
}

.acc-arrow-icon {
    width: 12px !important; /* Очень маленькая аккуратная стрелочка */
    height: 12px !important;
    stroke-width: 1.5px !important;
}

/* Эффекты при наведении */
.acc-main-link:hover {
    color: #ffffff !important; /* Текст становится белым */
}
.acc-main-link:hover .menu-icon {
    color: #bbbbbb !important; /* Иконка лишь слегка светлеет, не выбиваясь из диза */
}
.acc-toggle-btn:hover {
    color: #ffffff !important;
}

/* Сдвиг подменю строго под текст, учитывая новые размеры */
.acc-submenu {
    padding-left: 38px !important; 
    list-style: none !important;
    margin: 0 !important;
}

/* Базовые стили для текстового логотипа */
.logo__text {
    display: inline-block !important;
    font-size: 30px !important; /* Крупный читаемый размер */
    font-weight: 800 !important; /* Максимально жирный игровой шрифт */
    color: #ffffff !important; /* Первая часть (app) будет белой */
    text-transform: lowercase !important; /* Все буквы маленькие, как в оригинале */
    text-decoration: none !important;
    letter-spacing: -0.5px !important; /* Плотное стильное межбуквенное расстояние */
    padding: 20px 24px !important; /* Отступы внутри сайдбара */
    transition: transform 0.2s ease, opacity 0.2s ease !important;
}

/* Вторая часть названия (torrent) */
.logo__text span {
    color: #007bff !important; /* Наш фирменный синий цвет */
    text-shadow: 0 0 12px rgba(0, 123, 255, 0.4) !important; /* Мягкое неоновое свечение */
}

/* Эффект при наведении курсора */
.logo__text:hover {
    transform: scale(1.02) !important; /* Легкое приятное увеличение */
    opacity: 0.9 !important;
    text-decoration: none !important;
}

/* Адаптивность для мобильной версии сайта */
@media (max-width: 991px) {
    .logo__text {
        font-size: 20px !important; /* Чуть уменьшаем размер на смартфонах */
        padding: 15px 16px !important;
    }
}

/* Контейнер для правильного размещения рейтинга в шапке */
.top-rating-container {
    display: block !important;
    width: 100% !important;
    margin-top: 14px !important;    /* Отступ сверху от фиолетовых тегов */
    margin-bottom: 5px !important;  /* Отступ снизу до текстового блока */
    padding-left: 4px !important;   /* Легкое смещение вправо для выравнивания */
}

/* Выравниваем звезды и текст в один ряд */
.top-rating-container .game-rating-box {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important; /* Отступ между звездами и текстом */
}

/* Стили для самого текстового счетчика */
.rating-text-counter {
    font-size: 13px !important;
    color: rgba(255, 255, 255, 0.4) !important; /* Приглушенный серый цвет в тон темы */
    font-weight: 500 !important;
    line-height: 23px !important; /* Высота в тон звезд */
}

/* Выделяем саму оценку (например, 4.5) белым цветом */
.rating-text-counter strong {
    color: #ffffff !important;
    font-weight: 700 !important;
}

.years-dropdown-wrapper {
    position: relative;
    display: inline-block;
}

.years-select {
    background: #262626;
    color: #8e8e8e;
    border: 1px solid #2e2e2e;
    border-radius: 4px;
    padding: 6px 32px 6px 12px;
    font-size: 13px;
    font-weight: 400;
    line-height: 16px;
    text-transform: uppercase;
    cursor: pointer;
    appearance: none; /* Убираем стандартную стрелку браузера */
    -webkit-appearance: none;
    transition: var(--a-transition);
}

.years-select:hover {
    background: #2e2e2e;
    color: var(--a-color-white);
}

/* Добавляем свою аккуратную стрелочку справа */
.years-dropdown-wrapper::after {
    content: "▼";
    font-size: 9px;
    color: #8e8e8e;
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
}

/* Стили для выпадающего списка опций (в современных браузерах) */
.years-select option {
    background: #262626;
    color: #8e8e8e;
    text-transform: uppercase;
}

.top-labels-block {
    margin-top: 20px;
    padding: 16px;
    background: #1f1f1f; /* Чуть темнее основного фона для выделения зоны */
    border-radius: 8px;
    border: 1px solid #2e2e2e;
}

.top-labels-block .labels-title {
    color: var(--a-color-white);
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.top-labels-block .labels-grid {
    display: flex;
    flex-wrap: wrap; /* Кнопки будут красиво переноситься на новую строку */
    gap: 8px;
}

.top-labels-block .label-btn {
    display: inline-block;
    background: #262626;
    border: 1px solid #2e2e2e;
    color: #8e8e8e;
    padding: 6px 14px;
    font-size: 12px;
    font-weight: 400;
    text-transform: uppercase;
    text-decoration: none;
    border-radius: 4px;
    transition: var(--a-transition);
}

.top-labels-block .label-btn:hover {
    background: #2e2e2e;
    color: var(--a-color-white);
    border-color: #404040;
}

/* Общие хелперы флекса, если их нет в теме */
.d-flex { display: flex !important; }
.ai-center { align-items: center !important; }
.jc-space-between { justify-content: space-between !important; }
.fd-column { flex-direction: column !important; }
.flex-1 { flex: 1 !important; }
.ta-center { text-align: center !important; }

/* Контейнер рейтинга */
.music__rating {
    background: #262626;
    border: 1px solid #2e2e2e;
    border-radius: 8px;
    padding: 16px;
    margin-bottom: 20px; /* Отступ от нижних характеристик */
    color: #8e8e8e;
    font-size: 13px;
}

.music__rating .sect__title {
    margin-bottom: 14px;
}

/* Крупная цифра оценки */
.music__revs-rcount {
    font-size: 42px;
    font-weight: 700;
    color: var(--a-color-white);
    line-height: 42px;
    margin-bottom: 8px;
}

.music__revs-left {
    width: 110px;
    padding-right: 16px;
    border-right: 1px solid #2e2e2e;
}

.music__revs-right {
    padding-left: 16px;
}

/* Полоски статистики */
.music__revs-bar {
    display: flex;
    align-items: center;
    gap: 8px;
}

.music__revs-bar-rate {
    width: 25px;
    font-size: 11px;
    color: #666;
    text-align: right;
}

.music__revs-bar-progress {
    flex: 1;
    background: #1f1f1f; /* Подложка полосы */
    height: 12px;
    border-radius: 3px;
    overflow: hidden;
    position: relative;
}

.music__revs-bar-fill {
    height: 100%;
    border-radius: 3px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: 6px;
    transition: width 0.5s ease;
}

.music__revs-bar-fill span {
    font-size: 9px;
    color: #fff;
    font-weight: bold;
    line-height: 12px;
}

/* Цвета полос (соответствуют скриншоту) */
.fill-5 { background: #28a745; } /* Зеленый */
.fill-4 { background: #a3d977; } /* Салатовый */
.fill-3 { background: #ffc107; } /* Желтый */
.fill-2 { background: #fd7e14; } /* Оранжевый */
.fill-1 { background: #dc3545; } /* Красный */

.tt-smaller {
    font-size: 11px;
    color: #666;
    margin-top: 4px;
}

/* Оформление текстового треклиста из полной новости */
.tracklist-text {
    white-space: pre-line !important; /* 🔥 Критически важно: заставляет браузер видеть каждый ваш Enter из админки */
    font-size: 14px !important;       /* Делаем шрифт чуть крупнее и заметнее */
    line-height: 32px !important;     /* Увеличиваем межстрочный интервал, чтобы треки не липли друг к другу */
    color: #b3b3b3 !important;        /* Приятный светло-серый цвет, как в Spotify */
    letter-spacing: 0.5px !important; /* Легкий отступ букв для читаемости */
    padding: 10px 5px !important;
}

/* На всякий случай разрешаем тегам <br> работать штатно */
.tracklist-text br {
    display: inline !important;
}

/* Общие стили шапки релиза */
.music-hero-header {
    background: rgba(38, 38, 38, 0.4); /* Легкая подложка под всю шапку */
    padding: 20px;
    border-radius: 12px;
    border: 1px solid #2e2e2e;
}

.hero-poster-img {
    width: 160px; /* Фиксированный базовый размер для ПК */
    height: 160px;
    object-fit: cover;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.5);
    transition: transform 0.3s ease;
}
.hero-poster-img:hover {
    transform: scale(1.03);
}

.hero-main-title {
    color: var(--a-color-white);
    font-size: 22px !important;
    font-weight: 700 !important;
    line-height: 30px !important;
    margin: 0;
}

/* 📱 СТИЛИ ДЛЯ МОБИЛЬНЫХ УСТРОЙСТВ (Экраны меньше 768px) */
@media (max-width: 767.98px) {
    .music-hero-header {
        padding: 12px;
        background: none; /* Убираем рамки на мобилке для экономии места */
        border: none;
    }
    
    /* Растягиваем постер во всю ширину экрана */
    .hero-poster-img {
        width: 100% !important;
        height: auto !important;
        aspect-ratio: 1 / 1; /* Жесткий сочный квадрат */
        max-width: 340px; /* Чтобы на планшетах постер не стал гигантским */
        margin: 0 auto;
    }
    
    .hero-main-title {
        font-size: 18px !important;
        line-height: 24px !important;
        text-align: center; /* Центрируем текст на мобилке */
        margin-top: 10px;
    }
    
    /* Превращаем кучу бейджей категорий в аккуратный горизонтальный свайп-слайдер */
    .mobile-scroll-tags {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        gap: 6px !important;
        padding-bottom: 8px !important;
        width: 100% !important;
        -webkit-overflow-scrolling: touch;
    }
    
    /* Скрываем уродливую полосу прокрутки скролла на мобильных */
    .mobile-scroll-tags::-webkit-scrollbar {
        display: none !important;
    }
    
    /* Выравниваем сами бейджи внутри скролла, чтобы они не ломались */
    .mobile-scroll-tags a, 
    .mobile-scroll-tags span {
        white-space: nowrap !important;
        display: inline-block !important;
        flex-shrink: 0 !important;
    }
    
    /* Скрываем старый тег <br> если он прилетит из DLE */
    .mobile-scroll-tags br {
        display: none !important;
    }
}

/* Оформление строки со статистикой */
.header-meta-actions {
    border-top: 1px solid rgba(255, 255, 255, 0.05); /* Легкая разделительная линия сверху */
    padding-top: 16px;
    width: 100%;
}

.header-stats-info {
    font-size: 13px;
    color: #8e8e8e;
    font-weight: 400;
}

.header-stats-info .stat-item {
    display: inline-block;
}

.header-stats-info .stat-divider {
    margin: 0 10px;
    color: #3a3a3a;
}

/* Стилизация кнопки "В избранное" внутри шапки */
.header-fav-btn-box .full__favorites {
    padding: 8px 16px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-radius: 6px !important;
    cursor: pointer;
    transition: var(--a-transition);
}

/* Избранное: Обычное состояние (Синяя) */
.header-fav-btn-box .btn-primary {
    background: #0077cc !important;
    border: 1px solid #0088ee !important;
}
.header-fav-btn-box .btn-primary:hover {
    background: #0088ee !important;
    box-shadow: 0 0 12px rgba(0, 136, 238, 0.4);
}

/* Избранное: Состояние "Добавлено" (Красная/Бордовая для контраста) */
.header-fav-btn-box .btn-danger {
    background: rgba(220, 53, 69, 0.2) !important;
    border: 1px solid rgba(220, 53, 69, 0.4) !important;
    color: #dc3545 !important;
}
.header-fav-btn-box .btn-danger:hover {
    background: rgba(220, 53, 69, 0.3) !important;
}

/* 📱 МОБИЛЬНАЯ АДАПТАЦИЯ ДЛЯ НОВОГО БЛОКА */
@media (max-width: 767.98px) {
    .header-meta-actions {
        flex-direction: column !important; /* На смартфонах выстраиваем в колонку */
        align-items: center !important;
        text-align: center;
        margin-top: 20px !important;
    }
    
    .header-stats-info {
        margin-bottom: 5px;
    }
    
    .header-fav-btn-box,
    .header-fav-btn-box .full__favorites {
        width: 100% !important; /* Кнопка растягивается на всю ширину экрана смартфона */
        justify-content: center !important;
    }
}

/* ========================================================= */
/* ИЗОЛИРОВАННЫЙ БЛОК УНИКАЛЬНОГО ОПИСАНИЯ РЕЛИЗА            */
/* ========================================================= */

/* Контейнер карточки (применяется только к описанию) */
.music-about-box {
    background: #262626 !important;
    border: 1px solid #2e2e2e !important;
    border-radius: 8px !important;
    padding: 24px !important; /* Внутренние отступы, чтобы текст "дышал" */
    margin-bottom: 24px !important;
    width: 100% !important;
}

/* Заголовок "О РЕЛИЗЕ" */
.music-about-box h2 {
    color: var(--a-color-white) !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin: 0 0 16px 0 !important;
    padding: 0 !important;
    border: none !important;
}

/* Сам массив текстового описания */
.music-about-box .about-text-content {
    font-size: 14px !important;
    line-height: 26px !important; /* Комфортный межстрочный интервал */
    color: #b3b3b3 !important;   /* Мягкий серый цвет текста */
    letter-spacing: 0.4px !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Выделение жирных ключевых слов (A-ha, Remastered, FLAC и т.д.) */
.music-about-box .about-text-content strong {
    color: var(--a-color-white) !important; /* Чисто белый цвет для контраста */
    font-weight: 600 !important;
}