/* Шапка (home/top.tpl): анонс, одна липкая строка, на телефоне — нижняя панель вкладок. Префикс hdr-.
   Правый блок ul.user-menu — старая разметка и старые стили (style_one.css), здесь только выравнивание в строку. */

:root {
	--hdr-h: 68px;
	--hdr-bg: rgba(24, 24, 27, .86);
	--hdr-panel: #232327;
	--hdr-line: rgba(255, 255, 255, .07);
	--hdr-accent: #da9256;
	--hdr-accent-hi: #eda162;
	--hdr-text: #d4d4dc;
	--hdr-muted: #8e8e98;
}

/* ---------- анонс ---------- */

.hdr-announce {
	position: relative;
	z-index: 1031;
	background: linear-gradient(90deg, #3a2414 0%, #5a3519 50%, #3a2414 100%);
	border-bottom: 1px solid rgba(218, 146, 86, .3);
}

.hdr-announce__in {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 36px;
	position: relative;
}

.hdr-announce__link {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	color: #f6d7bd !important;
	font-size: 12.5px;
	font-weight: 500;
	text-decoration: none !important;
}

.hdr-announce__link b {
	color: #fff;
	font-weight: 700;
}

.hdr-announce__link > .bx-gift {
	color: var(--hdr-accent-hi);
	font-size: 16px;
}

.hdr-announce__arrow {
	font-size: 16px;
	transition: transform .2s ease;
}

.hdr-announce__link:hover .hdr-announce__arrow {
	transform: translateX(3px);
}

.hdr-announce__close {
	position: absolute;
	right: 15px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	padding: 0;
	border: 0;
	border-radius: 8px;
	background: transparent;
	color: #c9a88c;
	font-size: 18px;
	cursor: pointer;
}

.hdr-announce__close:hover {
	background: rgba(255, 255, 255, .08);
	color: #fff;
}

/* ---------- строка шапки ---------- */

.wapper .header.hdr {
	position: relative;
	top: 0;
	z-index: 1030;
	height: var(--hdr-h);
	margin-bottom: 20px; /* раньше отступ до контента давала полоса меню */
	padding: 0;
	background: var(--hdr-bg);
	background-image: none;
	border-bottom: 1px solid var(--hdr-line);
	-webkit-backdrop-filter: blur(14px) saturate(140%);
	backdrop-filter: blur(14px) saturate(140%);
	transition: box-shadow .2s ease;
}

/* на главной под шапкой баннер со своим отступом — второй не нужен */
.wapper .content:has(> .mh) > .header.hdr {
	margin-bottom: 0;
}

/* прилипла при прокрутке (js/header.js): fixed + тень, на её месте — распорка .hdr-spacer */
.wapper .header.hdr.is-fixed {
	position: fixed;
	left: 0;
	right: 0;
	box-shadow: 0 10px 30px rgba(0, 0, 0, .35);
	animation: hdr-in .2s ease;
}

@keyframes hdr-in {
	from { transform: translateY(-100%); }
	to { transform: none; }
}

.hdr__in {
	display: flex;
	align-items: center;
	gap: 22px;
	height: 100%;
}

.hdr__logo {
	display: flex;
	align-items: center;
	flex: 0 0 auto;
}

.hdr__logo .logo {
	width: auto;
	height: 52px;
	margin: 0;
}

/* ---------- меню ---------- */

.hdr-nav {
	display: flex;
	align-items: center;
	gap: 4px;
	height: 100%;
}

.hdr-nav__link {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	height: 40px;
	padding: 0 14px;
	border: 0;
	border-radius: 12px;
	background: transparent;
	color: var(--hdr-text) !important;
	font-family: Montserrat, sans-serif;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none !important;
	white-space: nowrap;
	cursor: pointer;
	transition: background .2s ease, color .2s ease;
}

.hdr-nav__link > .bx:first-child {
	color: var(--hdr-accent);
	font-size: 18px;
}

.hdr-nav__chev {
	margin-left: -2px;
	color: var(--hdr-muted);
	font-size: 16px;
	transition: transform .2s ease;
}

.hdr-nav__link:hover,
.hdr-dd.is-open > .hdr-nav__link {
	background: rgba(255, 255, 255, .05);
	color: #fff !important;
}

/* текущий раздел */
.hdr-nav__link.is-active {
	color: #fff !important;
}

.hdr-nav__link.is-active::after {
	content: "";
	position: absolute;
	left: 14px;
	right: 14px;
	bottom: -14px;
	height: 3px;
	border-radius: 3px 3px 0 0;
	background: var(--hdr-accent);
}

/* ---------- выпадашки ---------- */

.hdr-dd {
	position: relative;
	display: flex;
	align-items: center;
	height: 100%;
}

.hdr-dd.is-open .hdr-nav__chev {
	transform: rotate(180deg);
}

.hdr-dd__panel {
	position: absolute;
	top: calc(100% - 4px);
	left: 0;
	z-index: 5;
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 280px;
	padding: 8px;
	border: 1px solid var(--hdr-line);
	border-radius: 16px;
	background: var(--hdr-panel);
	box-shadow: 0 20px 50px rgba(0, 0, 0, .5);
	opacity: 0;
	visibility: hidden;
	transform: translateY(6px);
	transition: opacity .15s ease, transform .15s ease, visibility 0s linear .15s;
}

.hdr-dd.is-open .hdr-dd__panel {
	opacity: 1;
	visibility: visible;
	transform: none;
	transition: opacity .15s ease, transform .15s ease;
}

.hdr-dd__panel--grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 6px;
	width: 520px;
}

.hdr-dd__card,
.hdr-dd__row {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px;
	border-radius: 12px;
	color: var(--hdr-text) !important;
	text-decoration: none !important;
	transition: background .15s ease;
}

.hdr-dd__card:hover,
.hdr-dd__row:hover {
	background: rgba(255, 255, 255, .05);
}

.hdr-dd__ico {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 42px;
	height: 42px;
	border-radius: 12px;
	color: #fff;
	font-size: 20px;
}

.hdr-dd__ico--vip { background: linear-gradient(135deg, #2d4dbb, #4f78ff); }
.hdr-dd__ico--cases { background: linear-gradient(135deg, #a8781c, #f0b43c); }
.hdr-dd__ico--models { background: linear-gradient(135deg, #7a2fb0, #b45cff); }
.hdr-dd__ico--frames { background: linear-gradient(135deg, #995d2b, #da9256); }

.hdr-dd__txt,
.hdr-dd__row > span {
	display: flex;
	flex-direction: column;
	min-width: 0;
	line-height: 1.3;
}

.hdr-dd__txt b,
.hdr-dd__row b {
	color: #fff;
	font-size: 13.5px;
	font-weight: 700;
}

.hdr-dd__txt small,
.hdr-dd__row small {
	color: var(--hdr-muted);
	font-size: 11.5px;
	font-weight: 500;
}

.hdr-dd__row > .bx {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 36px;
	height: 36px;
	border-radius: 10px;
	background: rgba(218, 146, 86, .12);
	color: var(--hdr-accent-hi);
	font-size: 18px;
}

.hdr-dd__foot {
	grid-column: 1 / -1;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	margin-top: 2px;
	padding: 10px;
	border-radius: 12px;
	background: rgba(255, 255, 255, .03);
	color: var(--hdr-accent-hi) !important;
	font-size: 12.5px;
	font-weight: 700;
	text-decoration: none !important;
}

.hdr-dd__foot:hover {
	background: rgba(218, 146, 86, .12);
}

/* ---------- правый блок ---------- */

.hdr__right {
	display: flex;
	align-items: center;
	gap: 6px;
	margin-left: auto;
}

.hdr-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 12px;
	color: var(--hdr-muted) !important;
	font-size: 21px;
	text-decoration: none !important;
	transition: background .2s ease, color .2s ease;
}

.hdr-icon:hover {
	background: rgba(255, 255, 255, .05);
	color: #fff !important;
}

/* старый ul.user-menu (float, отступы, сдвиги) — выстраиваем в строку */
.wapper .header.hdr ul.user-menu {
	display: flex;
	align-items: center;
	float: none;
	height: auto;
	margin: 0;
	padding: 0;
	left: 0; /* на мобильных старое правило сдвигает на -37px */
}

.wapper .header.hdr ul.user-menu > li.balance {
	top: 0;
	margin-left: 4px;
}

.wapper .header.hdr ul.user-menu > li:not(.balance):not(.collapsible) {
	margin: 0 1px;
}

/* иконки тикетов/жалоб/друзей/переписок/уведомлений: квадрат 40×40, значок по центру, счётчик в углу */
.hdr ul.user-menu > li > a.unban_btn,
.hdr ul.user-menu > li > a.complaint_btn,
.hdr ul.user-menu .forum-header-link,
.hdr ul.user-menu .show_user {
	position: relative;
	top: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	margin: 0;
	padding: 0;
	border-radius: 12px;
	background: transparent;
	color: var(--hdr-muted);
	line-height: 1;
	cursor: pointer;
	transition: background .2s ease, color .2s ease;
}

.hdr ul.user-menu > li > a.unban_btn:hover,
.hdr ul.user-menu > li > a.complaint_btn:hover,
.hdr ul.user-menu .forum-header-link:hover,
.hdr ul.user-menu .show_user:hover {
	background: rgba(255, 255, 255, .05);
	color: #fff;
}

.hdr ul.user-menu > li > a.unban_btn i,
.hdr ul.user-menu > li > a.complaint_btn i,
.hdr ul.user-menu .forum-header-link i,
.hdr ul.user-menu .show_user i {
	position: static !important; /* у колокольчика инлайн-стиль position:absolute */
	top: auto;
	width: auto;
	height: auto;
	margin: 0;
	padding: 0;
	font-size: 21px;
	line-height: 1;
}

.hdr ul.user-menu > li > a.unban_btn span,
.hdr ul.user-menu > li > a.complaint_btn span {
	position: absolute;
	top: 0;
	right: -2px;
}

.hdr ul.user-menu .forum-badge,
.hdr ul.user-menu .circleuved {
	top: 2px;
	right: 0;
}

/* аватар (старые правила вида .wapper .header ul.user-menu>li.collapsible>a img.without_frame — перебиваем той же длиной + .hdr) */
.wapper .header.hdr ul.user-menu > li.collapsible {
	margin: 0 4px 0 8px;
}

.wapper .header.hdr ul.user-menu > li.collapsible > a {
	display: flex;
	align-items: center;
	height: 44px;
}

.wapper .header.hdr ul.user-menu > li.collapsible .blockprofile {
	top: 0;
	display: flex;
	align-items: center;
	width: auto;
	margin: 0;
	padding: 0;
}

.wapper .header.hdr ul.user-menu > li.collapsible > a img.without_frame {
	top: 0;
	float: none;
	width: 42px;
	height: 42px;
	margin: 0;
}

/* аватар с рамкой: обёртка была 0×0, а маска (38) и рамка (42) внутри — absolute; задаём размер и центрируем */
.wapper .header.hdr ul.user-menu > li.collapsible .memberViewAvatarWrapper2 {
	position: relative;
	top: 0;
	float: none;
	width: 42px;
	height: 42px;
	margin: 0;
}

.wapper .header.hdr ul.user-menu > li.collapsible .memberViewAvatarWrapper2 .memberViewSvgMask {
	top: 2px;
	left: 2px;
}

.wapper .header.hdr ul.user-menu > li.collapsible .memberViewAvatarWrapper2 .memberViewAvatarDecoration {
	top: 0;
	left: 0;
}

/* стрелка у аватара — в правом нижнем углу аватара */
.wapper .header.hdr ul.user-menu > i.bx-chevron-down {
	top: auto;
	bottom: -2px;
	right: -2px;
}

/* «Пополнить» в шапке — акцентная: главная денежная кнопка */
.wapper .header.hdr ul.user-menu > li.balance a.pursee-button {
	background: linear-gradient(23deg, #995d2b 0%, #da9256 55%, #eda162 100%);
	color: #fff !important;
	font-weight: 700;
	box-shadow: 0 4px 14px rgba(218, 146, 86, .35);
	transition: filter .2s ease, box-shadow .2s ease;
}

.wapper .header.hdr ul.user-menu > li.balance a.pursee-button:hover {
	filter: brightness(1.08);
	box-shadow: 0 6px 18px rgba(218, 146, 86, .5);
}

/* ---------- меню профиля (li.collapsible > ul.hdr-pm-wrap, открывает js/mix.js) ---------- */

.wapper .header.hdr ul.user-menu > li.collapsible > ul.hdr-pm-wrap {
	top: calc(100% + 12px);
	right: -4px;
	width: 320px;
	min-width: 320px !important; /* mix.js ставит min-width по ширине аватара */
	padding: 0;
	border: 1px solid var(--hdr-line);
	border-radius: 18px;
	background: var(--hdr-panel);
	box-shadow: 0 20px 50px rgba(0, 0, 0, .55);
}

.wapper .header.hdr ul.user-menu > li.collapsible > ul.hdr-pm-wrap > li.hdr-pm,
.wapper .header.hdr ul.user-menu > li.collapsible > ul.hdr-pm-wrap > li.hdr-pm:hover {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 14px;
	background: transparent;
}

.hdr-pm__head {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 4px 4px 2px;
}

.hdr-pm__ava {
	position: relative;
	flex: 0 0 48px;
	width: 48px;
	height: 48px;
}

/* с рамкой: маска 38 + рамка 42 (absolute) — обёртку 42×42 по центру блока 48 */
.wapper .header.hdr .hdr-pm__ava .memberViewAvatarWrapper {
	position: relative;
	top: 0;
	left: 0;
	float: none;
	width: 42px;
	height: 42px;
	margin: 3px;
}

.wapper .header.hdr .hdr-pm__ava .memberViewSvgMask {
	top: 2px;
	left: 2px;
}

.wapper .header.hdr .hdr-pm__ava .memberViewAvatarDecoration {
	top: 0;
	left: 0;
}

.hdr-pm__ava > img {
	width: 48px;
	height: 48px;
	border-radius: 50%;
	object-fit: cover;
}

.hdr-pm__who {
	display: flex;
	flex-direction: column;
	min-width: 0;
	line-height: 1.3;
}

.hdr-pm__name {
	overflow: hidden;
	color: #fff !important;
	font-size: 15px;
	font-weight: 700;
	white-space: nowrap;
	text-overflow: ellipsis;
	text-decoration: none !important;
}

.hdr-pm__group {
	font-size: 12px;
	font-weight: 600;
}

.hdr-pm__wallet {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px;
	border: 1px solid rgba(218, 146, 86, .22);
	border-radius: 14px;
	background: linear-gradient(135deg, rgba(218, 146, 86, .14), rgba(218, 146, 86, .04));
}

.hdr-pm__wallet-ico {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 36px;
	height: 36px;
	border-radius: 10px;
	background: rgba(218, 146, 86, .2);
	color: var(--hdr-accent-hi);
	font-size: 19px;
}

.hdr-pm__wallet-sum {
	display: flex;
	flex-direction: column;
	line-height: 1.25;
}

.hdr-pm__wallet-sum small {
	color: var(--hdr-muted);
	font-size: 11px;
	font-weight: 600;
}

.hdr-pm__wallet-sum b {
	color: #fff;
	font-size: 15px;
	font-weight: 700;
}

.hdr-pm__topup {
	display: inline-flex;
	align-items: center;
	gap: 3px;
	margin-left: auto;
	padding: 8px 12px;
	border-radius: 10px;
	background: linear-gradient(23deg, #995d2b 0%, #da9256 55%, #eda162 100%);
	box-shadow: 0 4px 14px rgba(218, 146, 86, .35);
	color: #fff !important;
	font-size: 12.5px;
	font-weight: 700;
	text-decoration: none !important;
	transition: filter .2s ease;
}

.hdr-pm__topup:hover {
	filter: brightness(1.08);
}

.hdr-pm__quick {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 6px;
}

.hdr-pm__quick a {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	padding: 10px 2px 8px;
	border: 1px solid var(--hdr-line);
	border-radius: 12px;
	background: rgba(255, 255, 255, .02);
	color: var(--hdr-text) !important;
	font-size: 10.5px;
	font-weight: 600;
	text-decoration: none !important;
	transition: background .15s ease, border-color .15s ease;
}

.hdr-pm__quick a i {
	color: var(--hdr-accent-hi);
	font-size: 20px;
}

.hdr-pm__quick a:hover {
	border-color: rgba(218, 146, 86, .35);
	background: rgba(218, 146, 86, .08);
}

.hdr-pm__list {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.hdr-pm__list--admin {
	padding-top: 8px;
	border-top: 1px solid var(--hdr-line);
}

.hdr-pm__label {
	margin: 0 8px 4px;
	color: var(--hdr-muted);
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: .6px;
	text-transform: uppercase;
}

.hdr-pm__list a {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 9px 8px;
	border-radius: 10px;
	color: var(--hdr-text) !important;
	font-size: 13px;
	font-weight: 600;
	text-decoration: none !important;
	transition: background .15s ease;
}

.hdr-pm__list a:hover {
	background: rgba(255, 255, 255, .05);
	color: #fff !important;
}

.hdr-pm__list a > i:first-child {
	color: var(--hdr-accent-hi);
	font-size: 18px;
}

.hdr-pm__list a > i:last-child {
	margin-left: auto;
	color: #5c5c64;
	font-size: 16px;
}

.hdr-pm__list a > span {
	flex: 1 1 auto;
}

.hdr-pm__exit {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 10px;
	border: 1px solid rgba(255, 96, 84, .22);
	border-radius: 12px;
	background: rgba(255, 96, 84, .06);
	color: #ff7a70 !important;
	font-size: 13px;
	font-weight: 700;
	text-decoration: none !important;
	transition: background .15s ease;
}

.hdr-pm__exit:hover {
	background: rgba(255, 96, 84, .14);
}

/* «Выйти» лежит прямо в li — старые правила ul.user-menu>li>ul>li>a (ширина, отступы) перебиваем */
.wapper .header.hdr ul.user-menu > li.collapsible > ul.hdr-pm-wrap > li.hdr-pm > a.hdr-pm__exit {
	position: static;
	left: auto;
	display: flex;
	align-self: stretch;
	width: auto;
	max-width: none; /* style_three.css на мобильных: max-width 225px, left -25px */
	height: auto;
	margin: 0;
	padding: 10px;
	line-height: 1.2;
}

/* ---------- телефон / планшет ---------- */

.hdr-tabs,
.hdr-sheet {
	display: none;
}

@media (max-width: 991px) {
	.hdr-nav {
		display: none;
	}

	.hdr-announce__text {
		display: none;
	}

	.wapper .header.hdr {
		--hdr-h: 60px;
		position: relative; /* на мобильных body с overflow-x:hidden — sticky там не работает */
	}

	.hdr__logo .logo {
		height: 44px;
	}

	.wapper .header.hdr {
		margin-bottom: 16px;
	}

	/* место под нижнюю панель — только где она есть (у гостей шапки нет) */
	body:has(.hdr-tabs) {
		padding-bottom: calc(66px + env(safe-area-inset-bottom));
	}

	.hdr-tabs {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 1037; /* над листом «Ещё» — вкладки видны, лист выезжает из-под них */
		display: flex;
		justify-content: space-around;
		padding: 6px 6px calc(6px + env(safe-area-inset-bottom));
		border-top: 1px solid var(--hdr-line);
		background: rgba(24, 24, 27, .94);
		-webkit-backdrop-filter: blur(14px);
		backdrop-filter: blur(14px);
	}

	.hdr-tabs__item {
		display: flex;
		flex: 1 1 0;
		flex-direction: column;
		align-items: center;
		gap: 3px;
		padding: 5px 0;
		border: 0;
		background: transparent;
		color: var(--hdr-muted) !important;
		font-family: Montserrat, sans-serif;
		font-size: 10.5px;
		font-weight: 600;
		text-decoration: none !important;
	}

	.hdr-tabs__item i {
		font-size: 23px;
	}

	.hdr-tabs__item.is-active {
		color: var(--hdr-accent-hi) !important;
	}

	/* «Играть» — главная кнопка по центру */
	.hdr-tabs__item--play i {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 46px;
		height: 46px;
		margin-top: -20px;
		border-radius: 50%;
		background: linear-gradient(23deg, #995d2b 0%, #da9256 55%);
		box-shadow: 0 6px 18px rgba(218, 146, 86, .45), 0 0 0 5px #18181b;
		color: #fff;
		font-size: 26px;
	}

	.hdr-tabs__item--play {
		color: var(--hdr-accent-hi) !important;
	}

	/* лист «Ещё» / «Магазин» */
	.hdr-sheet {
		position: fixed;
		inset: 0;
		z-index: 1036;
		display: block;
		visibility: hidden;
	}

	.hdr-sheet.is-open {
		visibility: visible;
	}

	.hdr-sheet__backdrop {
		position: absolute;
		inset: 0;
		background: rgba(0, 0, 0, .55);
		opacity: 0;
		transition: opacity .2s ease;
	}

	.hdr-sheet.is-open .hdr-sheet__backdrop {
		opacity: 1;
	}

	.hdr-sheet__body {
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		max-height: 80vh;
		padding: 10px 16px calc(84px + env(safe-area-inset-bottom));
		overflow-y: auto;
		border-radius: 22px 22px 0 0;
		border-top: 1px solid var(--hdr-line);
		background: #1c1c1f;
		transform: translateY(100%);
		transition: transform .25s ease;
	}

	.hdr-sheet.is-open .hdr-sheet__body {
		transform: none;
	}

	.hdr-sheet__grip {
		display: block;
		width: 40px;
		height: 4px;
		margin: 0 auto 14px;
		border-radius: 4px;
		background: #3a3a40;
	}

	.hdr-sheet__group + .hdr-sheet__group {
		margin-top: 18px;
	}

	.hdr-sheet__group.is-hidden {
		display: none;
	}

	.hdr-sheet__title {
		display: block;
		margin: 0 4px 10px;
		color: var(--hdr-muted);
		font-size: 11px;
		font-weight: 700;
		letter-spacing: .6px;
		text-transform: uppercase;
	}

	.hdr-sheet__grid {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 8px;
	}

	.hdr-sheet__grid a {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 6px;
		padding: 14px 6px 12px;
		border: 1px solid var(--hdr-line);
		border-radius: 14px;
		background: #232327;
		color: var(--hdr-text) !important;
		font-size: 12px;
		font-weight: 600;
		text-align: center;
		text-decoration: none !important;
	}

	.hdr-sheet__grid a i {
		color: var(--hdr-accent-hi);
		font-size: 22px;
	}
}