﻿@font-face {
	font-family: 'Montserrat';
	src: url('../fonts/Montserrat-Regular.woff2') format('woff2'),
		url('../fonts/Montserrat-Regular.woff') format('woff');
	font-weight: 400;
	font-style: normal;
}
@font-face {
	font-family: 'Montserrat';
	src: url('../fonts/Montserrat-Medium.woff2') format('woff2'),
		url('../fonts/Montserrat-Medium.woff') format('woff');
	font-weight: 500;
	font-style: normal;
}

/*! mine_management: duplicated styles from .page-new-private-mine for newmine/nm blocks */
.mine_management .newmine-form {
	display: flex;
	flex-direction: column;
	gap: 15rem;
}

.mine_management .newmine-col {
	width: 100%;
}

/* второй столбец по умолчанию сверху вниз */
.mine_management .newmine-col--right {
	margin-top: 15rem;
}

/* label выпадающего списка - по умолчанию 100% */
.mine_management .newmine-select-label {
	width: 100%;
}

/* контейнер формы - на мобиле отступы 15rem */
.mine_management .newmine-container {
	padding-left: 15rem;
	padding-right: 15rem;
	margin-top: 20rem;
}

/* дополнительные утилитарные стили */
.mine_management .nm-header {
	display: flex;
	align-items: center;
	flex-direction: column;
	margin-top: 30rem;
}

.mine_management .nm-subtitle {
	position: relative;
	margin: 0;
	margin-bottom: 3rem;
	padding-bottom: 2rem;
	font-weight: 400;
	font-size: 16rem;
	line-height: 18rem;
	text-align: center;
	letter-spacing: -0.04em;
	color: var(--c10one);
}

.mine_management .nm-region-row {
	display: flex;
	align-items: center;
	margin-top: 8rem;
}

.mine_management .nm-region-img {
	display: block;
	top: 5rem;
	left: 6rem;
	width: 30rem;
	height: 30rem;
	object-fit: contain;
	object-position: center;
	margin-right: 10rem;
}

.mine_management .newmine-h3 {
	margin: 0;
	margin-bottom: 20rem;
	font-weight: 400;
	font-size: 16rem;
	line-height: 16rem;
	letter-spacing: -0.04em;
	color: var(--c10one);
}

.mine_management .newmine-input {
	display: block;
	width: 100%;
	height: 30rem;
	border: 1px solid color-mix(in srgb, var(--c10one) 30%, transparent);
	padding: 0 8rem;
	font-weight: 400;
	font-size: 14rem;
	line-height: 20rem;
	letter-spacing: -0.04em;
	color: var(--c10one);
	background-color: transparent;
	outline: none;
}

.mine_management .newmine-form--spaced {
	margin-top: 15rem;
}

.mine_management .nm-overview-title {
	position: relative;
	top: initial;
	transform: translate(-50%, 0%);
	margin-bottom: 10rem;
}

.mine_management .nm-info {
	margin-bottom: 10rem;
	width: 100%;
	font-size: 16rem;
}

.mine_management .nm-info--mt20 {
	margin-top: 20rem;
}

.mine_management .nm-info--muted {
	color: var(--c10two);
}

.mine_management .nm-card-overlay {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 2;
	display: flex;
	flex-direction: column;
	width: max-content;
	align-items: center;
	padding-left: 15rem;
	padding-right: 15rem;
}

.mine_management .nm-text-center-16 {
	font-size: 16rem;
	text-align: center;
	z-index: 2;
	position: relative;
	margin-top: 8rem;
	line-height: 14rem;
	letter-spacing: -0.04em;
	margin-bottom: 10rem;
}

.mine_management .nm-text-highlight {
	color: #eb9929;
}

.mine_management .nm-row-gap-5 {
	display: flex;
	gap: 5rem;
}

/* Локальный класс, эквивалент visual-ролли .ct__card */
.mine_management .nm-ct-card {
	position: relative;
	display: grid;
	width: 312rem;
	height: 98rem;
	column-gap: 10rem;
	padding: 9rem 12rem 12rem;
	grid-template-columns: 108rem 170rem;
	color: var(--c10one);
}

.mine_management .nm-ct-card svg {
	position: absolute;
	left: 0;
	top: 0;
	width: 312rem;
	height: 98rem;
}

/* Локальные правки верстки страницы управления */
.mine_management .profile__mainFlex {
	display: flex;
	margin-left: 10rem;
}
.mine_management .profile__top-left--wide,
.mine_management .profile__ava--wide {
	width: 200rem;
	height: 200rem;
}

@media (min-width: 1000px) {
	.mine_management .newmine-form {
		flex-direction: row;
		gap: 10vw;
	}
	.mine_management .newmine-col {
		width: 50%;
	}
	/* На ПК убираем отступ сверху и выравниваем содержимое вниз/вправо */
	.mine_management .newmine-col--right {
		margin-top: 0;
		display: flex;
		flex-direction: column;
		justify-content: flex-end;
		align-items: flex-end;
	}
	/* На ПК label выпадающего списка - 50% */
	.mine_management .newmine-select-label {
		width: 50%;
	}
	/* На ПК для некоторых select оставляем 100% ширину */
	.mine_management .newmine-select-label--full {
		width: 100%;
	}
	/* На ПК контейнер формы - отступы 15vw */
	.mine_management .newmine-container {
		padding-left: 15vw;
		padding-right: 15vw;
	}
	/* На ПК игнорируем выравнивание .newmine-col--right для некоторых блоков */
	.mine_management .newmine-col--right .newmine-right-ignore {
		align-self: flex-start;
		margin-right: auto;
		margin-bottom: auto;
	}
}
/*! ----------normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css---------- */
html {
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
}
body {
	margin: 0;
}
main {
	display: block;
	height: 100%;
}
h1 {
	font-size: 2em;
	margin: 0.67em 0;
}
hr {
	-webkit-box-sizing: content-box;
	box-sizing: content-box;
	height: 0;
	overflow: visible;
}
pre {
	font-family: monospace, monospace;
	font-size: 1em;
}
a {
	background-color: transparent;
}
abbr[title] {
	border-bottom: none;
	text-decoration: underline;
	-webkit-text-decoration: underline dotted;
	text-decoration: underline dotted;
}
b,
strong {
	font-weight: bolder;
}
code,
kbd,
samp {
	font-family: monospace, monospace;
	font-size: 1em;
}
small {
	font-size: 80%;
}
sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}
sub {
	bottom: -0.25em;
}
sup {
	top: -0.5em;
}
img {
	border-style: none;
}
button,
input,
optgroup,
select,
textarea {
	font-family: inherit;
	font-size: 100%;
	line-height: 1.15;
	margin: 0;
}
button,
input {
	overflow: visible;
}
button,
select {
	text-transform: none;
}
button,
[type='button'],
[type='reset'],
[type='submit'] {
	-webkit-appearance: button;
}
button::-moz-focus-inner,
[type='button']::-moz-focus-inner,
[type='reset']::-moz-focus-inner,
[type='submit']::-moz-focus-inner {
	border-style: none;
	padding: 0;
}
button:-moz-focusring,
[type='button']:-moz-focusring,
[type='reset']:-moz-focusring,
[type='submit']:-moz-focusring {
	outline: 1px dotted ButtonText;
}
fieldset {
	padding: 0.35em 0.75em 0.625em;
}
legend {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	color: inherit;
	display: table;
	max-width: 100%;
	padding: 0;
	white-space: normal;
}
progress {
	vertical-align: baseline;
}
textarea {
	overflow: auto;
}
[type='checkbox'],
[type='radio'] {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	padding: 0;
}
[type='number']::-webkit-inner-spin-button,
[type='number']::-webkit-outer-spin-button {
	height: auto;
}
[type='search'] {
	-webkit-appearance: textfield;
	outline-offset: -2px;
}
[type='search']::-webkit-search-decoration {
	-webkit-appearance: none;
}
::-webkit-file-upload-button {
	-webkit-appearance: button;
	font: inherit;
}
details {
	display: block;
}
summary {
	display: list-item;
}
template {
	display: none;
}
[hidden] {
	display: none;
}
/*! ----------End of Normalize.css---------- */
html {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	font-size: calc(100vw / 360);
	margin: 0;
	width: 100vw;
	height: 100vh;
}
*,
*:before,
*:after {
	-webkit-box-sizing: inherit;
	box-sizing: inherit;
}
body {
	font-family: 'Montserrat', arial, sans-serif;
	color: var(--c10one);
	background-color: var(--c60);
	min-height: 100vh;
	margin: 0;
	width: 100vw;
	height: 100vh;
	position: relative;
	overflow: hidden;
}
.mainwrapper {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}

@media (min-width: 1000px) {
	html {
		font-size: calc(100vw / 1600);
	}
	body {
		position: relative;
		overflow: hidden;
	}
	.mainwrapper {
		position: relative;
		width: 100vw;
		height: 100vh;
		overflow: hidden;
		background-size: cover;
		background-repeat: no-repeat;
		background-position: center;
	}
}
main {
	position: relative;
}
img {
	max-width: 100%;
}
a {
	text-decoration: none;
}
button {
	cursor: pointer;
}

.border-top {
	z-index: 3;
	position: absolute;
	top: -2rem;
	left: -1rem;
	width: 362rem;
	height: 194rem;
	pointer-events: none;
}
.border-bottom {
	z-index: 3;
	transform: scaleY(-1);
	position: absolute;
	bottom: -2rem;
	left: -1rem;
	width: 362rem;
	height: 194rem;
	pointer-events: none;
}
/*! ----- info ----- */

.info {
	z-index: 5;
	position: fixed;
	left: 0;
	bottom: 0;
	width: 100vw;
	height: 60rem;
	display: flex;
	background-image: linear-gradient(to right, var(--c30), var(--c60));
}

.info__profile-link {
	display: block;
	width: 60rem;
	height: 60rem;
}

.info__ava {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

.info__left-col {
	display: flex;
	flex-direction: column;
	flex-shrink: 0;
	width: 119rem;
	margin-right: 19rem;
	padding-left: 13rem;
	padding-top: 4rem;
	font-weight: 500;
	font-size: 14rem;
	line-height: 16rem;
}

.info__money {
	margin: 0;
	margin-bottom: 1rem;
	text-align: left;
	letter-spacing: -0.05em;
	color: var(--c10one);
}

.info__gold {
	margin: 0;
	margin-bottom: 1rem;
	text-align: left;
	color: #eb9929;
}

.info__energy {
	margin: 0;
	color: var(--c10one);
	margin-left: -4rem;
}

.info__energy-move-left {
	margin-left: -5rem;
}

.info__right-col {
	display: flex;
	flex-direction: column;
	width: 81rem;
	padding-top: 7rem;
	margin-right: auto;
}

.info__add-energy {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 81rem;
	height: 28rem;
	margin-bottom: 3rem;
	padding: 0;
	background-color: var(--c10two);
	color: var(--c60);
	font-weight: 500;
	font-size: 18rem;
	line-height: 16rem;
	border: none;
}

.info__fill-text {
	font-size: 14rem;
	letter-spacing: -0.05em;
}

.info__right-col-wrapper {
	display: flex;
	justify-content: space-between;
	font-weight: 500;
	font-size: 14rem;
	line-height: 16rem;
	color: var(--c10one);
}

.info__plus {
	margin: 0;
	flex-shrink: 0;
}

.info__move-en-left {
	margin-left: -5rem;
}

.info__plus-time {
	margin: 0;
	flex-shrink: 0;
}

.info__open-nav {
	width: 60rem;
	height: 60rem;
	position: relative;
	border: none;
	background-color: var(--c10two);
}

.info__soc-list {
	display: none;
}

@media (min-width: 1000px) {
	.info {
		bottom: initial;
		top: 0;
		height: 100rem;
	}
	.info__open-nav {
		display: none;
	}
	.info__left-col {
		/* flex-direction: row; */
		width: max-content;
		justify-content: center;
		margin-right: 30rem;
		font-size: 16rem;
		padding-left: 30rem;
	}
	.info__money,
	.info__gold,
	.info__add-energy,
	.info__plus {
		margin-bottom: 10rem;
	}
	.info__right-col {
		/* flex-direction: row; */
		align-items: center;
		justify-content: center;
		font-size: 16rem;
		width: max-content;
	}
	.info__profile-link {
		width: 100rem;
		height: 100rem;
	}
	.info__add-energy {
		width: 100rem;
		padding: 0 6rem;
		flex-shrink: 0;
	}
	.info__soc-list {
		display: flex;
		position: absolute;
		top: 50%;
		right: 27rem;
		transform: translateY(-50%);
		padding-left: 0;
		margin: 0;
		list-style: none;
	}
	.info__soc-item {
	}
	.info__soc-item:not(:last-of-type) {
		margin-right: 20rem;
	}
	.info__soc-link {
		display: block;
		width: 40rem;
		height: 40rem;
	}
	.info__soc-link svg {
		display: block;
		width: 100%;
		height: 100%;
	}
}

/*! ----- profile ----- */
.profile {
	padding-top: 22rem;
	width: 100vw;
	overflow-x: hidden;
	padding-bottom: 88rem;
	height: 100vh;
}

.profile__top-wrapper {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	width: 100vw;
	margin-bottom: 24rem;
	padding-right: 12rem;
	padding-left: 12rem;
	overflow: hidden;
	transition: all 0.3s ease;
}

.profile__top-wrapper.hidden {
	height: 0;
}

.profile__top-left {
	position: relative;
	display: flex;
	width: 200rem;
	height: 200rem;
}

.profile__id {
	position: absolute;
	top: 0;
	left: 0;
	width: 97rem;
	height: 24rem;
	display: flex;
	align-items: center;
	padding: 0;
	padding-left: 12rem;
	font-weight: 400;
	font-size: 14rem;
	line-height: 14rem;
	color: var(--c10one);
	border: 0;
	background-color: transparent;
}

.profile__id span {
	z-index: 2;
	position: relative;
}

.profile__id-copyed {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 24rem;
	height: 24rem;
}

.profile__id.active .profile__id-copyed {
	animation: copyed 1s ease-in;
}

@keyframes copyed {
	0% {
		transform: translateX(0) scale(1);
		opacity: 0;
	}
	35% {
		transform: translateX(-100%) scale(1);
		opacity: 1;
	}
	100% {
		transform: translateX(-100%) scale(1.25);
		opacity: 0;
	}
}

.profile__id-corner {
	z-index: 1;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.profile__ava {
	width: 200rem;
	height: 200rem;
	object-fit: contain;
	object-position: center;
}

.profile__ava--wide,
.profile__top-left--wide {
	width: 312rem;
	height: 312rem;
}

.profile__ava-border {
	position: absolute;
	top: 0;
	left: 0;
}

.profile__load-img {
	display: block;
	position: absolute;
	width: 30rem;
	height: 30rem;
	top: 0;
	right: 0;
}

.profile__load-img svg {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}

.profile__top-right {
	display: flex;
	flex-direction: column;
	width: 100rem;
}

.profile__info svg {
	transition: all 0.5s ease;
}

.profile__info.active .profile__info-i1 {
	fill: var(--c60);
	stroke: var(--c60);
}

.profile__info.active .profile__info-i2 {
	stroke: var(--c60);
}

.profile__info.active .profile__info-i3 {
	stop-color: var(--c10two);
}

.profile__info.active .profile__info-i4 {
	stop-color: var(--c10two);
	stop-opacity: 1;
}

.profile__repost svg {
	transition: all 0.5s ease;
}

.profile__repost.active .profile__repost-sl {
	fill: var(--c10one);
}

.profile__repost.active .profile__repost-rup {
	stroke: var(--c60);
}

.profile__repost.active .profile__repost-g1 {
	stop-color: var(--c10two);
}

.profile__repost.active .profile__repost-g2 {
	stop-color: var(--c10two);
	stop-opacity: 1;
}

.profile__tabs-wrapper {
	position: static;
	display: flex;
	width: 200vw;
	margin-top: 24rem;
	height: calc(100vh - 398rem);
	overflow: auto;
	transition: all 0.5s ease;
}

/* .profile__tabs-wrapper::before {
  width: 100%;
  height: 24rem;
  position: fixed;
  left: 0;
  bottom: 0;
  display: block;
  content: '';
  background-image: linear-gradient(to top, var(--c60), transparent);
} */

.profile__info-tab {
	width: 100vw;
	padding-left: 24rem;
	padding-bottom: 24rem;
	height: calc(100% - 50rem);
	overflow-y: auto;
}

.profile__s-textarea {
	width: calc(100% - 24rem);
	height: 72rem;
	margin-top: 12rem;
	border: 1px solid rgba(255, 255, 255, 0.1);
	background-color: transparent;
	resize: none;
	color: var(--c10one);
}

.profile__repost-tab {
	width: 100vw;
	padding-left: 24rem;
}

.profile__repost-status {
	width: 312rem;
	height: 24rem;
	font-weight: 400;
	font-size: 14rem;
	line-height: 24rem;
	margin-top: 20rem;
	margin-bottom: 0;
	text-align: center;
	color: var(--c10two);
	border: 1px solid var(--c10two);
}

.profile__repost-status.ok {
	color: var(--c10one);
	border: 1px solid var(--c10one);
}

.profile__get-gold {
	margin-left: 68rem;
	margin-top: 24rem;
	position: relative;
}

.profile__gridMenu {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 6rem;
	padding: 0 24rem;
}

.profile__gridBtn {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 6rem;
	justify-content: center;
	align-items: center;
	background-color: transparent;
	width: 100rem;
	height: 100rem;
	border: 0;
	cursor: pointer;
}

.profile__gridBtn::before {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	content: '';
	border: 1px solid var(--c10one);
	opacity: 0.25;
	pointer-events: none;
}

.profile__gridBtn svg,
.profile__gridBtn img {
	display: block;
	width: 40rem;
	height: 40rem;
	object-fit: contain;
	object-position: center;
}

.profile__gridBtn span {
	font-size: 14rem;
	color: var(--c10one);
}

.profile__gridBtn--disabled {
	opacity: 0.25;
	pointer-events: none;
}

.profile__modal {
	z-index: 10;
	padding-top: 60rem;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: var(--c60);
	display: flex;
	flex-direction: column;
	transform: translateX(-101%);
	transition: all 0.5s ease;
}

.profile__modal.active {
	transform: translateX(0);
}

.profile__outerLinkSvg {
	position: absolute;
	top: 3rem;
	right: 3rem;
	width: 12rem !important;
	height: 12rem !important;
	object-fit: contain;
	object-position: center;
}

.profile__modalInfo {
	padding-left: 24rem;
	padding-right: 24rem;
}

@media (min-width: 1000px) {
	.profile {
		margin-top: 100rem;
		margin-left: 330rem;
		height: calc(100vh - 110rem);
		width: initial;
		overflow-y: auto;
		overflow-x: hidden;
	}
	.profile__mainFlex {
		display: flex;
		gap: 24rem;
		justify-content: center;
		align-items: center;
	}
	.profile__tabs-wrapper {
		width: initial;
		height: calc(100vh - 398rem);
	}
	.profile__top-wrapper {
		width: 100%;
		height: initial;
		flex-direction: column;
		align-items: center;
	}
	.profile__top-wrapper--pc {
		width: initial;
		margin: 0;
	}
	.profile__top-right {
		display: none;
	}
	.profile__repost-status {
		margin: 0 auto;
		margin-top: 20rem;
		margin-bottom: 0;
	}
	.ct__long-btn {
		margin: 0 auto;
		margin-top: 24rem;
	}
	.profile__modal {
		padding: 24rem;
		position: static;
		display: flex;
		height: initial;
		transform: translateX(0);
	}
	.profile__modal .box__close {
		display: none;
	}
	.profile__gridMenu {
		padding: 0;
		max-width: max-content;
		grid-template-rows: 100rem 100rem;
	}
}

/*! ----- nav ----- */

.nav {
	z-index: 1000;
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: calc(100% - 60rem);
	background-color: var(--c60);
	transform: translateX(150vw);
	transition: all 0.5s ease;
}

.nav.active {
	transform: translateX(0);
}

.nav__list {
	height: 100%;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	justify-content: space-evenly;
}

.nav__item {
	flex-shrink: 0;
	height: 40rem;
	position: relative;
	list-style-type: none;
}

.nav__item--flex {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-content: center;
}

.nav__item::before,
.nav__item::after {
	display: block;
	width: 250rem;
	height: 1px;
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	content: '';
	background-image: linear-gradient(
		to right,
		var(--c60),
		var(--c30),
		var(--c60)
	);
}

.nav__item::after {
	top: initial;
	bottom: 0;
}

.nav__item-flex {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0 40rem;
}

.nav__item-link {
	position: static;
	display: block;
	width: 40rem;
	height: 40rem;
}

.nav__item-link svg {
	display: block;
	width: 100%;
	height: 100%;
}

.nav__link {
	display: flex;
	align-items: center;
	height: 100%;
	padding-left: 108rem;
	font-weight: 400;
	font-size: 22rem;
	line-height: 22rem;
	letter-spacing: -0.04em;
	color: var(--c10one);
}

.nav__item.active .nav__link {
	color: var(--c10two);
}

.nav__svg-wrapper {
	position: absolute;
	top: 0;
	left: 28rem;
	width: 60rem;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}

.icon-view svg {
	width: 44rem;
	height: 31rem;
}

.nav__svg-newMessage {
	position: absolute;
	right: 24rem;
	top: 50%;
	transform: translateY(-50%);
	display: block;
	width: 47rem;
	height: 32rem;
	border: 0;
	background-color: transparent;
	padding: 0;
}

.nav__svg-newMessage.animated {
	animation: morgmorg ease 2s infinite;
}

@keyframes morgmorg {
	0% {
		opacity: 1;
	}
	50% {
		opacity: 0.5;
	}
	100% {
		opacity: 1;
	}
}

.nav__svg-newMessage svg {
	display: block;
	width: 100%;
	height: 100%;
}

.icon-main svg {
	width: 46rem;
	height: 46rem;
}

.icon-store svg {
	width: 30rem;
	height: 31rem;
}

.icon-sources svg {
	width: 39rem;
	height: 31rem;
}

.icon-trade svg {
	width: 36rem;
	height: 30rem;
}

.icon-craft svg {
	width: 31rem;
	height: 30rem;
}

.icon-map svg {
	width: 31rem;
	height: 32rem;
}

.icon-party svg {
	width: 44rem;
	height: 31rem;
}

.icon-goverment svg {
	width: 31rem;
	height: 30rem;
}

.icon-wars svg {
	width: 58rem;
	height: 30rem;
}

.icon-paper svg {
	width: 38rem;
	height: 30rem;
}

@media (min-width: 1000px) {
	.nav {
		transform: none;
		width: 330rem;
		height: calc(100vh - 100rem);
		top: initial;
		bottom: 0;
		background-image: linear-gradient(to right bottom, var(--c30), var(--c60));
	}
	.nav__item {
		height: 45rem;
	}
}

/*! Earn */

.earn {
	padding-top: 14rem;
	padding-bottom: 24rem;
	height: calc(100% - 60rem);
	overflow-y: auto;
	overflow-x: hidden;
}

.earn__title {
	margin: 0;
	margin-bottom: 24rem;
}

.earn__info {
	margin: 0 auto;
	width: 312rem;
	margin-bottom: 20rem;
	font-weight: 400;
	font-size: 18rem;
	line-height: 22rem;
	text-align: center;
	letter-spacing: -0.04em;
}

.earn__energy-wrapper {
	margin: 0 auto;
	margin-bottom: 20rem;
}

.earn__after-btn {
	margin: 0;
	margin-bottom: 24rem;
	font-size: 14rem;
	line-height: 14rem;
	text-align: center;
	color: var(--c10one);
}

.earn__region-title {
	margin: 0;
	margin-bottom: 20rem;
	font-weight: 400;
	font-size: 18rem;
	line-height: 22rem;
	text-align: center;
	letter-spacing: -0.04em;
	color: var(--c10one);
}

.earn__card {
	margin: 0 auto;
}

.earn__card:not(:last-of-type) {
	margin-bottom: 20rem;
}

.earn__long-btn {
	margin: 0 auto;
}

@media (min-width: 1000px) {
	.earn {
		padding-bottom: 30rem;
		height: calc(100vh - 100rem);
		margin-top: 100rem;
		margin-left: 330rem;
	}
}

/*! AvatarBorders */

.avabord {
	padding-top: 14rem;
	padding-bottom: 24rem;
	height: calc(100% - 60rem);
	overflow-y: auto;
	overflow-x: hidden;
}

.avabord__title {
	margin: 0;
	margin-bottom: 24rem;
}

.avabord__subtitle {
	display: flex;
	gap: 6rem;
	align-items: center;
	font-size: 16px;
	text-transform: uppercase;
	letter-spacing: 3px;
	padding: 0 12rem;
	max-width: 800rem;
	margin: 36rem auto 12rem;
	font-weight: 400;
}

.avabord__subtitle::before,
.avabord__subtitle::after {
	flex-grow: 1;
	display: block;
	height: 1px;
	content: '';
	background-image: linear-gradient(to right, transparent, var(--c10one));
}

.avabord__subtitle::after {
	background-image: linear-gradient(to left, transparent, var(--c10one));
}

.avabord__grid,
.avabord__gridFly {
	display: grid;
	grid-template-columns: 1fr 1fr;
	width: 100%;
	padding: 12rem;
	gap: 12rem;
	list-style: none;
}

.avabord__grid button,
.avabord__flyButton {
	position: relative;
	display: block;
	width: 162rem;
	height: 162rem;
	border: 1px solid var(--c10two);
	background-color: transparent;
	padding: 0;
	cursor: pointer;
}

.avabord__grid--noborder button {
	border: none;
}

.avabord__grid button.active::after,
.avabord__flyButton.active::after {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: block;
	width: 67rem;
	height: 67rem;
	content: '';
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	background-image: url("data:image/svg+xml,%3Csvg width='67' height='67' viewBox='0 0 67 67' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='33.5' cy='33.5' r='30.5' stroke='black' stroke-width='6'/%3E%3Ccircle cx='33.5' cy='33.5' r='30.5' stroke='%23EB9929' stroke-width='4'/%3E%3Cpath d='M47 19L28.5122 37.4668L19.5488 28.516L14 34.057L28.5122 48.5488L52.5488 24.541L47 19Z' fill='white' stroke='black'/%3E%3C/svg%3E%0A");
}

.avabord__gridFly li {
	position: relative;
}

.avabord__gridFly .ct__nickname-edit {
	position: absolute;
	top: 0;
	left: 0;
}

.avabord__gridFly .avabord__flyButton + button {
	display: none;
}

.avabord__gridFly .avabord__flyButton.active + button {
	display: block;
}

.avabord__grid img,
.avabord__gridFly img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.avabord__inputPopup {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.3s ease;
}

.avabord__inputPopup.active {
	opacity: 1;
	pointer-events: all;
}

.avabord__inputPopupContent {
	background-color: var(--c30);
	padding: 24rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24rem;
	max-width: 700rem;
	margin: 0 auto;
}

.avabord__inputPopupContent h2 {
	font-size: 14rem;
	text-align: center;
	font-weight: 400;
}

.avabord__inputPopupContent input {
	flex-grow: 1;
	font-size: 16rem;
	line-height: 30rem;
	font-weight: 400;
	text-align: center;
	padding: 0 12rem;
	border: 1px solid var(--c10two);
	background-color: transparent;
}

.avabord__inputPopupContent input::placeholder {
	color: var(--c10one);
	opacity: 0.75;
}

.avabord__inputPopupFlex {
	display: flex;
	align-items: center;
	gap: 6rem;
	width: 100%;
}

@media (min-width: 1000px) {
	.avabord {
		padding-top: 30rem;
		padding-bottom: 30rem;
		height: calc(100vh - 100rem);
		margin-top: 100rem;
		margin-left: 330rem;
	}

	.avabord__grid,
	.avabord__gridFly {
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		width: max-content;
		margin: 0 auto;
		padding: 12rem;
		gap: 12rem;
		list-style: none;
	}

	.avabord__grid button,
	.avabord__flyButton {
		display: block;
		width: 200rem;
		height: 200rem;
	}

	.avabord__inputPopup {
		display: flex;
		justify-content: center;
		align-items: center;
		top: 100rem;
		height: calc(100vh - 100rem);
		width: calc(100vw - 330rem);
		left: 330rem;
	}

	.avabord__inputPopupContent {
		flex-shrink: 0;
		width: 500rem;
		padding: 40rem;
	}
}

/*! Dialogs */

.dialogs {
	padding-top: 14rem;
	padding-bottom: 24rem;
	height: calc(100% - 60rem);
	overflow-y: auto;
	overflow-x: hidden;
}

.dialogs__title {
	margin: 0;
	margin-bottom: 24rem;
}

.dialogs__grid {
	display: grid;
	width: 100%;
	padding: 12rem;
	gap: 12rem;
	list-style: none;
}

@media (min-width: 1000px) {
	.dialogs {
		padding-top: 30rem;
		padding-bottom: 30rem;
		height: calc(100vh - 100rem);
		margin-top: 100rem;
		margin-left: 330rem;
	}

	.dialogs__grid {
	}
}

/*! Dialog */

.dialog {
	padding-top: 14rem;
	padding-bottom: 24rem;
	height: calc(100% - 60rem);
	overflow-y: auto;
	overflow-x: hidden;
}

.dialog__title {
	margin: 0;
	margin-bottom: 24rem;
}

.dialog__container {
	height: calc(100% - 45rem);
}

@media (min-width: 1000px) {
	.dialog {
		padding-top: 30rem;
		padding-bottom: 10rem;
		height: calc(100% - 100rem);
		margin-top: 100rem;
		margin-left: 330rem;
	}

	.dialog__container {
		height: calc(100% - 45rem);
		padding: 0 24rem;
		padding-right: 0;
	}
}

/*! Store */

.store {
	position: relative;
	padding-top: 14rem;
	padding-bottom: 24rem;
	height: calc(100% - 60rem);
	overflow-x: hidden;
}

.store__title-settings {
	top: 11rem !important;
}

.store__tabs {
	margin-bottom: 24rem;
}

.store__wrapper-overflow {
	width: 100vw;
	overflow-x: hidden;
	overflow-y: auto;
}

.store__wrapper {
	display: flex;
	transition: all 0.5s ease;
}

.store__left {
	width: 100vw;
	flex-shrink: 0;
}

.store__exch-wrapper {
	position: relative;
	display: grid;
	padding: 0 12rem;
	grid-template-columns: 1fr 41rem 1fr;
	width: 312rem;
	height: 100rem;
	margin: 0 auto;
	margin-bottom: 30rem;
}

.store__exch-wrapper button {
	z-index: 2;
	position: relative;
	grid-column: 2 / 3;
	grid-row: 1 / 3;
	width: 41rem;
	height: 60rem;
	margin-top: -3rem;
	border: none;
	padding: 0;
	background-color: transparent;
}

.store__exch-wrapper svg {
	width: 100%;
	height: 100%;
}

.store__exch-left-text {
	z-index: 2;
	position: relative;
	margin-top: 12rem;
	font-size: 18rem;
	line-height: 1;
}

.store__exch-right-text {
	z-index: 2;
	position: relative;
	margin-top: 12rem;
	font-size: 18rem;
	line-height: 1;
	text-align: right;
}

.store__exch-wrapper svg {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}

.store__num-left,
.store__num-right {
	z-index: 2;
	position: relative;
	display: block;
	width: 116rem;
	height: 24rem;
	padding: 0 5rem;
	font-size: 14rem;
	line-height: 24rem;
	outline: none;
	color: var(--c10one);
	text-align: center;
	background-color: transparent;
	border: 1px solid rgba(255, 255, 255, 0.3);
}

.store__num-right {
	margin-left: auto;
}

.store__num-left:focus,
.store__num-right:focus {
	border: 1px solid var(--c10one);
}

.store__exch-wrapper p {
	grid-column: 1 / 4;
	z-index: 2;
	position: relative;
	margin: 0;
	font-size: 14rem;
	line-height: 14rem;
	text-align: center;
	letter-spacing: -0.04em;
	color: var(--c10one);
}

.store__exch-wrapper p span {
	color: var(--c10two);
}

.store__list {
	padding: 0 24rem;
	list-style: none;
	display: grid;
	align-items: center;
	row-gap: 12rem;
	font-size: 14rem;
	color: var(--c10one);
	padding-bottom: 24rem;
}

.store__item {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

.store__item p {
	margin: 0;
	font-weight: 300;
}

.store__bar {
	position: relative;
	display: flex;
	justify-content: flex-start;
	margin-top: 6rem;
	width: 100%;
	height: 10rem;
	border: 1px solid var(--c10two);
}

.store__bar-fill {
	z-index: 1;
	height: 100%;
	background-color: var(--c10two);
}

.store__bar-reserved {
	height: calc(100% + 2px);
	margin-top: -1px;
	border: 1px solid var(--c10one);
	background-image: repeating-linear-gradient(
		-45deg,
		var(--c10one),
		var(--c10one) 5px,
		transparent 5px,
		transparent 10px
	);
}

.store__item span {
	z-index: 2;
	position: relative;
	display: inline-block;
	width: max-content;
	flex-shrink: 0;
	font-size: 14rem;
	line-height: 16rem;
	text-align: center;
	letter-spacing: -0.04em;
	color: var(--c10two);
	text-shadow: -1px -1px 0px var(--c60);
}

.store__item .store__item-span-r {
	color: var(--c10one);
}

.store__right {
	width: 100vw;
	flex-shrink: 0;
}

.store__right-title {
	margin-top: 10rem;
	font-size: 18rem;
	line-height: 18rem;
	font-weight: 400;
	text-align: center;
	letter-spacing: -0.04em;
	color: var(--c10one);
	width: 100%;
}

.store__right-block {
	position: relative;
	width: 312rem;
	height: 100rem;
	margin: 0 auto;
	padding: 12rem;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.store__right-block span {
	z-index: 2;
	position: relative;
	color: var(--c10one);
	font-size: 14rem;
	line-height: 14rem;
	letter-spacing: -0.04em;
	color: var(--c10one);
}

.store__right-block label {
	margin-right: auto;
	margin-left: 6rem;
	font-size: 14rem;
	line-height: 14rem;
	letter-spacing: -0.04em;
	color: var(--c10one);
}

.store__right-block input[type='number'] {
	background-color: transparent;
	border: 1px solid var(--c10one);
	font-size: inherit;
	line-height: inherit;
	color: inherit;
	width: 60rem;
}

.store__right-block span i {
	color: var(--c10two);
	font-style: normal;
}

.store__right-block input {
	z-index: 2;
	position: relative;
	width: 100%;
	height: 16rem;
	cursor: pointer;
	display: block;
	-webkit-appearance: none; /* Hides the slider so that custom slider can be made */
	width: 100%; /* Specific width is required for Firefox. */
	background: transparent; /* Otherwise white in Chrome */
}

.store__right-block input::-webkit-slider-thumb {
	-webkit-appearance: none;
	height: 16rem;
	width: 16rem;
	margin-top: -7rem;
	border-radius: 50%;
	background-color: var(--c10two);
}

.store__right-block input::-moz-range-thumb {
	-webkit-appearance: none;
	margin-top: -7rem;
	height: 16rem;
	width: 16rem;
	border-radius: 50%;
	background-color: var(--c10two);
}

.store__right-block input::-webkit-slider-runnable-track {
	width: 100%;
	height: 2rem;
	cursor: pointer;
	background: var(--c10two);
}

.store__right-block input::-moz-range-track {
	width: 100%;
	height: 2rem;
	cursor: pointer;
	background: var(--c10two);
}

.store__create-btn {
	z-index: 2;
	position: relative;
	align-self: center;
	margin: 0 auto;
	margin-top: 8rem;
}

.store__right-block svg {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}

.store__wp-wrapper {
	margin-top: 40rem;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	font-size: 18rem;
	position: relative;
}

.store__wp-wrapper-r {
	display: flex;
	align-items: center;
	flex-direction: column;
	padding: 0 24rem;
	justify-content: space-evenly;
	margin-top: -4rem;
}

.store__wp-wrapper picture {
	display: block;
	width: 80rem;
	height: 80rem;
}

.store__wp-wrapper picture img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
}

.store__wp-wrapper h2 {
	font-size: 24rem;
	line-height: 1;
	color: transparent;
	font-weight: 400;
	text-align: center;
	width: 100%;
	margin: 0;
	margin-bottom: 12rem;
	color: var(--c10two);
}

.store__nostore {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.store__nostore h3 {
	margin: 0;
	margin-bottom: 8rem;
	font-size: 14rem;
	line-height: 14rem;
	font-weight: 400;
	text-align: center;
	letter-spacing: -0.04em;
	color: var(--c10one);
}

.store__notitle {
	margin: 0;
	margin-bottom: 20rem;
	width: 100%;
	padding: 0 24rem;
	font-weight: 400;
	font-size: 18rem;
	line-height: 18rem;
	text-align: center;
	letter-spacing: -0.04em;
	color: var(--c10one);
}

.store__noblock {
	position: relative;
	width: 312rem;
	height: 98rem;
	margin-bottom: 20rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.store__noblock p {
	z-index: 2;
	position: relative;
	margin: 0;
	font-size: 14rem;
	line-height: 24rem;
	letter-spacing: -0.04em;
	color: var(--c10one);
}

.store__noblock svg {
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	width: 100%;
	height: 100%;
}

.store__noselect {
	position: relative;
	width: 312rem;
	height: 24rem;
	margin-bottom: 24rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	cursor: pointer;
}

.store__noselect i {
	position: absolute;
	right: 9rem;
	top: 8rem;
	display: block;
	width: 12rem;
	height: 8rem;
	pointer-events: none;
}

.store__noselect i svg {
	display: block;
	width: 100%;
	height: 100%;
}

.store__noselect::after {
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	width: 100%;
	height: 100%;
	opacity: 0.3;
	border: 1rem solid var(--c10one);
	content: '';
	pointer-events: none;
}

.store__noselect select {
	border: none;
	background-color: var(--c60);
	-webkit-appearance: none;
	appearance: none;
	width: 312rem;
	height: 24rem;
	padding: 0 9rem;
	font-size: 13rem;
	line-height: 24rem;
	letter-spacing: -0.05em;
	color: var(--c10one);
	outline: none;
}

.store__modal1,
.store__modal2 {
	z-index: 2;
	position: fixed;
	top: 0;
	left: 0;
	transform: translateX(101%);
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	height: calc(100% - 60rem);
	overflow-x: hidden;
	overflow-y: auto;
	background-color: var(--c30);
	padding: 24rem;
	transition: all 0.3s ease;
	font-size: 14rem;
	text-align: center;
	scrollbar-color: var(--c10two) var(--c30);
	scrollbar-width: auto;
	overflow-y: auto;
}

.store__modal1::-webkit-scrollbar,
.store__modal2::-webkit-scrollbar {
	width: 4rem;
	background-color: var(--c30);
}

.store__modal1::-webkit-scrollbar-thumb,
.store__modal2::-webkit-scrollbar-thumb {
	background-color: var(--c10two);
}

.store__modal2 {
	background-color: var(--c60);
}

.store__modal1-title {
	font-size: 18rem;
	text-align: center;
	font-weight: 400;
}

.store__modal1.active,
.store__modal2.active {
	transform: translateX(0);
}

.store__modal1-close {
	position: absolute;
	top: 0;
	right: 0;
}

.store__modal1-btn {
	flex-shrink: 0;
	align-self: center;
	margin: 0 auto;
}

.store__modal1-container:not(:first-of-type) h2 {
	margin-top: 0;
}

.store__modal1-line {
	margin-top: 30rem;
	margin-bottom: 24rem;
}

.store__modal2-close {
	z-index: 2;
	position: absolute;
	top: 20rem;
	right: 10rem;
}

.store__modal2-title {
	width: 100vw;
	margin-bottom: 12rem !important;
}

.store__modal2 > p {
	margin-top: 0;
	margin-bottom: 12rem;
}

.store__modal2-list-container > h3 {
	text-align: center;
	font-weight: 400;
	font-size: 14rem;
	line-height: 1;
	margin: 12rem 0;
}

.store__modal2-list {
	display: flex;
	flex-wrap: wrap;
	padding-left: 0;
	list-style: none;
	margin-top: 12rem;
	margin-bottom: 0;
}

.store__modal2-item {
	width: 50%;
	display: flex;
	margin-bottom: 12rem;
}

.store__modal2-item-btns {
	display: flex;
	width: max-content;
	flex-shrink: 0;
}

.store__modal2-item-btns button {
	display: block;
	width: 14rem;
	height: 14rem;
	padding: 0;
	border: 0;
	background-color: transparent;
}

.store__modal2-item-btns button svg {
	display: block;
	width: 100%;
	height: 100%;
}

.store__modal2-item-btns span {
	display: block;
	width: 20rem;
	font-size: 14rem;
	line-height: 1;
}

.store__modal2-item-text {
	flex-shrink: 0;
}

.store__modal2-item:nth-of-type(odd) {
	justify-content: flex-start;
}

.store__modal2-item:nth-of-type(even) {
	justify-content: flex-end;
}

.store__modal2-item:nth-of-type(odd) .store__modal2-item-btns {
	margin-right: 14rem;
}

.store__modal2-item:nth-of-type(even) .store__modal2-item-btns {
	order: 2;
	margin-left: 14rem;
}

.store__modal2-item:nth-of-type(even) .store__modal2-item-text {
	order: 1;
}

.store__modal2-line--bottom-m {
	margin-bottom: 12rem;
}

@media (min-width: 1000px) {
	.store {
		width: calc(100vw - 330rem);
		height: calc(100vh - 100rem);
		margin-left: 330rem;
		margin-top: 100rem;
	}
	.store__wrapper-overflow {
		width: 100%;
	}
	.store__left,
	.store__right {
		width: 50%;
		flex-shrink: 0;
	}
	.store__tabs.ct__top-tabs {
		display: none;
	}
	.store__list {
		scrollbar-color: var(--c10two) var(--c30);
		scrollbar-width: auto;
		overflow-y: auto;
	}
	.store__list::-webkit-scrollbar {
		width: 8rem;
		background-color: var(--c30);
	}
	.store__list::-webkit-scrollbar-thumb {
		background-color: var(--c10two);
	}
	.store__modal1,
	.store__modal2 {
		top: 100rem;
		left: initial;
		right: 0;
		justify-content: center;
		transform: translateX(0);
		width: calc(50% - 165rem);
		height: calc(100% - 100rem);
		opacity: 0;
		background-color: var(--c30);
		pointer-events: none;
	}
	.store__modal1.active,
	.store__modal2.active {
		opacity: 1;
		transform: translateX(0);
		pointer-events: all;
	}
	.store__modal2-title {
		width: 100%;
		margin-bottom: 24rem !important;
	}
}

/*! Ct__line */

.ct__line {
	flex-shrink: 0;
	display: block;
	width: 100%;
	height: 1px;
	background-image: linear-gradient(
		to right,
		transparent,
		var(--c10one),
		transparent
	);
	content: '';
}

/*! Factory */

.factory {
	position: relative;
	padding-top: 14rem;
	padding-bottom: 48rem;
	height: calc(100% - 60rem);
	overflow-x: hidden;
	font-size: 14rem;
}

.factory__topBlock {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 12rem;
	margin: 0 auto;
	width: 336rem;
	padding: 18rem;
	background-color: var(--c30);
	margin-bottom: 24rem;
}

.factory__topBlock::before,
.factory__topBlock::after {
	position: absolute;
	top: -2rem;
	left: -2rem;
	display: block;
	width: 14rem;
	height: 14rem;
	content: '';
	background-color: var(--c60);
	clip-path: polygon(0% 0%, 100% 0%, 0% 100%);
}

.factory__topBlock::after {
	top: initial;
	left: initial;
	right: -2rem;
	bottom: -2rem;
	transform: scale(-1);
}

.factory__top-row {
	display: flex;
	align-items: center;
}

.factory__topInput {
	display: block;
	width: 100%;
	height: 24rem;
	padding: 0 12rem;
	color: var(--c10one);
	line-height: 24rem;
	background-color: transparent;
	border: 0;
}

.factory__topInput::placeholder {
	color: var(--c10one);
}

.factory__topLabelInput {
	position: relative;
}

.factory__topLabelInput::before {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	content: '';
	border: 1px solid var(--c10one);
	opacity: 0.3;
}

.factory__topCreate {
	margin: 0 auto;
}

.factory__block {
	display: grid;
	gap: 36rem;
	padding: 0 12rem;
	margin: 0;
	list-style: none;
}

.factory__blockElement {
	display: flex;
	flex-direction: column;
	gap: 12rem;
}

.factory__blockElement > h2 {
	margin: 0;
	font-size: 18rem;
	line-height: 1;
	letter-spacing: -0.04em;
	font-weight: 400;
}

.factory__blockRow {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.factory__blockRow input {
	width: 60rem;
	height: 18rem;
	background-color: transparent;
	padding: 0 6rem;
	font-size: 14rem;
	border: 0;
	margin-right: 6rem;
}

.factory__inputBlock {
	display: flex;
	align-items: center;
}

.factory__inputBlockLabel {
	position: relative;
}

.factory__inputBlockLabel::after {
	pointer-events: none;
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	content: '';
	border: 1px solid var(--c10one);
	opacity: 0.3;
}

.factory__range {
	-webkit-appearance: none;
	appearance: none;
	height: 2rem;
}

.factory__range::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;
	border-radius: 50%;
	width: 20rem;
	height: 20rem;
	background: var(--c10two);
	cursor: pointer;
}

@media (min-width: 1000px) {
	.factory {
		margin-top: 100rem;
		margin-left: 330rem;
		width: calc(100vw - 330rem);
		height: calc(100vh - 100rem);
	}
}

/*! Trading */

.trading {
	position: fixed;
	top: 0;
	left: 0;
	padding-top: 12rem;
	width: 100%;
	height: calc(100% - 60rem);
	overflow-x: hidden;
	overflow-y: auto;
	display: flex;
	flex-direction: column;
}

.trading__flex-wrapper {
	display: flex;
	flex-direction: column;
}

.trading__tabs {
	position: relative;
	margin-bottom: 24rem;
}

.trading__tabs::after {
	position: absolute;
	left: 24rem;
	bottom: -13rem;
	display: block;
	width: 312rem;
	height: 1px;
	background-image: linear-gradient(
		to right,
		transparent,
		var(--c10one),
		transparent
	);
	content: '';
}

.trading__search-open {
	flex-shrink: 0;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 312rem;
	height: 30rem;
	padding: 0;
	margin: 0 auto;
	margin-bottom: 12rem;
	border: 0;
	background-color: transparent;
}

.trading__search-open.margin-bottom {
	margin-bottom: 24rem;
}

.trading__search-open svg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.trading__search-open span {
	position: relative;
	font-weight: 400;
	font-size: 18rem;
	line-height: 14rem;
	text-align: center;
	letter-spacing: -0.04em;
	color: var(--c10one);
}

.trading__wrapper-overflow {
	width: 100vw;
	overflow-x: hidden;
	overflow-y: auto;
	flex-grow: 1;
	display: flex;
	flex-direction: column;
}

.trading__no-filters {
	margin: 0;
	padding: 0 24rem;
	font-size: 16rem;
	line-height: 1.5;
	text-align: center;
	flex-grow: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.trading__actveFilters {
	display: none;
	width: 320rem;
	margin: 0 auto;
	background-image: linear-gradient(to right bottom, var(--c30), transparent);
	padding: 20rem;
	font-size: 16rem;
}

.trading__actveFilters h3 {
	margin-top: 0;
	font-weight: 400;
	font-size: 16rem;
}

.search-modal__selectWithImage {
	margin-bottom: 24rem;
}

@media (min-width: 1000px) {
	.trading {
		left: 330rem;
		top: 100rem;
		width: calc(100% - 330rem);
		height: calc(100% - 100rem);
	}
	.trading__flex-wrapper {
		display: flex;
		flex-direction: row;
	}
	.trading__tabs {
		width: 360rem;
		margin-left: auto;
		margin-right: auto;
	}
	.trading__wrapper-overflow {
		width: 100%;
	}
	.trading__left-col {
		order: 2;
	}
	.trading__actveFilters.active {
		display: block;
	}
}

/*! Actives */

.actives {
	padding-top: 14rem;
	padding-bottom: 24rem;
	height: calc(100% - 60rem);
	overflow-x: hidden;
}

.actives__title {
	margin: 0;
	margin-bottom: 24rem;
}

.actives__titleSettingsButton {
	position: absolute;
	top: 50%;
	transform: translateY(-47%);
	right: 12rem;
	border: 0;
	background-color: transparent;
	padding: 0;
	cursor: pointer;
}

.actives__titleSettingsButton svg {
	display: block;
	width: 30rem;
	height: 30rem;
}

.actives__top-wrapper {
	margin: 0 auto;
	margin-bottom: 12rem;
}

.actives__confirm-btn {
	margin: 0 auto;
}

.actives__region-wrapper {
	margin: 0 auto;
	width: 312rem;
	height: 30rem;
	margin-bottom: 12rem;
	display: flex;
	justify-content: center;
	align-items: center;
}

.actives__regionDeleteBlock .actives__regionDeleteCheckbox {
	margin-bottom: 0;
}

.actives__regionDeleteBlock .actives__regionDeleteCheckbox label {
	width: 108rem;
	justify-content: flex-start;
}

.actives__region-wrapper > button {
	display: block;
	width: 20rem;
	height: 20rem;
	margin-left: auto;
	padding: 0;
	border: 0;
	background-color: transparent;
	cursor: pointer;
}

.actives__region-wrapper > button svg {
	display: block;
	width: 100%;
	height: 100%;
}

.actives__regionDeleteBlock {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	gap: 12rem;
	padding: 12rem;
	padding-top: 0;
}

.actives__table {
	padding-left: 24rem;
	padding-bottom: 24rem;
}

.actives__regionDeleteBack {
	border: 0;
	display: block;
	width: 30rem;
	height: 30rem;
	background-color: transparent;
	padding: 0;
	cursor: pointer;
}

.actives__regionDeleteBack svg {
	display: block;
	width: 100%;
	height: 100%;
}

.activesSettModal {
	z-index: 2;
	position: fixed;
	top: 0;
	left: 0;
	inset: 0;
	font-size: 14rem;
	display: flex;
	flex-direction: column;
	padding: 48rem 12rem;
	background-color: var(--c60);
	transform: translateX(100%);
	pointer-events: none;
	transition: all 0.3s ease;
}

.activesSettModal.active {
	transform: translateX(0);
	pointer-events: all;
}

.activesSettModal__close {
	position: absolute;
	top: 12rem;
	right: 12rem;
}

.activesSettModal__searchRow {
	display: flex;
	gap: 12rem;
	align-items: center;
	margin-bottom: 12rem;
}

.activesSettModal__searchInputForm {
	position: relative;
	flex-grow: 1;
}

.activesSettModal__searchInputForm > button {
	position: absolute;
	top: 0;
	right: 0;
	display: block;
	width: 30rem;
	height: 30rem;
	padding: 6rem;
	background-color: transparent;
	border: 0;
}

.activesSettModal__searchInputForm > button svg {
	display: block;
	width: 18rem;
	height: 18rem;
}

.activesSettModal__searchInputForm > input {
	display: block;
	width: 100%;
	height: 30rem;
	background-color: transparent;
	border: 1px solid var(--c10one);
	color: var(--c10one);
	padding-right: 30rem;
	padding-left: 12rem;
}

.activesSettModal__searchRow > button {
	background-color: var(--c10two);
	color: var(--c60);
	padding: 7rem;
	border: 0;
}

.activesSettModal__select {
	margin-bottom: 24rem;
}

.activesSettModal__listWrapper {
	max-height: 300rem;
	overflow: auto;
}

.activesSettModal__listWrapper > p {
	margin: 0;
	text-align: center;
	background-color: var(--c30);
	padding: 24rem 12rem;
}

.activesSettModal__listWrapper > p span {
	font-family: Arial;
}

.activesSettModal__list {
	padding-left: 0;
	margin: 0;
	list-style: none;
	display: grid;
	gap: 2rem;
}

.activesSettModal__item {
	display: flex;
	gap: 4px;
	align-items: center;
	padding: 4rem;
}

.activesSettModal__item.active {
	background-color: var(--c30);
}

.activesSettModal__item img {
	display: block;
	width: 24rem;
	height: 24rem;
	object-fit: contain;
	object-position: center;
}

@media (min-width: 1000px) {
	.actives {
		height: calc(100% - 100rem);
		margin-left: 330rem;
		margin-top: 100rem;
	}
	.activesSettModal {
		height: calc(100% - 100rem);
		width: calc(100% - 330rem);
		left: 330rem;
		top: 100rem;
	}
	.activesSettModal__content {
		margin: 0 auto;
		width: 450rem;
	}
}

/*! create */

.create {
	padding-top: 14rem;
	height: 100vh;
	display: flex;
	flex-direction: column;
}

.create__form {
	width: 312rem;
	margin: auto;
	display: flex;
	flex-direction: column;
	height: max-content;
}

.create__form h2 {
	margin: 0;
	margin-bottom: 6rem;
	font-weight: 400;
	font-size: 18rem;
	line-height: 24rem;
	color: var(--c10one);
	text-align: center;
}

.create__form > input[type='text'] {
	width: 100%;
	height: 30rem;
	color: var(--c10two);
	font-size: 16rem;
	border: 1px solid var(--c10two);
	margin-bottom: 24rem;
	padding: 0 5rem;
	background-color: transparent;
}

.create__form > input[type='file'] {
	width: 100%;
	height: 30rem;
	display: flex;
	justify-content: center;
	text-align: center;
	color: var(--c10two);
	font-size: 16rem;
	line-height: 30rem;
	text-align: center;
	border: 1px solid var(--c10two);
	margin-bottom: 24rem;
	padding: 0;
	padding-left: 5rem;
	background-color: transparent;
}

.create__form > input[type='file']::-webkit-file-upload-button {
	display: none;
}

.create__label {
	position: relative;
	display: flex;
	width: 312rem;
	height: 30rem;
	margin-bottom: 24rem;
	align-items: center;
}

.create__label::after {
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	width: 100%;
	height: 100%;
	content: '';
	border: 1px solid var(--c10two);
	pointer-events: none;
}

.create__label select {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	font-size: 16rem;
	line-height: 16rem;
	letter-spacing: -0.05em;
	padding: 0 5rem;
	border: 0;
	background-color: var(--c60);
	color: var(--c10two);
	outline: none;
	appearance: none;
}

.create__label select:focus {
	box-shadow: 0 0 1rem 0 var(--c10one);
}

.create__label svg {
	position: absolute;
	right: 5rem;
	top: 10rem;
	width: 19rem;
	height: 10rem;
	pointer-events: none;
}

.create__form-start {
	align-self: center;
	display: block;
	width: 100rem;
	height: 100rem;
	margin-top: 36rem;
	border-radius: 50%;
	padding: 0;
	border: 0;
	background-color: transparent;
	animation: start-shadow 1.5s ease-in-out infinite alternate both;
}

@keyframes start-shadow {
	0% {
		box-shadow: 0 0 0 0 var(--c10two);
	}
	100% {
		box-shadow: 0 0 15rem 0 var(--c10two);
	}
}

.create__form-start svg {
	width: 100%;
	height: 100%;
}

/*! articles */

.articles {
	display: flex;
	flex-direction: column;
	padding-top: 14rem;
	padding-bottom: 24rem;
	height: calc(100% - 60rem);
	overflow-x: hidden;
	font-size: 14rem;
}
.articleShowBlock {
	display: none;
	flex-grow: 1;
	height: 100%;
}
.articleShowBlock.active {
	display: block;
}
.articles__title {
	position: relative;
	margin: 0;
	margin-bottom: 24rem;
}
.articles__addNewBtn {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: 24rem;
	width: 30rem;
	height: 30rem;
	display: block;
	border: 0;
	background-color: transparent;
	padding: 0;
}
.articles__addNewBtn svg {
	display: block;
	width: 100%;
	height: 100%;
}
.articles__inner {
	padding: 0 12rem;
}
.articles__tabs {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 12rem;
	width: 100%;
}
.articles__tabs button {
	display: block;
	padding: 0;
	border: 0;
	height: 24rem;
	line-height: 24rem;
	text-align: center;
	background-color: var(--c30);
	color: var(--c10one);
}
.articles__tabs button.active {
	background-color: var(--c10two);
	color: var(--c60);
}
.articles__search {
	width: calc(100% - 24rem);
	display: grid;
	grid-template-columns: 30rem 1fr;
	gap: 5rem;
	margin: 0 12rem;
	margin-bottom: 12rem;
	height: 30rem;
	border: 1px solid var(--c10two);
}
.articles__search button {
	display: flex;
	align-items: center;
	justify-content: center;
	height: calc(30rem - 2px);
	width: 30rem;
	background-color: transparent;
	border: 0;
	padding: 0;
}
.articles__search button svg {
	display: block;
	width: 20rem;
	height: 20rem;
}
.articles__search input {
	display: block;
	line-height: calc(30rem - 2px);
	color: var(--c10one);
	border: 0;
	background-color: transparent;
}
.articles__list {
	display: none;
	flex-direction: column;
	gap: 12rem;
	margin: 0;
	padding: 0;
	list-style: none;
}
.articles__list.active {
	display: flex;
	animation: fade-translate 0.25s ease both;
}
.articles__item {
	display: flex;
	height: 60rem;
	background-color: var(--c30);
}
.articles__item > img,
.articles__item > svg {
	display: block;
	width: 60rem;
	height: 60rem;
}
.articles__itemContent {
	display: flex;
	justify-content: space-between;
	gap: 4rem;
	width: 100%;
	padding: 4rem;
}
.articles__itemText {
	display: flex;
	flex-direction: column;
	gap: 4rem;
	justify-content: space-between;
}
.articles__itemText h2 {
	margin: 0;
	font-weight: 400;
	font-size: 14rem;
	width: 198rem;
	-ms-text-overflow: ellipsis;
	-o-text-overflow: ellipsis;
	text-overflow: ellipsis;
	overflow: hidden;
	-ms-line-clamp: 2;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	display: -webkit-box;
	display: box;
	word-wrap: break-word;
	-webkit-box-orient: vertical;
	box-orient: vertical;
}
.articles__itemText a {
	color: var(--c10two);
	width: 198rem;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.articles__itemInfo {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: flex-end;
}
.articles__itemInfo span:nth-of-type(1) {
	display: flex;
	align-items: center;
	gap: 4rem;
}
.articles__itemInfo span:nth-of-type(1) svg {
	display: inline-block;
	width: 16rem;
	height: 16rem;
}
.articles__itemInfo span:nth-of-type(2) {
	color: var(--c10two);
}
.articles__select {
	margin-top: 12rem;
}
.articles__labelSelect {
	margin-top: 12rem;
}
.articles__titleInput {
	position: relative;
	display: block;
	height: 24rem;
	width: 100%;
	margin-bottom: 12rem;
}
.articles__titleInput::before,
.articles__textarea::before {
	position: absolute;
	pointer-events: none;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	content: '';
	border: solid 1px var(--c10one);
	opacity: 0.5;
}
.articles__titleInput input {
	display: block;
	line-height: 24rem;
	background-color: transparent;
	color: var(--c10one);
	width: 100%;
	padding: 0 12rem;
	border: 0;
}
.articles__textarea {
	position: relative;
	width: 100%;
	margin-bottom: 12rem;
}
.articles__textarea textarea {
	padding: 12rem;
	background-color: transparent;
	display: block;
	width: 100%;
	line-height: 1.5;
	color: var(--c10one);
	margin-bottom: 12rem;
	resize: none;
	border: 0;
}
.articles__textContent a {
	color: var(--c10two);
}
.articles__voteBtns {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 40rem;
	font-size: 30rem;
}
.articles__voteBtns button {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 40rem;
	height: 40rem;
	border: 0;
	padding: 0;
	background-color: transparent;
}
.articles__voteBtns span {
	font-size: 24rem;
	color: var(--c10two);
}
.articles__messages {
	padding: 0 12rem;
}
.articles__noMessages {
	text-align: center;
	font-size: 16rem;
	margin-top: 0;
	margin-bottom: auto;
	letter-spacing: -1px;
}
.articles__authorAndTime {
	font-size: 14rem;
	display: flex;
	align-items: center;
	gap: 5rem;
	justify-content: space-between;
}
.articles__authorAndTime a {
	color: var(--c10two);
	flex-basis: 33.3%;
}
.articles__authorAndTime span {
	text-align: center;
	flex-basis: 33.3%;
}
.articles__authorAndTime button {
	flex-basis: 33.3%;
	height: 20rem;
	padding: 0 5rem;
	color: var(--c60);
	background-color: var(--c10two);
	line-height: 20rem;
	border: 0;
}
.panel-default > .panel-heading {
	color: #fff !important;
	background-color: #000 !important;
	border-color: #fff !important;
}
.articles .overview__chat-controls {
	bottom: 100rem;
}
.articles .ct__top-tabs {
	padding: 0 18rem;
}
.articles .overview__stickers.active {
	bottom: 140rem;
}
.articleShowBlock__chat {
	overflow: hidden;
}
.articleShowBlock__chat .ct__top-tabs {
	position: fixed;
	left: 0;
	width: 100%;
	bottom: 46rem;
	background-color: var(--c60);
	padding-bottom: 24rem;
}
.articles .articles__messages {
	padding-left: 0;
	padding-right: 0;
	height: 100%;
}
.articles .overview__chat-messages {
	height: calc(100% - 20rem);
	padding-bottom: 80rem;
	overflow-y: auto;
}

@media (min-width: 1000px) {
	.articles {
		height: calc(100% - 100rem);
		margin-left: 330rem;
		margin-top: 100rem;
	}
	.articles__inner {
		width: 900rem;
		margin: 0 auto;
	}
	.articles__itemText h2 {
		width: auto;
	}
	.articles__messages {
		width: 900rem;
		margin: 0 auto;
	}
	.articles__messages .overview__chat-message-body p {
		width: 100%;
	}
	.articles__search {
		width: 100%;
		margin-left: 0;
		margin-right: 0;
	}
	.articles .overview__chat-controls {
		bottom: 40rem;
		position: fixed;
		width: calc(100% - 370rem);
		left: 350rem;
	}
	.articles .ct__top-tabs {
		width: 360rem;
		margin: 0 auto;
	}
	.articleShowBlock__chat .ct__top-tabs {
		position: fixed;
		left: calc(50% + 165rem);
		transform: translateX(-50%);
		width: 100%;
		justify-content: center;
		gap: 12rem;
		bottom: 0;
		background-color: var(--c60);
		padding-bottom: 24rem;
	}
	.articles .overview__stickers.active {
		bottom: 74rem;
	}
	.articles .overview__chat-messages {
		height: calc(100% - 20rem);
	}
}

/*! DecorLine */

.DecorLine {
	height: 1px;
	margin: 12rem;
	background-image: linear-gradient(
		to right,
		transparent,
		var(--c10one),
		transparent
	);
}

/*! overview */

.overview {
	position: fixed;
	padding-top: 12rem;
	height: calc(100% - 60rem);
	overflow-x: hidden;
}

.overview__tabs {
	position: relative;
	margin-bottom: 12rem;
}

.overview__tabs-wiki {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: block;
	width: 30rem;
	height: 30rem;
}

.overview__tabs-wiki svg {
	display: block;
	width: 100%;
	height: 100%;
}

.overview__wrapper {
	display: flex;
	height: calc(100% - 80rem);
}

.overview__view {
	display: none;
}

.overview__view.active {
	display: block;
	animation: fade-translate 0.25s ease both;
}

@keyframes fade-translate {
	0% {
		opacity: 0;
		transform: translateX(100rem);
	}
	100% {
		opacity: 1;
		transform: translateX(0);
	}
}

.overview__view-info {
	margin: 0 auto;
	margin-bottom: 12rem;
}

.overview__event {
	position: relative;
	display: block;
	width: 336rem;
	height: 46rem;
	margin: 0 auto;
	padding-top: 2rem;
	padding-left: 6rem;
	padding-right: 6rem;
	background-image: linear-gradient(
		to right,
		transparent,
		var(--c30),
		transparent
	);
}

.overview__war {
	position: relative;
	display: block;
	width: 336rem;
	height: 46rem;
	margin: 0 auto;
	padding-top: 2rem;
	padding-left: 46rem;
	padding-right: 6rem;
	background-image: linear-gradient(
		to right,
		transparent,
		var(--c30),
		transparent
	);
}

.overview__war-string {
	position: relative;
	display: flex;
	justify-content: space-between;
	padding: 3rem 0;
}

.overview__war-string:first-of-type::after {
	position: absolute;
	left: 0;
	bottom: 0;
	display: block;
	width: 100%;
	height: 1px;
	background-image: linear-gradient(
		to right,
		transparent,
		var(--c10one),
		transparent
	);
	content: '';
}

.overview__war-text {
	margin: 0;
	display: flex;
	align-items: center;
	font-style: normal;
	font-weight: 400;
	font-size: 14rem;
	line-height: 14rem;
	letter-spacing: -0.04em;
	color: var(--c10one);
}

.overview__war-string span {
	font-style: normal;
	font-weight: 400;
	font-size: 14rem;
	line-height: 14rem;
	letter-spacing: -0.04em;
	color: var(--c10one);
}

.overview__war-text img {
	display: block;
	width: auto;
	height: 14rem;
	margin-right: 4rem;
}

.overview__war-icon {
	display: block;
	position: absolute;
	top: 6rem;
	left: 6rem;
	width: 34rem;
	height: 34rem;
	object-fit: contain;
	object-position: center;
}

.overview__line {
	margin: 12rem auto;
	width: 315rem;
	height: 1px;
	background-image: linear-gradient(
		to right,
		transparent,
		var(--c10one),
		transparent
	);
}

.overview__love {
	display: flex;
	padding: 0 12rem;
}

.overview__love-left {
	display: grid;
	row-gap: 12rem;
	margin-right: 12rem;
	height: 234rem;
}

.overview__love-right {
	position: relative;
}

.overview__love-stat {
	display: none;
}

.overview__love-stat.active {
	display: block;
	animation: fade 0.25s ease both;
}

.overview__love-stat-btn {
	display: block;
	width: 70rem;
	height: 70rem;
	padding: 0;
	border: 0;
	text-align: center;
	opacity: 0.5;
	background-color: var(--c30);
	transition: opacity 0.25s ease;
}

.overview__love-stat-btn.active {
	opacity: 1;
}

.overview__love-stat-btn h3 {
	margin: 0;
	margin-bottom: 2rem;
	font-weight: 400;
	font-size: 18rem;
	line-height: 18rem;
	letter-spacing: -0.04em;
	color: var(--c10one);
}

.overview__love-stat-btn span {
	font-weight: 400;
	font-size: 30rem;
	line-height: 24rem;
	letter-spacing: -0.04em;
	color: var(--c10one);
}

.overview__love-stat-btn-line {
	height: 4rem;
	margin-bottom: 8rem;
}

.overview__love-stat {
	position: relative;
	width: 254rem;
	height: 234rem;
	background: var(--c30);
}

.overview__love-stat::before,
.overview__love-stat::after {
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	width: 10rem;
	height: 10rem;
	clip-path: polygon(0 0, 100% 0, 0 100%);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	content: '';
	background-color: var(--c60);
}

.overview__love-stat-content {
	display: none;
	padding-bottom: 12rem;
}

.overview__love-stat-content.active {
	display: block;
	animation: fade 0.25s ease both;
}

.overview__love-stat-content > h2 {
	margin: 0;
	font-weight: 400;
	font-size: 18rem;
	line-height: 27rem;
	letter-spacing: -0.04em;
	color: var(--c10one);
	text-align: center;
}

.overview__love-stat-content > div {
	height: 4rem;
	margin-bottom: 6rem;
}

.overview__love-stat-content > p {
	margin: 0;
	font-weight: 400;
	font-size: 14rem;
	line-height: 20rem;
	text-align: center;
	letter-spacing: -0.04em;
	color: var(--c10one);
	text-align: center;
}

.overview__love-p-with-svg {
	display: flex;
	align-items: center;
	margin: 0;
	font-weight: 400;
	font-size: 14rem;
	line-height: 20rem;
	text-align: center;
	letter-spacing: -0.04em;
	color: var(--c10one);
	text-align: center;
}

.overview__love-p-with-svg > svg {
	flex-shrink: 0;
	display: block;
	width: 14rem;
	height: 14rem;
	margin-right: 4rem;
}

div.overview__love-stat-price-time {
	display: flex;
	padding: 0 24rem;
	justify-content: space-between;
	margin-bottom: 12rem;
	height: auto;
	padding-top: 16rem;
}

p.overview__love-stat-timer {
	font-size: 10rem;
	line-height: 15rem;
	letter-spacing: 0;
	margin-bottom: 1rem;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	width: max-content;
}

.overview__love-stat-content > span {
	display: block;
	margin-bottom: 6rem;
	font-weight: 400;
	font-size: 14rem;
	line-height: 20rem;
	text-align: center;
	letter-spacing: -0.04em;
	color: var(--c10one);
	text-align: center;
}

.overview__love-stat-learn {
	display: block;
	margin: 0 auto;
	height: 24rem;
	background-color: var(--c10two);
	text-align: center;
	font-weight: 400;
	font-size: 18rem;
	line-height: 24rem;
	letter-spacing: -0.04em;
	color: var(--c60);
	padding: 0 20rem;
	border: 0;
}

.overview__love-stat-three {
	position: relative;
	display: block;
	margin: 0 auto;
	margin-bottom: 12rem;
	padding: 0;
	width: 176rem;
	height: 31rem;
	border: none;
	background-color: transparent;
}

.overview__love-stat-three svg {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.overview__love-stat-three span {
	position: relative;
	font-weight: 400;
	font-size: 18rem;
	line-height: 31rem;
	text-align: center;
	letter-spacing: -0.04em;
	color: var(--c60);
}

.overview__love-stat::after {
	left: initial;
	top: initial;
	right: 0;
	bottom: 0;
	transform: scale(-1);
}

.overview__love-stat-close {
	z-index: 2;
	position: absolute;
	top: 3rem;
	right: 3rem;
	display: block;
	width: 20rem;
	height: 20rem;
	border: 0;
	padding: 0;
	background-color: transparent;
}

.overview__love-stat-close svg {
	width: 100%;
	height: 100%;
}

.overview__love-prem-timer {
	margin: 0;
	font-weight: 400;
	font-size: 10rem;
	line-height: 15rem;
	text-align: center;
	color: var(--c10one);
	text-align: center;
	margin-bottom: 4rem;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	width: max-content;
}

.overview__love-prem-list {
	padding: 0 12rem;
	list-style: none;
	display: flex;
	justify-content: space-between;
	padding-top: 19rem;
}

.overview__love-prem-item,
.overview__love-prem-item svg {
	display: block;
	width: 37rem;
	height: 37rem;
}

.overview__love-prem-item .pth {
	stroke: var(--c10one);
	fill: none;
	stroke-width: 1px;
	opacity: 0.5;
}

.overview__love-prem-item.str .pth {
	stroke: tomato;
	fill: tomato;
	opacity: 1;
}

.overview__love-prem-item.int .pth {
	stroke: #4791ff;
	fill: #4791ff;
	opacity: 1;
}

.overview__love-prem-item.sta .pth {
	stroke: #8dff47;
	fill: #8dff47;
	opacity: 1;
}

.overview__love-prem-item.skill .pth {
	stroke: #eb9929;
	fill: #eb9929;
	opacity: 1;
}

.overview__war-no {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: flex;
	align-items: center;
	margin: 0;
	font-weight: 400;
	font-size: 18rem;
	line-height: 31rem;
	text-align: center;
	letter-spacing: -0.04em;
	color: var(--c10one);
	opacity: 0.5;
	width: max-content;
}

.overview__war-no.event {
	opacity: 1;
}

.overview__war-no::before,
.overview__war-no::after {
	display: block;
	width: 50rem;
	height: 1px;
	content: '';
	background-image: linear-gradient(to left, var(--c10one), transparent);
}

.overview__war-no::after {
	transform: scaleX(-1);
}

.overview__love-part {
	display: none;
	width: 254rem;
}

.overview__love-part.active {
	display: block;
	animation: fade 0.25s ease both;
}

@keyframes fade {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

.overview__love-part-vote {
	position: relative;
	display: block;
	width: 100%;
	height: 24rem;
	margin-bottom: 12rem;
	font-weight: 400;
	font-size: 18rem;
	line-height: 24rem;
	text-align: center;
	letter-spacing: -0.04em;
	color: var(--c60);
	background-color: var(--c10two);
	border: 0;
	padding: 0;
}

.overview__love-part-vote-main {
	position: relative;
	display: block;
	width: 100%;
	height: 24rem;
	margin-bottom: 12rem;
	font-weight: 400;
	font-size: 18rem;
	line-height: 24rem;
	text-align: center;
	letter-spacing: -0.04em;
	color: var(--c10one);
	background-color: tomato;
	border: 0;
	padding: 0;
}

.overview__par {
	height: 24rem;
	overflow: hidden;
	transition: height 0.5s ease;
}

.overview__par:first-of-type {
	margin-bottom: 12rem;
}

.overview__par.active {
	height: calc(100vh - 442rem);
}

.overview__par-title-svg {
	position: absolute;
	top: 0;
	right: 0;
	width: 24rem;
	height: 24rem;
}

.overview__par.active .overview__par-title-svg {
	transform: scaleY(-1);
}

@media (min-width: 1000px) {
	.overview {
		overflow: hidden !important;
		height: calc(100% - 80rem);
	}
	.overview__par-title-svg {
		display: none;
	}
	.overview__war--warpage {
		width: 500rem;
	}
	.overview__war--warpage .overview__war-text {
		font-size: 16rem;
		line-height: 1;
	}
	.overview__war--warpage .overview__war-text span {
		font-size: 16rem;
		line-height: 1;
	}
}

.overview__par-title {
	position: relative;
	display: block;
	width: 100%;
	height: 24rem;
	font-weight: 400;
	font-size: 18rem;
	line-height: 24rem;
	text-align: center;
	letter-spacing: -0.04em;
	color: var(--c10one);
	background-color: var(--c30);
	border: 0;
	padding: 0;
}

.overview__par-list {
	padding: 8rem;
	list-style: none;
	margin: 0;
	border: 1px solid var(--c30);
	height: calc(100vh - 480rem);
	overflow-y: auto;
}

.overview__par-item {
	padding: 4rem 0;
}

.overview__par-link {
	display: flex;
	justify-content: space-between;
}

.overview__par-link-left {
	display: flex;
}

.overview__par-link-left > img {
	display: block;
	width: 18rem;
	height: 18rem;
	margin-right: 4rem;
	object-fit: contain;
	object-position: center;
}

.overview__par-link-left > span,
.overview__par-link > span {
	font-weight: 400;
	font-size: 18rem;
	line-height: 18rem;
	letter-spacing: -0.04em;
	color: var(--c10one);
	padding-left: 8rem;
}

.overview__par-no {
	display: flex;
	justify-content: center;
	align-items: center;
	margin: auto;
	font-weight: 400;
	font-size: 18rem;
	line-height: 31rem;
	text-align: center;
	letter-spacing: -0.04em;
	color: var(--c10one);
	border: 1px solid var(--c30);
	height: calc(100vh - 434rem);
}

.overview__par-no span {
	opacity: 0.5;
}

.overview__par-no::before,
.overview__par-no::after {
	display: block;
	width: 50rem;
	height: 1px;
	content: '';
	opacity: 0.5;
	background-image: linear-gradient(to left, var(--c10one), transparent);
}

.overview__par-no::after {
	transform: scaleX(-1);
}

.overview__chat {
	display: none;
	height: 100%;
}

.overview__chat--dialog {
	display: block;
	height: 100%;
}

.overview__chat.active {
	display: block;
	animation: fade-translate 0.25s ease both;
}

.overview__chat-wrapper {
	display: grid;
	grid-template-rows: 1fr 42rem;
	height: 100%;
}

.overview__chat-messages {
	padding: 12rem;
	padding-bottom: 20rem;
	overflow-y: auto;
	height: 100%;
	display: flex;
	flex-direction: column;
}

.overview__chat-message {
	display: flex;
}

.overview__chat-message:first-of-type {
	margin-top: auto;
}

.overview__chat-message:not(:last-of-type) {
	margin-bottom: 20rem;
}

.overview__chat-ava-link {
	flex-shrink: 0;
	display: block;
	width: 50rem;
	height: 50rem;
}

.overview__chat-ava {
	display: block;
	width: 50rem;
	height: 50rem;
	object-fit: contain;
	object-position: center;
}

.overview__chat-message-wrapper {
	flex-grow: 1;
}

.overview__chat-message-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 18rem;
	padding-left: 10rem;
	background-image: linear-gradient(to right, var(--c30), transparent);
}

.overview__chat-message-header > h3 {
	font-weight: 400;
	font-size: 17rem;
	line-height: 18rem;
	text-align: center;
	letter-spacing: -0.04em;
	color: var(--c10one);
}

.overview__chat-message-header > span {
	font-weight: 400;
	font-size: 14rem;
	line-height: 18rem;
	text-align: center;
	letter-spacing: -0.04em;
	color: var(--c10one);
}

.overview__chat-message-body {
	display: flex;
	justify-content: space-between;
	padding-top: 8rem;
}

.overview__chat-message-body p {
	margin: 0;
	padding: 0 10rem;
	font-weight: 400;
	font-size: 14rem;
	line-height: 18rem;
	letter-spacing: -0.04em;
	color: var(--c10one);
	word-wrap: break-word;
	width: 286rem;
}

.overview__chat-message--dialog .overview__chat-message-body p {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
}

.overview__chat-message-body p.moder {
	width: 266rem;
}

.overview__chat-message-btns {
	display: grid;
	row-gap: 6rem;
	grid-template-rows: repeat(2, 20rem);
}

.overview__chat-message-btn {
	display: block;
	width: 20rem;
	height: 20rem;
	border: 0;
	padding: 0;
	background-color: transparent;
}

.overview__chat-message-btn svg {
	display: block;
	width: 100%;
	height: 100%;
}

.overview__chat-message-sticker {
	display: block;
	width: 170rem;
	height: 170rem;
	object-position: center;
	object-fit: contain;
}

.overview__chat-message--dialog .overview__chat-message-sticker {
	height: initial;
}

.overview__chat-message--dialog .overview__chat-message-sticker img {
	display: block;
	width: 45rem;
	height: 45rem;
}

.overview__chat-controls {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	background-color: var(--c60);
	display: flex;
	justify-content: space-between;
	padding: 12rem;
}

.overview__chat-controls--dialog {
	bottom: 60rem;
}

.overview__chat-controls--static {
	position: relative;
	bottom: 0;
}

.overview__chat-controls-input {
	display: block;
	width: 272rem;
	height: 20rem;
	border: 1px solid var(--c10two);
	padding: 0 8rem;
	font-weight: 400;
	font-size: 14rem;
	line-height: 20rem;
	letter-spacing: -0.04em;
	color: var(--c10one);
	background-color: transparent;
	outline: none;
}

.overview__chat-controls-input:focus {
	box-shadow: 0 0 5rem 0 var(--c10two);
}

.overview__chat-controls-btn {
	display: block;
	width: 20rem;
	height: 20rem;
	border: none;
	background-color: transparent;
	padding: 0;
}

.overview__chat-controls-btn svg {
	display: block;
	width: 100%;
	height: 100%;
}

.overview__stickers {
	z-index: 5;
	position: fixed;
	left: 0;
	bottom: 102rem;
	width: 360rem;
	height: 221rem;
	background-color: var(--c60);
	transition: all 0.25s ease;
	opacity: 0;
	pointer-events: none;
	filter: drop-shadow(0 0 10rem rgba(0, 0, 0, 0.5));
}

.overview__stickers--b60 {
	bottom: 60rem;
}

.overview__stickers-close-overlay {
	position: fixed;
	bottom: 222rem;
	left: 0;
	width: 100%;
	height: calc(100vh - 320rem);
}

.overview__stickers.active {
	pointer-events: all;
	opacity: 1;
}

.overview__stickers-header {
	display: flex;
}

.overview__stickers-shop {
	flex-shrink: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 36rem;
	width: 100rem;
	padding: 0;
	border: 1px solid var(--c10two);
	position: relative;
	top: 1px;
	background-color: transparent;
}

.overview__stickers-shop svg {
	width: 28rem;
	height: 28rem;
}

.overview__stickers-tabs {
	padding-left: 0;
	list-style: none;
	width: 320rem;
	margin: 0;
	overflow-x: auto;
	overflow-y: hidden;
	display: flex;
}

.overview__stickers-tabs li {
	flex-shrink: 0;
}

.overview__stickers-tab {
	flex-shrink: 0;
	position: relative;
	display: flex;
	height: 36rem;
	padding: 0;
	padding-right: 6rem;
	background-color: var(--c60);
	transition: all 0.5s ease;
	border: 0;
}

.overview__stickers-tab img {
	flex-shrink: 0;
	display: block;
	width: 36rem;
	height: 36rem;
	margin-right: 6rem;
}

.overview__stickers-tab span {
	flex-shrink: 0;
	font-weight: 400;
	font-size: 18rem;
	line-height: 36rem;
	letter-spacing: -0.04em;
	color: var(--c10one);
	transition: all 0.5s ease;
}

.overview__stickers-tab::before {
	position: absolute;
	top: -1px;
	right: -1px;
	display: block;
	width: 8rem;
	height: 8rem;
	content: '';
	background-color: var(--c60);
	clip-path: polygon(0 0, 100% 0, 100% 100%);
}

.overview__stickers-tab.active {
	background-color: var(--c10two);
}

.overview__stickers-tab.active span {
	color: var(--c60);
}

.overview__stickers-main {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 185rem;
	background-image: linear-gradient(to right, var(--c30), transparent);
	padding: 6rem;
}

.overview__stickers-container {
	display: none;
	flex-wrap: wrap;
	justify-content: space-between;
	overflow-y: auto;
	height: 173rem;
	padding-left: 0;
	list-style: none;
}

.overview__stickers-container.active {
	display: flex;
}

.overview__stickers-stick {
	display: block;
	width: 82.5rem;
	height: 82.5rem;
	margin-bottom: 6rem;
	padding: 0;
	border: 0;
	background-color: transparent;
}

.overview__stickers-stick img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
}

.overview__stickers-no {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.overview__stickers-no p {
	margin: 0;
	margin-bottom: 12rem;
	font-weight: 400;
	font-size: 18rem;
	line-height: 18rem;
	letter-spacing: -0.04em;
	color: var(--c10one);
}

.overview__chat-more {
	margin-bottom: 20rem !important;
}

@media (min-width: 1000px) {
	.overview {
		margin-top: 100rem;
		margin-left: 360rem;
		/* padding-top: 30rem; */
	}
	.overview__tabs {
		margin-bottom: 12rem;
		display: none !important;
	}
	.overview__tabs-wiki {
		display: none;
	}
	.overview__wrapper {
		display: flex;
		width: 100%;
	}
	.overview__chat {
		display: block;
		width: 100%;
		padding-right: 30rem;
	}
	.overview__view {
		display: grid;
		grid-template-columns: 1fr 1fr;
	}
	.overview__view.active {
		display: grid;
	}
	.overview__par {
		height: 300rem;
		grid-row: 2 / 3;
	}
	.overview__par.active {
		height: 300rem;
	}
	.overview__love-part.active {
		display: grid;
	}
	.overview__par-list {
		height: 276rem;
		scrollbar-color: var(--c30) transparent;
		scrollbar-width: thin;
	}
	.overview__par-list::-webkit-scrollbar {
		width: 4rem;
		background-color: transparent;
	}
	.overview__par-list::-webkit-scrollbar-thumb {
		background-color: var(--c30);
	}
	.overview__chat-messages {
		padding: 0 30rem;
		padding-left: 0;
		overflow-y: auto;
		height: 100%;
		display: flex;
		flex-direction: column;
		scrollbar-color: var(--c30) transparent;
		scrollbar-width: thin;
	}
	.overview__chat-messages::-webkit-scrollbar {
		width: 4rem;
		background-color: transparent;
	}
	.overview__chat-messages::-webkit-scrollbar-thumb {
		background-color: var(--c30);
	}
	.overview__love {
		padding: 0 30rem;
	}
	.overview__love-stat {
		display: block;
	}
	.overview__chat-controls {
		position: static;
		display: flex;
		justify-content: space-between;
		padding: 30rem 0;
		padding-top: 8rem;
	}
	.overview__chat-controls--dialog {
		bottom: 0;
	}
	.overview__chat-controls-input {
		width: 100%;
		height: 30rem;
		margin-right: 30rem;
		font-size: 16rem;
	}
	.overview__chat-controls-btn:not(:last-of-type) {
		margin-right: 30rem;
	}
	.overview__chat-controls-btn {
		width: 30rem;
		height: 30rem;
	}
	.overview__chat-message-body p {
		width: 360rem;
		font-size: 16rem;
		word-wrap: break-word;
	}
	.overview__chat-message-body--dialog p {
		width: 100%;
	}
	.dialog .overview__chat-message {
		width: 45%;
	}
	.dialog .overview__chat-message--my {
		margin-left: auto;
	}
	.overview__chat-ava-link {
		flex-shrink: 0;
		display: block;
		width: 70rem;
		height: 70rem;
	}
	.overview__chat-ava {
		display: block;
		width: 70rem;
		height: 70rem;
		object-fit: contain;
		object-position: center;
	}
	.overview__chat-message:not(:last-of-type) {
		margin-bottom: 30rem;
	}
	.overview__chat-message-body p.moder {
		width: 375rem;
		flex-grow: 1;
		word-wrap: break-word;
	}
	.overview__line {
		display: none;
	}
	.overview__love-part {
		display: grid;
		position: absolute;
		grid-template-columns: 1fr 1fr;
		gap: 30rem;
		width: 705rem;
		left: -450rem;
		top: 265rem;
	}
	.overview__par-no {
		height: 276rem;
	}
	.overview__par:first-of-type {
		margin-bottom: 0;
	}
	.overview__love-part-vote-main {
		margin-bottom: 0;
	}
	.overview__love-part-vote {
		margin-bottom: 0;
	}
	.overview__view-info {
		margin: 0px auto 17rem;
	}
	.overview__stickers {
		position: absolute;
		left: initial;
		right: 0;
		bottom: 85rem;
		width: 510rem;
	}
	.dialog .overview__stickers {
		position: absolute;
		left: initial;
		right: 30rem;
		bottom: 165rem;
		width: 510rem;
	}
	.overview__stickers--dialog {
		bottom: 155rem;
	}
	.overview__stickers-close-overlay {
		left: initial;
		right: 0;
		bottom: 222rem;
		top: initial;
		width: 510rem;
		height: calc(100vh - 390rem);
	}
	.overview__stickers-container {
		scrollbar-color: var(--c30) transparent;
		scrollbar-width: thin;
	}
	.overview__stickers-container::-webkit-scrollbar {
		width: 4rem;
		background-color: transparent;
	}
	.overview__stickers-container::-webkit-scrollbar-thumb {
		background-color: var(--c30);
	}
	.overview__stickers-containers--w100 .overview__stickers-container {
		justify-content: flex-start;
		gap: 4rem;
	}
	.overview__stickers-tabs {
		scrollbar-color: var(--c30) transparent;
		scrollbar-width: thin;
		width: calc(100% - 40rem);
	}
	.overview__stickers-tabs::-webkit-scrollbar {
		height: 4rem;
		background-color: transparent;
	}
	.overview__stickers-tabs::-webkit-scrollbar-thumb {
		background-color: var(--c30);
	}
	.overview__love-stat-close {
		display: none;
	}
	.overview__chat-controls--pc-w900 {
		width: 900rem;
		margin: 0 auto;
		position: relative;
	}
	.overview__stickers--b60 {
		width: 100%;
		bottom: 67rem;
	}
	.overview__stickers--b60 .overview__stickers-close-overlay {
		width: 100%;
	}
}

/*! longBtnWihoutCorners */

.longBtnWihoutCorners {
	position: relative;
	margin: 0 auto;
	padding: 7rem 10rem;
	width: max-content;
	max-width: 100%;
	background-color: var(--c10two);
	color: var(--c60);
	border: 0;
	font-size: 14rem;
}

.longBtnWihoutCorners::before,
.longBtnWihoutCorners::after {
	position: absolute;
	top: -1px;
	left: -1px;
	display: block;
	width: 6rem;
	height: 6rem;
	content: '';
	background-color: var(--c60);
	clip-path: polygon(0% 0%, 100% 0%, 0% 100%);
}

.longBtnWihoutCorners::after {
	transform: scale(-1);
	top: initial;
	left: initial;
	right: -1px;
	bottom: -1px;
}

/*! war */

.war {
	padding-top: 14rem;
	padding-bottom: 24rem;
	height: calc(100% - 60rem);
	font-size: 14rem;
	overflow-y: auto;
	overflow-x: hidden;
}

.war__title {
	margin: 0;
	margin-bottom: 24rem;
}

.war__top {
	position: relative;
}

.war__sides {
	display: grid;
	align-items: center;
	grid-template-columns: repeat(3, 1fr);
	padding: 0 12rem;
	gap: 12rem;
}

.war__gerbs {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4rem;
}

.war__gerbs > p {
	margin: 0;
	text-align: center;
}

.war__gerbs > img,
.war__gerbs > svg {
	display: block;
	width: 70rem;
	height: 70rem;
	object-fit: contain;
	object-position: center;
}

.war__sides > p {
	margin: 0;
	line-height: 1.5;
	text-align: center;
}

.war__type {
	position: relative;
	display: flex;
	align-items: center;
	padding: 0 12rem;
}

.war__type::before,
.war__type::after {
	display: block;
	width: 100%;
	height: 1px;
	content: '';
	background-image: linear-gradient(to right, transparent, var(--c10one));
}

.war__type::after {
	background-image: linear-gradient(to left, transparent, var(--c10one));
}

.war__type svg {
	flex-shrink: 0;
	display: block;
	width: 34rem;
	height: 34rem;
}

.war__damage {
	position: relative;
	display: grid;
	align-items: center;
	grid-template-columns: repeat(3, 1fr);
	gap: 6rem;
	padding: 6rem 0;
	font-size: 12rem;
}

.war__damage p {
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 6rem;
	text-align: center;
}

.war__damage p > span {
	color: var(--c10two);
}

.war__damage p:nth-of-type(2) {
	font-size: 14rem;
	letter-spacing: -1rem;
}

.war__playerDamage {
	position: absolute;
	top: 0;
	left: 0;
	height: 1px;
	width: 100%;
}

.war__playerDamage div {
	position: absolute;
	bottom: 0;
	display: flex;
	align-items: center;
	width: max-content;
	gap: 6rem;
	background-color: var(--c30);
	font-size: 16rem;
	height: 30rem;
	box-shadow: 0 0 10rem 0 rgba(0, 0, 0, 0.25);
}

.war__playerDamage div.left {
	left: 0;
	padding-right: 12rem;
	animation: damageMessageLeft 5s ease-in-out both;
}

@keyframes damageMessageLeft {
	0% {
		transform: translateX(-200rem);
		opacity: 0;
	}
	25% {
		transform: translateX(0);
		opacity: 1;
	}
	35% {
		transform: translateX(0);
	}
	75% {
		opacity: 1;
	}
	100% {
		transform: translate(0, -150rem);
		opacity: 0;
	}
}

.war__playerDamage div.right {
	right: 0;
	padding-left: 12rem;
	animation: damageMessageRight 5s ease-in-out both;
}

@keyframes damageMessageRight {
	0% {
		transform: translateX(200rem);
		opacity: 0;
	}
	25% {
		transform: translateX(0);
		opacity: 1;
	}
	35% {
		transform: translateX(0);
	}
	75% {
		opacity: 1;
	}
	100% {
		transform: translate(0, -150rem);
		opacity: 0;
	}
}

.war__playerDamage img {
	display: block;
	width: 30rem;
	height: 30rem;
	object-fit: contain;
	object-position: center;
}

.war__enter {
	margin: 0 auto;
}

.war__enter-grid {
	display: grid;
	align-items: center;
	grid-template-columns: 1fr 45rem 144rem;
	gap: 6rem;
	padding: 0 12rem;
}

.war__enter-left {
	display: flex;
	flex-direction: column;
	gap: 6rem;
}

.war__enter-str {
	display: flex;
	align-items: center;
	gap: 6rem;
	font-size: 12rem;
}

.war__enter-str label {
	position: relative;
}

.war__prem-grid {
	display: flex;
	align-items: center;
	gap: 6rem;
	padding: 0 12rem;
}

.war__prem-col {
	display: flex;
	flex-direction: column;
	width: 40%;
	gap: 6rem;
}

.war__prem-col:nth-last-of-type(2) {
	width: 20%;
}

.war__prem-col > span {
	display: block;
	width: 100%;
	text-align: center;
}

.war__prem-col > label,
.war__units-count > label {
	position: relative;
	height: 24rem;
}

.war__prem-col .ct__check-box30 {
	margin-bottom: 0;
	flex-shrink: 0;
	gap: 6rem;
}

.war__prem-col .ct__check-box30 svg {
	display: block;
	flex-shrink: 0;
	margin-right: 0;
}

.war__prem-col .ct__check-box30 span {
	margin-right: 0;
}

.war__prem-col .ct__check-box30 label {
	font-size: 10rem;
	gap: 4rem;
}

.war__prem-col > label::before,
.war__units-count > label::before,
.war__enter-str > label::before {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	content: '';
	border: 1px solid var(--c10one);
	opacity: 0.5;
}

.war__prem-col > label input,
.war__units-count > label input,
.war__enter-str > label input {
	display: block;
	border: 0;
	background-color: transparent;
	height: 24rem;
	width: 100%;
	color: white;
}

.war__units-count > label {
	width: 150rem;
}

.war__units {
	display: flex;
	flex-direction: column;
	gap: 12rem;
	padding: 0 12rem;
}

.war__units-count {
	display: flex;
	align-items: center;
}

.war__units-count > span:first-of-type {
	margin-right: auto;
}

.war__units-count > span:last-of-type {
	margin-left: 6rem;
}

.war__list h2 {
	display: none;
}

.war__list {
	display: none;
	margin: 0;
	padding-left: 0;
	flex-direction: column;
	gap: 12rem;
}

.war__list.active {
	display: flex;
}

.war__tabs {
	margin-bottom: 12rem;
}

.war__revoBlock {
	display: flex;
	flex-direction: column;
	padding: 12rem;
	gap: 12rem;
	max-width: 500rem;
	margin: 0 12rem;
	margin-bottom: 12rem;
	background-color: var(--c30);
	align-items: center;
}

.war__revoBlock h2 {
	font-size: 16rem;
	font-weight: 400;
	margin: 0;
	text-align: center;
	line-height: 1;
}

.war__revoBlockFlex {
	display: flex;
	justify-content: space-between;
	width: 100%;
}

.war__revoIcons {
	display: flex;
	justify-content: center;
	gap: 12rem;
}

.war__revoIcons svg {
	width: 30rem;
	height: 30rem;
	filter: grayscale(1);
	opacity: 0.4;
}

.war__revoIcons svg.active {
	filter: grayscale(0);
	opacity: 1;
}

@media (min-width: 1000px) {
	.war__revoBlock {
		margin: 0 auto;
		margin-bottom: 12rem;
		margin-right: 48rem;
	}
	.war {
		margin-top: 100rem;
		margin-left: 330rem;
		height: calc(100vh - 100rem);
	}
	.war__top,
	.war__prem,
	.war__units,
	.war__enter {
		width: 500rem;
		margin: 0 auto;
	}
	.war__enter-grid {
		grid-template-columns: 1fr 94rem 1fr;
	}
	.war__listContainer {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 24rem;
	}
	.war__list {
		display: flex;
	}
	.war__list h2 {
		display: block;
		font-weight: 400;
		text-align: center;
		margin: 0;
	}
	.war__tabs {
		display: none !important;
	}
}

/*! party */

.party {
	padding-top: 14rem;
	padding-bottom: 24rem;
	height: calc(100% - 60rem);
	overflow-y: auto;
	overflow-x: hidden;
}

.party__title {
	margin: 0;
	margin-bottom: 12rem;
}

.party__tabs-management {
	margin-bottom: 12rem;
}

.party__name-edit-block {
	margin-bottom: 12rem;
}

.party__top {
	display: flex;
	margin-bottom: 16rem;
	padding: 0 12rem;
}

.party__top-no {
	display: flex;
	flex-direction: column;
	padding: 0 12rem;
	font-size: 14rem;
}

.party__top-no > p {
	margin: 0;
	margin-bottom: 12rem;
	text-align: center;
}

.party__top-no-create {
	width: max-content;
	height: 30rem;
	font-size: 18rem;
	text-align: center;
	background-color: var(--c10two);
	color: var(--c60);
	padding: 0 12rem;
	line-height: 30rem;
	margin-bottom: 12rem;
	align-self: center;
	transform: skewX(-10deg);
}

.party__top-ava {
	display: block;
	width: 120rem;
	height: 120rem;
	margin-right: 12rem;
	object-fit: contain;
	object-position: center;
}

.party__top-ava.sm {
	position: relative;
	top: 1px;
	width: 80rem;
	height: 80rem;
}

.party__top-content {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.party__top-content-textBlock {
	margin-bottom: 6rem;
}

.party__top-content-textBlock p {
	margin: 0;
	font-size: 14rem;
	line-height: 20rem;
	padding: 0 6rem;
}

.party__top-content-textBlock p:nth-of-type(odd) {
	background-color: var(--c30);
}

.party__top-content-request {
	margin-top: 6rem;
}

.party__regionInfo-block p {
	display: flex;
	justify-content: space-between;
	margin: 0;
	font-size: 14rem;
	line-height: 20rem;
	padding: 0 12rem;
}

.party__regionInfo-block p:nth-of-type(odd) {
	background-color: var(--c30);
}

.party__regionInfo-block p span {
	color: var(--c10two);
}

.party__regionInfo-block h2 {
	margin: 0;
	font-weight: 400;
	font-size: 14rem;
	line-height: 20rem;
	text-align: center;
}

.party__top-name {
	margin: 0;
	margin-bottom: 6rem;
	padding-bottom: 3rem;
	font-weight: 400;
	font-size: 18rem;
	line-height: 18rem;
	letter-spacing: -0.5rem;
	border-bottom: 1px solid #fff;
}

.party__top-btns {
	position: relative;
	display: flex;
	margin-bottom: 6rem;
	height: 30rem;
}

.party__top-btns::before {
	position: absolute;
	top: 50%;
	left: -12rem;
	display: block;
	width: calc(100% + 24rem);
	height: 10rem;
	content: '';
	transform: translateY(-50%);
	background-color: var(--c30);
}

.party__primer {
	position: absolute;
	left: 0;
	top: 50%;
	display: block;
	width: 26rem;
	height: 30rem;
	padding: 0;
	border: 0;
	transform: translateY(-50%);
	background-color: transparent;
}

.party__primer svg {
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
}

.party__requests {
	position: absolute;
	display: block;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 30rem;
	height: 30rem;
	line-height: 30rem;
	font-size: 14rem;
	text-align: center;
	color: var(--c60);
	font-weight: 700;
	background-color: var(--c10two);
}

.party__exit {
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	display: block;
	width: 30rem;
	height: 30rem;
}

.party__exit > button {
	display: block;
	width: 100%;
	height: 100%;
	padding: 0;
	border: 0;
	background-color: transparent;
}

.party__exit > button svg {
	display: block;
	width: 100%;
	height: 100%;
}

.party__top-sett {
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 30rem;
	height: 30rem;
	margin-left: auto;
	padding: 0;
	border: 0;
	background-color: transparent;
}

.party__top-sett svg {
	display: block;
	width: 100%;
	height: 100%;
}

.party__region {
	display: flex;
}

.party__region img {
	display: block;
	width: 32rem;
	height: 32rem;
	margin-right: 6rem;
}

.party__region p {
	margin: 0;
	font-size: 14rem;
	line-height: 16rem;
	letter-spacing: -0.5rem;
	color: #ffffff;
}

.party__mana {
	margin-bottom: 16rem;
}

.party__mana-avas {
	display: flex;
	padding: 0 16rem;
}

.party__mana-ava-block {
	position: relative;
	width: 156rem;
	height: 156rem;
}

.party__mana-ava-block:first-of-type {
	margin-right: 16rem;
}

.party__mana-ava-block > img,
.party__mana-ava-block > svg {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
}

.party__mmid {
	margin-bottom: 16rem;
}

.party__mana-name {
	margin: 0;
	font-weight: 400;
	font-size: 18rem;
	line-height: 1;
	letter-spacing: -0.5rem;
}

.party__mana-name--desc {
	font-size: 14rem;
	line-height: 1.4;
}

.party__name-edit-before {
	padding: 0 16rem;
	display: flex;
}

.party__name-edit-btn {
	position: relative;
	top: 2rem;
	flex-shrink: 0;
	display: block;
	width: 30rem;
	height: 30rem;
	margin-right: 6rem;
	padding: 0;
	border: 0;
	background-color: transparent;
}

.party__name-edit-btn svg {
	display: block;
	width: 100%;
	height: 100%;
}

.party__mmid-split {
	display: flex;
	padding: 0 16rem;
}

.party__mmid-col {
}

.party__mmid-col h2 {
	margin: 0;
	margin-bottom: 4rem;
	font-weight: 400;
	font-size: 14rem;
	line-height: 16rem;
}

.party__mmid-col--r {
	margin-left: 16rem;
}

.party__mmid-col--r h2 {
	text-align: right;
}

.party__mmid-line {
	background-image: linear-gradient(
		to right,
		transparent,
		var(--c10one),
		transparent
	);
	height: 1px;
	margin: 12rem 16rem;
}

.party__colorContainer {
	padding: 0 14rem;
	display: flex;
	align-items: center;
	gap: 6rem;
}

.party__colorContainer > input {
	display: block;
	width: 34rem;
	height: 34rem;
	border: 0;
	background-color: transparent;
}

.party__colorContainer > input[type='color' i]::-webkit-color-swatch-wrapper {
	padding: 0;
	border: 0;
}

.party__colorContainer > input[type='color' i]::-webkit-color-swatch {
	border: 1px solid var(--c10one);
}

.party__colorContainer > span {
	font-size: 14rem;
}

.party__mmid-add {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	padding: 0 16rem;
	font-size: 14rem;
	line-height: 16rem;
}

.party__mmid-add > h2 {
	font-weight: 400;
	margin: 0;
	margin-bottom: 4rem;
	width: 50%;
	font-size: 14rem;
	line-height: 16rem;
}

.party__mmid-add > input {
	width: 156rem;
	height: 24rem;
	margin-bottom: 4rem;
	border: 1px solid var(--c10one);
	padding: 0;
	font-weight: 400;
	font-size: 12rem;
	line-height: 24rem;
	text-align: center;
	padding: 0 6rem;
	background-color: transparent;
}

.party__decline-all {
	margin: 0 auto;
	margin-bottom: 24rem;
}

.party__new-top {
	padding: 0 12rem;
	font-size: 14rem;
}

.party__new-title {
	margin-top: 0;
	margin-bottom: 24rem;
	text-align: center;
	font-size: 18rem;
	font-weight: normal;
}

.party__new-title span {
	color: var(--c10two);
	font-weight: 700;
}

.post-form {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.party__new-label {
	display: flex;
	width: 100%;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 6rem;
}

.party__new-label input {
	display: block;
	width: 50%;
	height: 24rem;
	line-height: 24rem;
	border: 1px solid var(--c10one);
	padding: 0 6rem;
	color: var(--c10one);
	text-align: center;
	background-color: transparent;
}

.party__new-label input[type='file'] {
	position: relative;
	padding: 0;
	border: 0;
	display: flex;
	flex-direction: column;
}

.party__new-label input[type='file']::-webkit-file-upload-button {
	background: var(--c10two);
	border: 0;
	padding: 0rem 4rem;
}

.party__new-create {
	margin-top: 24rem;
}

.party__join-party-btn {
	margin: 0 auto;
	margin-top: 16rem;
}

.party__join-desc {
	margin: 0;
	margin-bottom: 18rem;
	padding: 0 12rem;
	font-size: 14rem;
	line-height: 1.4;
}

.party__manageTabs {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 12rem;
	width: 100%;
	padding: 0 12rem;
	margin-bottom: 12rem;
}

.party__manageTabs button {
	font-size: 13rem;
}

.party__manageGold {
	gap: 12rem;
	width: 100%;
	padding: 0 12rem;
	margin-bottom: 12rem;
}

@media (min-width: 1000px) {
	.party__manageGold {
		width: 600rem;
		margin: 0 auto;
		margin-bottom: 12rem;
	}

	.party__manageTabs {
		width: 600rem;
		margin: 0 auto;
		margin-bottom: 12rem;
	}

	.party {
		margin-top: 100rem;
		margin-left: 330rem;
		width: calc(100vw - 330rem);
		height: calc(100vh - 100rem);
	}
	.party__top-ava,
	.party__top-ava.sm {
		top: 0;
		width: 160rem;
		height: 160rem;
		margin-right: 12rem;
	}
	.party__top {
		justify-content: center;
	}
	.party__top-content {
		border: 1px solid var(--c30);
		padding: 12rem;
		min-width: 400rem;
	}
	.party__top-content--join {
		width: 400rem;
		min-width: initial;
	}
	.party__region {
		align-items: center;
	}
	.party__mana-avas {
		justify-content: center;
	}
	.party__mana-name {
	}
	.party__mmid-split {
		justify-content: center;
	}
	.party__mmid-add {
		width: 400rem;
		margin: 0 auto;
	}
	.party__tabs {
		width: 360rem;
		margin: 0 auto;
	}
	.party__tabs-management {
		width: 360rem;
		margin: 0 auto;
		margin-bottom: 12rem;
	}
	.party__new-top {
		width: 500rem;
		margin: 0 auto;
	}
	.party__new-label input {
		width: 55%;
	}
	.party__name-edit-block {
		width: 360rem;
		margin: 0 auto;
		margin-bottom: 12rem;
	}
	table.party__join-info-table {
		width: 572rem;
		margin: 0 auto;
	}
	.party__join-desc {
		margin: 0 auto;
		margin-bottom: 18rem;
		padding: 0;
		width: 572rem;
	}
	.party__colorContainer {
		max-width: 360rem;
		margin: 0 auto;
	}
	.party__regionInfo {
		width: 570rem;
		margin: 0 auto;
	}
}

/*! state */

.state {
	padding-top: 14rem;
	padding-bottom: 24rem;
	height: calc(100% - 60rem);
	overflow-y: auto;
	overflow-x: hidden;
}

.state__title {
	margin: 0;
	margin-bottom: 12rem;
}

.state__tabs-management {
	margin-bottom: 12rem;
}

.state__name-edit-block {
	margin-bottom: 12rem;
}

.state__top {
	display: flex;
	margin-bottom: 16rem;
	padding: 0 12rem;
	justify-content: space-between;
}

.state__top-ava {
	display: block;
	width: 180rem;
	height: 180rem;
	margin-right: 12rem;
	object-fit: contain;
	object-position: center;
}

.state__top-content {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.state__tabs {
	display: flex;
	flex-direction: column;
	gap: 20rem;
	justify-content: space-between;
	height: initial;
	margin-bottom: 0;
}

.state__tab > span {
	font-size: 14rem !important;
	color: var(--c10one) !important;
}

.state__tab.active > span {
	color: var(--c60) !important;
}

.state__svgBg {
	fill: var(--c30);
}

.state__tab.active .state__svgBg {
	fill: var(--c10two);
}

.state__tab .treg1,
.state__tab .treg2,
.state__tab .treg3 {
	display: none;
}

.state__tab.active .treg1,
.state__tab.active .treg2,
.state__tab.active .treg3 {
	display: initial;
}

.stateBlock {
	display: none;
}

.stateBlock.active {
	display: block;
}

.stateBlock > h2 {
	margin: 0;
	margin-bottom: 12rem;
	font-weight: 400;
	font-size: 14rem;
	line-height: 16rem;
	text-align: center;
}

.stateBlock .gover__goverPartyTable td:nth-of-type(2) {
	text-align: right;
	width: 40%;
}

@media (min-width: 1000px) {
	.state {
		padding-top: 14rem;
		padding-bottom: 72rem;
		margin-top: 100rem;
		height: calc(100% - 100rem);
		margin-left: 330rem;
	}
	.state__top {
		padding: 0;
		width: 570rem;
		margin: 0 auto;
		margin-bottom: 24rem;
	}
	.state__top-content {
		border: 1px solid var(--c30);
		width: 100%;
		align-items: flex-start;
		padding: 12rem;
	}
	.state__tabs {
		gap: 12rem;
	}
}

/*! gover */

.gover {
	padding-top: 14rem;
	padding-bottom: 24rem;
	height: calc(100% - 60rem);
	overflow-y: auto;
	overflow-x: hidden;
}

.gover__title {
	margin: 0;
	margin-bottom: 12rem;
}

.gover__topVyb {
	margin: 0;
	margin-bottom: 6rem;
	display: flex;
	justify-content: space-between;
	color: var(--c10one);
	font-size: 14rem;
}

.gover__tabsContainer {
	padding-bottom: 9rem;
	margin-bottom: 9rem;
	overflow-y: hidden;
	overflow-x: auto;
	width: 100%;
}

.gover__tabs {
	width: max-content;
	display: flex;
	gap: 6rem;
	padding: 0 12rem;
}

.gover__tab > span {
	font-size: 14rem !important;
	color: var(--c10one) !important;
}

.gover__tab.active > span {
	color: var(--c60) !important;
}

.gover__svgBg {
	fill: var(--c30);
}

.gover__tab.active .gover__svgBg {
	fill: var(--c10two);
}

.gover__tab .treg1,
.gover__tab .treg2,
.gover__tab .treg3 {
	display: none;
}

.gover__tab.active .treg1,
.gover__tab.active .treg2,
.gover__tab.active .treg3 {
	display: initial;
}

.gover__decorLine {
	height: 1px;
	margin: 0 12rem;
	margin-bottom: 18rem;
	background-image: linear-gradient(
		to right,
		transparent,
		var(--c10one),
		transparent
	);
}

.gover__block {
	display: none;
	font-size: 12rem;
	line-height: 16rem;
}

.gover__block.active {
	display: block;
}

.gover__table {
	width: 100%;
	border-collapse: collapse;
}

.gover__table tr:nth-of-type(even) {
	background-color: var(--c30);
}

.gover__table td {
	padding: 6rem 0;
}

.gover__table tr {
	position: relative;
}

.gover__table tr:first-of-type td {
	padding-top: 0;
}

.gover__table td:first-of-type {
	padding-left: 6rem;
}

.gover__table td:last-of-type {
	padding-right: 6rem;
}

.gover__table p {
	margin: 0;
}

.gover__tableInfo {
	background-color: #4791ff;
	border: 0;
	width: 24rem;
	height: 24rem;
	color: #fff;
	border-radius: 4rem;
}

.gover__table tr:nth-of-type(even) .gover__tableModalInfo {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.gover__minContent {
	width: min-content;
}

.gover__withImage {
	display: inline-flex;
	gap: 10rem;
	align-items: center;
}

.gover__withImage a {
	color: var(--c10two);
}

.gover__withImage img,
.gover__withImage svg {
	display: block;
	width: 34rem;
	height: 34rem;
}

.gover__withImage svg {
	display: block;
	width: 34rem;
	height: 34rem;
}

.gover__tableDopInfo,
.gover__tableCancel,
.gover__tableVote {
	display: none;
}

.gover__tableVote-wrappper {
	display: flex;
	flex-direction: column;
}

.gover__tableVote-wrappper p {
	display: inline-flex;
	width: 100%;
	justify-content: space-between;
}

.gover__newSelect {
	margin: 0 auto;
	margin-bottom: 18rem;
}

.gover__newInner {
	display: none;
	flex-direction: column;
	align-items: center;
	gap: 20rem;
	font-size: 16rem;
	padding: 0 24rem;
}

.gover__newInner.active {
	display: flex;
}

.gover__newInner > h2,
.gover__newInner h3 {
	margin: 0;
	font-size: 16rem;
	font-weight: 400;
	text-align: center;
}

.gover__newInner p {
	margin: 0;
	text-align: center;
}

.gover__newInner .party__mana-ava-block {
	margin: 0;
}

.gover__newInner-flexColumn {
	display: none;
	flex-direction: column;
	align-items: center;
	gap: 12rem;
	padding: 0 24rem;
	width: 100%;
}

.gover__newInner-flexColumn.active {
	display: flex;
}

.gover__newInner-flexCenter {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 6rem;
}

.gover__newInner-textIput {
	display: block;
	width: 90rem;
	padding: 0 6rem;
	height: 18rem;
	font-size: 16rem;
	line-height: 18rem;
	border: 1px solid var(--c10one);
	background-color: transparent;
	color: var(--c10one);
	outline: none;
}

.gover__newInner-wideInput {
	position: relative;
	height: 30rem;
	width: calc(100% - 48rem);
	margin: 0 auto;
}

.gover__newInner-wideInput::before,
.gover__newInner-twoWithInput label::before {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	content: '';
	border: 1px solid var(--c10one);
	opacity: 0.5;
	pointer-events: none;
}

.gover__newInner-wideInput input {
	display: block;
	width: 100%;
	padding: 0 6rem;
	height: 100%;
	background-color: transparent;
	border: 0;
	color: var(--c10one);
}

.gover__newInner-textIput:focus {
	box-shadow: 0 0 5rem 0 var(--c10one);
}

.gover__newInner-infoText {
	display: flex;
}

.gover__newInner-infoText input {
	margin: 0 6rem;
}

.gover__newInner-table {
	border-collapse: collapse;
	width: 100%;
	line-height: 24rem;
}

.gover__newInner-table tr:nth-of-type(odd) {
	background-color: var(--c30);
}

.gover__newInner-table td:first-of-type {
	padding-left: 12rem;
}

.gover__newInner-table td:last-of-type {
	padding-right: 12rem;
}

.gover__newInner-twoWithInput {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
}

.gover__newInner-twoWithInput > div {
	display: flex;
	width: 150rem;
	align-items: center;
	margin-left: auto;
}

.gover__newInner-twoWithInput--small > div {
	width: 129rem;
	margin-right: 21rem;
}

.gover__newInner-twoWithInput label {
	display: flex;
	position: relative;
	flex-grow: 1;
	height: 30rem;
	max-width: 100%;
}

.gover__newInner-twoWithInput input {
	display: block;
	flex-grow: 1;
	line-height: 30rem;
	border: 0;
	color: var(--c10one);
	background-color: transparent;
	max-width: 100%;
}

.gover__ministerTabs {
	margin-bottom: 18rem;
}

.ForeignRights_block,
.MiningStats_block {
	display: none;
	flex-direction: column;
	gap: 20rem;
	align-items: center;
}

.ForeignRights_block.active,
.MiningStats_block.active {
	display: flex;
}

.ForeignRights_block-cancelAll {
	display: block;
	margin-left: auto;
	margin-right: 24rem;
	padding: 0 12rem;
	font-size: 16rem;
	line-height: 24rem;
	color: var(--c60);
	background-color: var(--c10two);
	border: 0;
}

.gover__voteMid > div {
	display: flex;
	gap: 12rem;
}

.gover__voteMid button {
	display: inline-block;
	padding: 6rem;
	background-color: transparent;
	border: 0;
}

.gover__goverSvg {
	display: block;
	width: 270rem;
	height: 119rem;
	margin: 0 auto;
	margin-bottom: 18rem;
}

.gover__goverParty {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12rem;
	padding: 2rem 12rem;
	font-size: 16rem;
	line-height: 1.3;
	color: #fff;
	font-weight: 500;
	text-shadow: -0 -1px 0 #000000, 0 -1px 0 #000000, -0 1px 0 #000000,
		0 1px 0 #000000, -1px -0 0 #000000, 1px -0 0 #000000, -1px 0 0 #000000,
		1px 0 0 #000000, -1px -1px 0 #000000, 1px -1px 0 #000000, -1px 1px 0 #000000,
		1px 1px 0 #000000, -1px -1px 0 #000000, 1px -1px 0 #000000,
		-1px 1px 0 #000000, 1px 1px 0 #000000;
	letter-spacing: -0.04em;
}

.gover__goverParty-imgBlock {
	display: flex;
	align-items: center;
	gap: 6rem;
}

.gover__goverParty-imgBlock svg {
	display: block;
	width: 34rem;
	height: 34rem;
}

.gover__goverParty-imgBlock img {
	display: block;
	width: 34rem;
	height: 34rem;
}

.gover__goverParty img,
.gover__goverPartyTable img {
	display: block;
	width: 34rem;
	height: 34rem;
	object-fit: contain;
	object-position: center;
}

.gover__goverParty img {
	filter: drop-shadow(0 0 3px #000);
}

.gover__goverPartyTable {
	border-collapse: collapse;
	font-size: 16rem;
	line-height: 1.3;
	letter-spacing: -0.04em;
	width: 100%;
	margin-bottom: 8rem;
}

.gover__goverPartyTable td {
	padding: 2rem 4rem;
	width: 35%;
}

.gover__goverPartyTable tr:first-of-type td {
	padding-top: 4rem;
}

.gover__goverPartyTable td:first-of-type {
	padding-left: 12rem;
}

.gover__goverPartyTable td:nth-of-type(1) {
	text-align: left;
	width: 20%;
}

.gover__goverPartyTable td:nth-of-type(2) {
	text-align: right;
	width: 20%;
}

.gover__goverPartyTable td:nth-of-type(3) {
	text-align: center;
}

.gover__goverPartyTable td:last-of-type {
	padding-right: 12rem;
}

.gover__goverPartyTable--mb {
	margin-bottom: 18rem;
}

.gover__goverPartyTable--zebra {
	margin-bottom: 12rem;
}

.gover__goverPartyTable--zebra tr:nth-of-type(odd) {
	background-color: var(--c30);
}

.gover__goverPartyTable--zebra tr:nth-of-type(even) td {
	border-bottom: 1px solid var(--c30);
}

.gover__coffers table {
	font-size: 14rem;
}

.gover__coffers > h2 {
	margin: 0;
	margin-bottom: 12rem;
	font-weight: 400;
	font-size: 14rem;
	line-height: 16rem;
	text-align: center;
}

.gover__powerArr button {
	padding: 3rem;
	border: 0;
	background-color: transparent;
	cursor: pointer;
	width: 30rem;
	height: 30rem;
	background-size: 24rem 24rem;
	background-repeat: no-repeat;
	background-position: center;
}

.gover__blockStatistic__dop {
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 6rem;
}

.gover__blockStatistic__dop div {
	display: flex;
	width: 100%;
	justify-content: space-between;
	align-items: center;
}

.gover__td--onlyPc {
	display: none;
}

@media (min-width: 1000px) {
	.gover {
		padding-top: 14rem;
		padding-bottom: 72rem;
		margin-top: 100rem;
		height: calc(100% - 100rem);
		margin-left: 330rem;
	}
	.gover__tabsContainer {
		display: flex;
		justify-content: center;
	}
	.gover__voteMid > div {
		display: flex;
		justify-content: flex-end;
		gap: 24rem;
	}
	.gover__voteMid button {
		font-size: 22rem;
		cursor: pointer;
		transition: all 0.2s ease;
	}
	.gover__voteMid button:hover {
		filter: drop-shadow(0 0 4rem var(--c10two));
	}
	.gover__table td:last-of-type {
		padding-right: 24rem;
	}
	.gover__table td:first-of-type {
		padding-left: 24rem;
	}
	.gover__ministerTabs {
		margin: 0 auto;
		margin-bottom: 18rem;
		width: max-content;
		gap: 8rem;
	}
	.gover__tableCancel a {
		color: var(--c10two);
		text-decoration: underline;
	}
	.gover__tableCancel button {
		width: 49%;
		padding: 6rem;
		border: 0;
		font-size: 22rem;
		background-color: transparent;
		margin-left: 12rem;
		cursor: pointer;
		transition: all 0.2s ease;
	}
	.gover__tableVote button {
		width: 49%;
		padding: 6rem;
		border: 0;
		font-size: 22rem;
		background-color: transparent;
		cursor: pointer;
		transition: all 0.2s ease;
	}
	.gover__tableCancel button:hover,
	.gover__tableVote button:hover {
		filter: drop-shadow(0 0 4rem var(--c10two));
	}
	.gover__tableInfoTd {
		display: none;
	}
	td.gover__tableVote {
		text-align: right;
		padding-right: 24rem;
	}
	.gover__tableVote-wrappper p {
		width: 100%;
		justify-content: center;
		gap: 18rem;
	}
	.gover__newInner {
		max-width: 360rem;
		margin: 0 auto;
	}
	.gover__tableDopInfo,
	.gover__tableCancel,
	.gover__tableVote {
		display: table-cell;
	}
	.gover__td--onlyPc {
		display: table-cell;
		text-align: center;
	}
	.gover__td--onlyMob {
		display: none;
	}
}

/*! SVG Images */

.redDownArrImage {
	background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 17.5L11.5 17.5L11.5 18L11.5 22.7929L0.707109 12L11.5 1.20711L11.5 6L11.5 6.5L12 6.5L23.5 6.5L23.5 17.5L12 17.5Z' fill='%23FF3D00' stroke='black'/%3E%3C/svg%3E%0A");
}

.greenUpArrImage {
	background-image: url("data:image/svg+xml,%3Csvg width='25' height='25' viewBox='0 0 25 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.5 7.29289L13 7.29289L13 6.79289L13 2L23.7928 12.7929L13 23.5858L13 18.7929L13 18.2929L12.5 18.2929L0.999954 18.2929L0.999954 7.29289L12.5 7.29289Z' fill='%2333FF00' stroke='black'/%3E%3C/svg%3E%0A");
}

.whiteInfoImage {
	background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.25 9.66667H8.75V10.1667V12V12.5H9.25H10.5833V17.5V18H11.0833H12.9167H13.4167V17.5V10.1667V9.66667H12.9167H9.25ZM12 9.0625C12.9086 9.0625 13.6458 8.32531 13.6458 7.41667C13.6458 6.50802 12.9086 5.77083 12 5.77083C11.0914 5.77083 10.3542 6.50802 10.3542 7.41667C10.3542 8.32531 11.0914 9.0625 12 9.0625ZM12 23.5C18.3509 23.5 23.5 18.3509 23.5 12C23.5 5.64911 18.3509 0.5 12 0.5C5.64911 0.5 0.5 5.64911 0.5 12C0.5 18.3509 5.64911 23.5 12 23.5ZM12 3.33333C16.7784 3.33333 20.6667 7.22164 20.6667 12C20.6667 16.7784 16.7784 20.6667 12 20.6667C7.22164 20.6667 3.33333 16.7784 3.33333 12C3.33333 7.22164 7.22164 3.33333 12 3.33333Z' fill='white' stroke='black'/%3E%3C/svg%3E%0A");
}

/*! skills */

.skills {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: calc(100% - 60rem);
	padding-top: 12rem;
	padding-bottom: 24rem;
}

.skills__title {
	margin: 0;
	margin-bottom: 24rem;
}

.skills__list {
	display: flex;
	flex-direction: column;
	gap: 24rem;
	padding: 0 24rem;
	margin: 0;
	list-style: none;
}

.skills__item {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6rem;
	padding: 6rem;
	font-size: 14rem;
	background-image: linear-gradient(to right bottom, var(--c30), transparent);
}

.skills__item::before {
	position: absolute;
	top: -1px;
	left: -1px;
	display: block;
	width: 12rem;
	height: 12rem;
	content: '';
	clip-path: polygon(0% 0%, 100% 0%, 0% 100%);
	background-color: var(--c60);
}

.skills__title {
	margin: 0;
	text-align: center;
	font-size: 16rem;
	font-weight: 500;
}

.skills__line {
	flex-shrink: 0;
	height: 1px;
	width: 100%;
	background-image: linear-gradient(
		to right,
		transparent,
		var(--c10one),
		transparent
	);
}

.skills__desc {
	margin: 0;
	text-align: center;
	line-height: 1;
	font-style: italic;
}

.skills__needs {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	padding-left: 0;
	margin: 0;
	list-style: none;
}

.skills__needs li {
	padding: 0 10rem;
	flex-shrink: 0;
}

.skills__dopInfoBlock {
	flex-shrink: 0;
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 6rem;
}

.skills__levelTime {
	display: flex;
	flex-direction: column;
	text-align: center;
	margin: 0;
}

@media (min-width: 1000px) {
	.skills {
		top: 100rem;
		left: 330rem;
		width: calc(100% - 330rem);
		height: calc(100% - 100rem);
	}
	.skills__list {
		max-width: 600rem;
		margin: 0 auto;
	}
	.skills__item {
		padding: 6rem 12rem;
	}
}

/*! tableMobileModal */

.tableMobileModal {
	z-index: 2;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 24rem;
	font-size: 16rem;
	background-color: var(--c30);
	transform: translateX(100%);
	transition: all 0.5s ease;
}

.tableMobileModal.active {
	transform: translateX(0);
}

.tableMobileModal__close {
	position: absolute;
	top: 20rem;
	right: 20rem;
}

.tableMobileModal__content {
	display: flex;
	flex-direction: column;
	gap: 24rem;
	width: 100%;
}

.tableMobileModal h2 {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6rem;
	text-align: center;
	margin: 0;
	font-size: 18rem;
	font-weight: 400;
}

.tableMobileModal h2 img {
	display: block;
	width: 34rem;
	height: 34rem;
}

.tableMobileModal a {
	color: var(--c10two);
	display: block;
	text-align: center;
}

.tableMobileModal__content button {
	display: inline-block;
	padding: 10rem;
	border: 0;
	background-color: transparent;
	font-size: 40rem;
	line-height: 40rem;
}

.tableMobileModal__dopInfo,
.tableMobileModal__cancel {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6rem;
}

.tableMobileModal__vote {
	display: flex;
	gap: 50rem;
	margin: 0 auto;
}

.tableMobileModal__decorLine {
	height: 1px;
	margin: 0 12rem;
	background-image: linear-gradient(
		to right,
		transparent,
		var(--c10one),
		transparent
	);
}

/*! goverGuysModal */

.goverGuysModal {
	z-index: 2;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
    justify-content: space-evenly;
	padding: 12rem;
	background-color: var(--c60);
	font-size: 14rem;
	line-height: 1;
	transform: translateX(-100%);
	transition: transform 0.5s ease;
}

.goverGuysModal.active {
	transform: translateX(0);
}

.goverGuysModal__close {
	position: absolute;
	top: 20rem;
	right: 20rem;
}

#gover__modal-open {
	transition: all 0.3s ease;
	cursor: pointer;
}

#gover__modal-open:hover {
	filter: drop-shadow(0 0 5rem var(--c10two));
}

.goverGuysModal__list {
	display: grid;
	gap: 12rem;
	padding: 0;
	margin: 0;
	list-style: none;
}

.goverGuysModal__item {
	display: flex;
	gap: 24rem;
	align-items: center;
	justify-content: space-between;
	padding: 12rem;
	background-color: var(--c30);
}

.goverGuysModal__item > img {
	display: block;
	width: 80rem;
	height: 80rem;
}

.goverGuysModal__itemText {
	display: grid;
	gap: 18rem;
	flex-grow: 1;
}

.goverGuysModal__itemText > h2 {
	margin: 0;
	line-height: 1;
	font-weight: 500;
	text-align: center;
	font-size: 14rem;
}

.goverGuysModal__itemText-block {
	display: grid;
	gap: 8rem;
    justify-content: center;
}

.goverGuysModal__itemText-block p {
	margin: 0;
	text-align: center;
}

@media (min-width: 1000px) {
	.goverGuysModal {
		top: 100rem;
		left: 330rem;
		width: calc(100% - 330rem);
		height: calc(100% - 100rem);
		padding: 120rem 400rem;
	}
}

/*! procurement */

.procur {
	padding-top: 14rem;
	padding-bottom: 24rem;
	height: calc(100% - 60rem);
	overflow-y: auto;
	overflow-x: hidden;
}

.procur__title {
	margin: 0;
	margin-bottom: 12rem;
	padding: 0 12rem;
	padding-top: 4rem;
	height: max-content;
}

.procur__title i {
	position: relative;
	top: 4rem;
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-style: normal;
	padding: 4rem 0;
}

.procur__list {
	display: grid;
	padding: 0 12rem;
	list-style: none;
	gap: 12rem;
}

.procur__item {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 12rem;
	background-color: var(--c30);
	padding: 12rem;
}

.procur__item::before,
.procur__item::after {
	position: absolute;
	top: -1px;
	left: -1px;
	display: block;
	width: 12rem;
	height: 12rem;
	content: '';
	background-color: var(--c60);
	clip-path: polygon(0 0, 100% 0, 0 100%);
	pointer-events: none;
}

.procur__item::after {
	top: initial;
	left: initial;
	bottom: -1px;
	right: -1px;
	transform: scale(-1);
}

.procur__item .gover__decorLine {
	position: relative;
	width: 100%;
	margin: 0;
	top: -1rem;
}

.procur__itemInfoBlock {
	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12rem;
	font-size: 14rem;
	width: 100%;
}

.procur__itemInfoBlock p {
	margin: 0;
	display: flex;
	gap: 4rem;
	flex-direction: column;
}

.procur__itemInfoBlock span:last-of-type {
	color: var(--c10two);
}

.procur__itemInfoBlock img {
	display: block;
	width: 32rem;
	height: 32rem;
}

.procur__itemRow {
	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 14rem;
	color: var(--c10one);
	width: 100%;
	gap: 4rem;
}

.procur__itemRow > label {
	position: relative;
	height: 24rem;
	width: 120rem;
}

.procur__itemRow > label::before {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	content: '';
	border: 1px solid var(--c10one);
	opacity: 0.25;
	pointer-events: none;
}

.procur__itemRow > label input {
	display: block;
	width: 100%;
	font-size: 14rem;
	line-height: 24rem;
	color: var(--c10one);
	padding: 0 4rem;
	background-color: transparent;
	border: 0;
}

.procur__itemRow > button {
	color: var(--c60);
	background-color: var(--c10two);
	border: 0;
	height: 24rem;
	line-height: 24rem;
}

@media (min-width: 1000px) {
	.procur {
		padding-top: 14rem;
		padding-bottom: 72rem;
		margin-top: 100rem;
		height: calc(100% - 100rem);
		margin-left: 330rem;
	}
	.procur__list {
		display: flex;
		flex-wrap: wrap;
		align-content: center;
		justify-content: center;
		margin: 0 auto;
		gap: 12rem;
		max-width: 1040rem;
	}
}

/*! rank-edit-modal */

.rank-edit {
	z-index: 4;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: none;
	justify-content: center;
	align-items: center;
}

.rank-edit.active {
	display: flex;
}

.rank-edit__overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.8);
}

.rank-edit__content {
	position: relative;
	background-color: var(--c30);
	padding: 24rem;
	width: 300rem;
	height: max-content;
	display: flex;
	flex-direction: column;
}

.rank-edit__textarea {
	position: relative;
	height: 100rem;
	padding: 12rem;
	background-color: transparent;
	font-size: 14rem;
	color: var(--c10one);
	resize: none;
	outline: none;
}

.rank-edit__textarea::after {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	content: '';
	border: 1px solid var(--c10one);
	pointer-events: none;
	opacity: 0.75;
}

.rank-edit__textarea:focus::after {
	opacity: 1;
}

.rank-edit__title {
	font-size: 14rem;
	text-align: center;
	margin: 0;
	font-weight: normal;
	margin-bottom: 12rem;
}

.rank-edit__save {
	margin-top: 12rem;
	align-self: center;
}

.rank-edit__delete {
	align-self: center;
}

@media (min-width: 1000px) {
	.rank-edit {
		top: 100rem;
		left: 330rem;
		width: calc(100vw - 330rem);
		height: calc(100vh - 100rem);
	}
}

/*! login */

.login {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-top: 31rem;
	padding-bottom: 12rem;
	background-color: var(--c60);
	font-size: 14rem;
	overflow-x: hidden;
}

.login__pcBg {
	position: absolute;
	top: 0;
	left: 0;
	display: none;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

.login__wrapper {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	background-color: var(--c60);
}

.login__wrapper--mini {
	width: 300rem;
}

.login__logo {
	position: relative;
	display: block;
	width: 258rem;
}

.login__logoWrapper {
	position: relative;
	margin-bottom: 32rem;
}

.login__logoWrapper h3 {
	position: absolute;
	top: -24rem;
	left: 50%;
	transform: translateX(-50%);
	margin: 0 auto;
	width: max-content;
	border: 1px solid var(--c10two);
	font-weight: 400;
	font-size: 36rem;
	line-height: 44rem;
	padding: 0 10rem;
	color: var(--c10two);
	text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
}

.login__logoWrapper::before,
.login__h2Title::before {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) rotate(-2deg);
	display: block;
	width: 110vw;
	height: 50rem;
	content: '';
	background-color: var(--c30);
}

.login__title {
	margin: 0;
	margin-bottom: 30rem;
	font-size: 14rem;
	line-height: 18rem;
	text-align: center;
	font-weight: 400;
}

.login__h2Title {
	width: 100%;
	height: 120rem;
	padding-top: 36rem;
	text-align: center;
	position: relative;
	overflow-x: hidden;
	margin: 0;
	font-weight: 400;
	font-size: 36rem;
	line-height: 44rem;
	color: var(--c10two);
	text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
}

.login__h2Title span {
	position: relative;
}

.login__title span {
	color: var(--c10two);
}

.login__text {
	margin: 0;
	font-size: 14rem;
	line-height: 18rem;
	text-align: center;
}

.login__links {
	position: relative;
	display: flex;
	justify-content: space-around;
	align-items: center;
	gap: 33rem;
	margin-top: -20rem;
	width: 100%;
	margin-bottom: 0;
	padding: 0 24rem;
}

.login__links span {
	z-index: 1;
	position: relative;
	font-size: 24rem;
	line-height: 1;
	color: var(--c10two);
}

.login__links a {
	z-index: 1;
	position: relative;
	display: block;
	width: 80rem;
	height: 80rem;
	cursor: pointer;
	transition: all 0.3s ease;
}

.login__links a:hover {
	filter: drop-shadow(0 0 5rem var(--c10two));
}

.login__links svg {
	display: block;
	width: 100%;
	height: 100%;
}

.login__rights,
.login__pcRights {
	font-size: 10rem;
	line-height: 12rem;
	text-align: center;
	color: var(--c10two);
}

 .login__pcRights {
	margin-top: 15rem;
}

.login__rights a,
.login__pcRights a {
	text-decoration: underline;
	color: inherit;
}

.map-bg {
	height: auto;
	overflow-y: initial;
	overflow-x: hidden;
}

.login__grid {
	display: flex;
	gap: 38rem;
	margin-bottom: 20rem;
}

.login__socLinks {
	list-style: none;
	display: grid;
	gap: 36rem;
	padding: 12rem;
	padding-top: 0;
}

.login__socLinks li a {
	display: flex;
	align-items: center;
	font-size: 14px;
	gap: 6rem;
}

.login__socLinks a {
	color: var(--c10one);
}

.login__socLinks a b {
	color: var(--c10two);
	font-weight: 400;
}

#vk_groups {
	margin-top: 20rem;
}

.login__wrapper--mini {
	z-index: 2;
	position: fixed;
	inset: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	padding-top: 50rem;
	pointer-events: none;
	transition: opacity 0.5s ease;
}

.login__wrapper--mini.active {
	opacity: 1;
	pointer-events: all;
}

.login__popupBtns {
	display: flex;
	gap: 24rem;
	width: 100%;
	padding: 0 24rem;
}

.login__popupBtns button {
	border: 1px solid var(--c10two);
	color: var(--c10two);
	padding: 0 12rem;
	font-size: 14rem;
	line-height: 24rem;
	text-align: center;
	flex-grow: 1;
	background-color: transparent;
}

.login__wrapperClose {
	z-index: 2;
	position: absolute;
	top: 30rem;
	right: 20rem;
	border: 0;
	background-color: transparent;
	padding: 0;
}

@media (min-width: 1000px) {
	.map-bg {
		min-height: 100vh;
		padding: 0;
	}
	.login {
		padding-top: 50rem;
		padding-bottom: 25rem;
		background-color: transparent;
		min-height: 100vh;
		font-size: 16rem;
	}
	.login__pcBg {
		display: block;
	}
	.login__grid {
		padding: 0;
		margin-bottom: 0;
	}
	.login__logoWrapper h3 {
		position: absolute;
		top: 36rem;
	}
	#vk_groups {
		margin-top: -18rem;
	}
	.login__wrapperClose {
		display: none;
	}
	.login__popupBtns {
		display: none;
	}
	.login__wrapper {
		margin-bottom: 30rem;
		width: calc(100vw - 602px - 180rem);
		padding-bottom: 10rem;
		border: 1px solid var(--c30);
	}
	.login__wrapper--mini {
		width: 302px;
		position: relative;
		height: initial;
		opacity: 1;
		pointer-events: all;
		padding-top: 0;
	}
	.login__title {
		margin-bottom: 20rem;
	}
	.login__logoWrapper {
		width: calc(100% + 2px);
		height: 120rem;
		overflow-x: hidden;
		margin-top: -51rem;
		margin-left: 0;
		margin-bottom: -5rem;
	}
	.login__logo {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		display: block;
		width: 258rem;
		height: 59rem;
		background-color: var(--c30);
	}
	.login__links {
		overflow-x: hidden;
		height: 150rem;
		padding: 10rem 150rem;
	}
	.login__links a {
		width: 120rem;
		height: 120rem;
	}
	.login__links span {
		font-size: 30rem;
	}
	.login__rights {
		display: none;
	}
	.login__pcRights {
		display: block;
	}
	br.noPC {
		display: none;
	}
}

/*! lSlider */

.lSlider {
	position: relative;
	margin-bottom: 20rem;
	width: 100%;
	overflow-x: hidden;
}

.lSlider__list {
	display: flex;
	gap: 18rem;
	margin: 0;
	padding: 0 12rem;
	padding-bottom: 20rem;
	list-style: none;
	width: 100%;
	overflow-x: auto;
}

.lSlider__item {
	flex-shrink: 0;
}

.lSlider__btn {
	display: block;
	width: 91rem;
	height: 204rem;
	padding: 0;
	background-color: transparent;
	border: 0;
	cursor: pointer;
	transition: all 0.3s ease;
}

.lSlider__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	border: 2px solid var(--c10two);
}

@media (min-width: 1000px) {
	.lSlider {
		margin-bottom: 0;
		overflow: initial;
	}
	.lSlider__btn {
		width: 340rem;
		height: 192rem;
	}
	.lSlider__list {
		display: flex;
		gap: 46rem;
		width: max-content;
		margin: 0 auto;
		padding: 0;
	}
	.lSlider__btn:hover {
		filter: drop-shadow(0 0 10rem var(--c10two));
	}
}

/*! popupSlider */

.popupSlider {
	z-index: 1;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	pointer-events: none;
	background-color: var(--c60);
	transition: opacity 0.5s ease;
}

.popupSlider button {
	cursor: pointer;
}

.popupSlider.active {
	opacity: 1;
	pointer-events: all;
}

.popupSlider__list {
	display: flex;
	transition: all 0.5s ease;
	padding-left: 0;
	list-style: none;
	height: 100%;
	margin: 0;
}

.popupSlider__item {
	flex-shrink: 0;
	width: 100vw;
}

.popupSlider__item picture {
	display: block;
	width: 100%;
	height: 100%;
	background-color: #000;
}

.popupSlider__item img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
}

.popupSlider__close {
	position: absolute;
	top: 20rem;
	right: 20rem;
	width: 40rem;
	height: 40rem;
	padding: 0;
	background-color: transparent;
	border: 0;
}

.popupSlider__close svg {
	display: block;
	width: 100%;
	height: 100%;
	filter: drop-shadow(0 0 5rem #000);
}

.popupSlider__left {
	position: absolute;
	top: 50%;
	transform: translateY(-50%) scaleX(-1);
	left: 12rem;
	width: 40rem;
	height: 40rem;
	padding: 0;
	background-color: transparent;
	border: 0;
}

.popupSlider__right {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: 12rem;
	width: 40rem;
	height: 40rem;
	padding: 0;
	background-color: transparent;
	border: 0;
}

.popupSlider__left svg,
.popupSlider__right svg {
	display: block;
	width: 100%;
	height: 100%;
	filter: drop-shadow(0 0 5rem #000);
}

.popupSlider__left:disabled,
.popupSlider__right:disabled {
	opacity: 0.5;
	filter: grayscale(1);
	filter: drop-shadow(0 0 0 #fff);
}

/*! ct__btn-half-screen */

.ct__btn-half-screen {
	display: block;
	width: 156rem;
	height: 24rem;
	border: 0;
	padding: 0;
	font-weight: 400;
	font-size: 12rem;
	line-height: 24rem;
	text-align: center;
	background-color: var(--c10two);
	color: var(--c60);
}

/*! tlist */

.tlist {
	padding-top: 24rem;
	display: grid;
	grid-template-rows: 24rem 1fr;
	gap: 24rem;
	height: calc(100% - 60rem);
}

.tlist__buttons {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 6rem;
	padding: 0 12rem;
	transform: scale(0.77);
	transform-origin: left top;
}

.tlist__tab-container {
	width: 100vw;
	padding-bottom: 24rem;
}

.tlist__tab {
	display: none;
}

.tlist__tab.active {
	display: block;
}

@media (min-width: 1000px) {
	.tlist {
		display: block;
		height: calc(100vh - 100rem);
		margin-left: 330rem;
		margin-top: 100rem;
	}
	.tlist__buttons {
		display: none;
	}
	.tlist__tab-container {
		display: grid;
		grid-template-columns: 1fr 1fr 1fr;
		gap: 32rem;
		width: calc(100vw - 330rem);
		padding-bottom: 0;
		margin: 0 auto;
	}
	.tlist__tab {
		display: block;
		height: initial;
	}
}

/*! .ct__view-info */

.ct__view-info {
	position: relative;
	width: 336rem;
	height: 46rem;
	padding-top: 2rem;
	background-image: linear-gradient(
		to right,
		transparent,
		var(--c30),
		transparent
	);
}

.ct__view-info h2 {
	position: relative;
	margin: 0;
	margin-bottom: 3rem;
	padding-bottom: 2rem;
	font-weight: 400;
	font-size: 18rem;
	line-height: 18rem;
	text-align: center;
	letter-spacing: -0.04em;
	color: var(--c10one);
}

.ct__view-info h2::after {
	position: absolute;
	left: 0;
	bottom: 0;
	display: block;
	width: 100%;
	height: 1px;
	background-image: linear-gradient(
		to right,
		transparent,
		var(--c10one),
		transparent
	);
	content: '';
}

.ct__view-info-list {
	padding-left: 46rem;
	padding-right: 4rem;
	display: flex;
	justify-content: space-between;
	list-style: none;
}

.ct__view-info-item {
	display: flex;
	align-items: center;
}

.ct__view-info-item svg {
	display: block;
	height: 14rem;
	width: auto;
	margin-top: -3rem;
	margin-right: 4rem;
}

.ct__view-info-item span {
	font-weight: 400;
	font-size: 14rem;
	line-height: 14rem;
	text-align: center;
	letter-spacing: -0.04em;
	color: var(--c10one);
}

.ct__view-info-image {
	display: block;
	position: absolute;
	top: 5rem;
	left: 6rem;
	width: 34rem;
	height: 34rem;
	object-fit: contain;
	object-position: center;
}

.ct__view-info-image.rotate {
	animation: rotate-planet 60s linear infinite;
}

@keyframes rotate-planet {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}

/*! search-modal */

.search-modal {
	z-index: 10;
	display: flex;
	flex-direction: column;
	width: 100vw;
	height: 100%;
	padding: 0 24rem;
	padding-bottom: 24rem;
	background-color: var(--c60);
	transition: all 0.3s ease;
}

.search-modal.movable {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	transform: translateX(101%);
}

.search-modal.movableLeft {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	transform: translateX(-101%);
}

.search-modal.active {
	transform: translateX(0);
}

.search-modal__wrapper {
	height: max-content;
	margin: auto 0;
	display: flex;
	flex-direction: column;
}

.search-modal__wrapper--buy {
	gap: 16rem;
}

.search-modal__wrapper h2 {
	margin: 0;
	margin-bottom: 20rem;
	font-weight: 400;
	font-size: 18rem;
	line-height: 20rem;
	text-align: center;
	letter-spacing: -0.04em;
	color: var(--c10one);
}

.search-modal__wrapper h2 span {
	display: block;
	margin-top: 12rem;
	color: var(--c10two);
}

.search-modal__wrapper h3 {
	margin: 0;
	margin-bottom: 6rem;
	font-weight: 400;
	font-size: 16rem;
	line-height: 16rem;
	letter-spacing: -0.04em;
	color: var(--c10one);
}

.search-modal__wrapper h4 {
	margin: 0;
	margin-bottom: 20rem;
	font-weight: 400;
	font-size: 16rem;
	line-height: 1.2;
	letter-spacing: -0.04em;
	color: var(--c10one);
	text-align: center;
}

.search-modal__wrapper p {
	margin: 0;
	margin-bottom: 20rem;
	font-weight: 400;
	font-size: 16rem;
	line-height: 20rem;
	text-align: center;
	letter-spacing: -0.04em;
	color: var(--c10one);
}

.search-modal__label {
	margin-bottom: 20rem;
}

.search-modal__label--no {
	margin-bottom: 0;
}

.search-modal__label-multi {
	position: relative;
	margin-bottom: 20rem;
}

.search-modal__label-multi::before {
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	width: 100%;
	height: 100%;
	content: '';
	opacity: 0.3;
	pointer-events: none;
	border: 1px solid var(--c10one);
}
.search-modal__label-multi select {
	font-weight: 400;
	font-size: 16rem;
	line-height: 20rem;
	padding: 0 12rem;
	letter-spacing: -0.05em;
	color: var(--c10one);
	background-color: transparent;
	border: none;
	width: 100%;
}

.search-modal__confirm-btn {
	align-self: center;
}

.search-modal__amount {
	display: flex;
	align-items: center;
	margin-bottom: 20rem;
}

.search-modal__amount span {
	flex-shrink: 0;
	width: 110rem;
	margin-right: 6rem;
	padding-left: 12rem;
	font-weight: 400;
	font-size: 16rem;
	line-height: 16rem;
	letter-spacing: -0.05em;
	color: var(--c10one);
}

.search-modal__amount-label {
	flex-shrink: 0;
	display: block;
	position: relative;
	width: 120rem;
	height: 30rem;
}

.search-modal__amount-label::before {
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	width: 100%;
	height: 100%;
	border: 1px solid var(--c10one);
	opacity: 0.3;
	content: '';
	pointer-events: none;
}

.search-modal__amount-label input {
	display: block;
	width: 100%;
	height: 100%;
	padding: 12rem 0;
	border: 0;
	font-weight: 400;
	font-size: 16rem;
	line-height: 16rem;
	letter-spacing: -0.05em;
	color: var(--c10one);
	background-color: transparent;
}

.search-modal__price {
	display: flex;
	align-items: center;
	margin-bottom: 20rem;
}

.search-modal__price span {
	width: 110rem;
	margin-right: 6rem;
	padding-left: 12rem;
	font-weight: 400;
	font-size: 16rem;
	line-height: 16rem;
	letter-spacing: -0.05em;
	color: var(--c10one);
}

.search-modal__price-label {
	position: relative;
	width: 120rem;
	height: 30rem;
}

.search-modal__price-label::before {
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	width: 100%;
	height: 100%;
	border: 1px solid var(--c10one);
	opacity: 0.3;
	content: '';
	pointer-events: none;
}

.search-modal__price-label input {
	display: block;
	width: 100%;
	height: 100%;
	padding: 12rem 0;
	border: 0;
	font-weight: 400;
	font-size: 16rem;
	line-height: 16rem;
	letter-spacing: -0.05em;
	color: var(--c10one);
	background-color: transparent;
}

.search-modal__withImg {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 16rem;
}

.search-modal__withImg-right {
	display: flex;
	align-items: center;
	gap: 12rem;
}

.search-modal__withImg-img {
	display: block;
	width: 34rem;
	height: 34rem;
}

.search-modal__twoText {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 16rem;
}

.search-modal__withInput {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 16rem;
}

.search-modal__withInput-input {
	background-color: transparent;
	width: 100rem;
	padding: 0 8rem;
	font-size: 16rem;
	color: var(--c10two);
	background-color: transparent;
	text-align: right;
	border: 0;
	border-bottom: 1px solid var(--c10two);
}

.search-modal__withInput--margin {
	margin-bottom: 20rem;
}

.search-modal__withInput--margin .search-modal__withInput-input {
	margin-left: auto;
}

.search-modal__twoText--colored {
	color: var(--c10two);
}

@media (min-width: 1000px) {
	.search-modal {
		width: calc(100vw - 330rem);
		height: calc((100vh - 110rem));
		margin-top: 100rem;
		margin-left: 330rem;
		align-items: center;
	}
	.search-modal__wrapper {
		margin: auto 0;
		width: 312rem;
	}
}

/*! map */

.map {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: calc(100% - 60rem);
	overflow-x: hidden;
	display: flex;
	flex-direction: column;
}

.map__leaflet-container {
	width: 100%;
	height: 100%;
	flex-grow: 1;
}

.map__plane-icon {
	filter: drop-shadow(0 0 0 var(--c10two));
}

.map__plane-icon--player {
	animation: map-plane-glow 5s ease-in-out infinite;
}

@keyframes map-plane-glow {
	0% { filter: drop-shadow(0 0 0 var(--c10two)); }
	20% { filter: drop-shadow(0 0 0 var(--c10two)); }
	40% { filter: drop-shadow(0 0 12rem var(--c10two)); }
	60% { filter: drop-shadow(0 0 22rem var(--c10two)); }
	70% { filter: drop-shadow(0 0 22rem var(--c10two)); }
	85% { filter: drop-shadow(0 0 8rem var(--c10two)); }
	100% { filter: drop-shadow(0 0 0 var(--c10two)); }
}

.map__tops {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 60rem;
	background-color: var(--c30);
	padding-top: 9rem;
	padding-left: 12rem;
	padding-right: 64rem;
}

.map__tops.active {
	display: block;
}

.map__top {
	display: none;
}

.map__top.active {
	display: block;
}

.map__top h2 {
	margin: 0;
	margin-bottom: 3rem;
	font-weight: 400;
	font-size: 12rem;
	line-height: 14rem;
	text-align: center;
	letter-spacing: -0.04em;
}

.map__top-bar {
	height: 8rem;
	width: 100%;
	margin-bottom: 4rem;
	background-image: linear-gradient(to right, #C0C0C0, #01fe21);
}

.map__top-text {
	margin: 0;
	display: flex;
	justify-content: space-between;
	font-weight: 400;
	font-size: 12rem;
	line-height: 14rem;
}

.map__filter-open {
	position: absolute;
	top: 10rem;
	right: 12rem;
	width: 40rem;
	height: 40rem;
	padding: 0;
	background: none;
	border: 0;
}

.map__filter-open svg {
	width: 100%;
	height: 100%;
}

.map__modfilter {
	position: absolute;
	top: 60rem;
	left: 0;
	width: 100%;
	display: none;
	align-items: flex-start;
	padding-left: 80rem;
	flex-direction: column;
	padding-top: 45rem;
}

.map__modfilter.active {
	display: flex;
	background: var(--c30);
}

.map__info {
	position: absolute;
	bottom: 0;
	left: 0;
	display: flex;
	align-items: center;
	width: 100%;
	height: 60rem;
	padding: 0 0rem;
	background-image: linear-gradient(to right, var(--c60), var(--c30));
}

.map__info--fly {
	gap: 3rem;
	justify-content: space-between;
}

.map__info > img {
	display: block;
	width: 50rem;
	height: 50rem;
}

.map__info--fly > img:last-of-type {
	width: 60rem;
	height: 60rem;
}

.map__info-mid {
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	padding: 0px 11rem;
}

.map__info-mid-text {
	display: flex;
	flex-direction: column;
	gap: 8rem;
	align-items: center;
}
.map__info-mid-text img {
	display: inline-block;
	width: 20rem;
	height: 20rem;
	margin-top: -4rem;
	margin-bottom: -4rem;
}
.map__info-mid-text p {
	margin: 0;
	font-size: 12rem;
	line-height: 1;
	text-align: center;
}

.map__info-mid h2 {
	margin: 0;
	font-weight: 400;
	font-size: 12rem;
	line-height: 14rem;
	text-align: center;
}

.map__info-mid-botttom {
	display: flex;
}

.map__info-list {
	padding-left: 0;
	padding-top: 2rem;
	margin: 0;
	list-style: none;
	display: flex;
	margin-right: 16rem;
}

.map__info-item {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.map__info-item:not(:last-of-type) {
	margin-right: 20rem;
}

.map__info-item img {
	display: block;
	width: 16rem;
	height: 16rem;
	margin-bottom: 1rem;
}

.map__info-item span {
	font-weight: 500;
	font-size: 8rem;
	line-height: 11rem;
}

.map__info-btn-block {
	padding-top: 2rem;
	display: flex;
	flex-wrap: wrap;
	width: 94rem;
	justify-content: space-around;
}

.map__info-btn-block > button {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 94rem;
	height: 17.5rem;
	padding: 0;
	border: 0;
	background-color: var(--c10two);
	color: var(--c60);
	font-size: 8rem;
	line-height: 1;
	margin-bottom: 5rem;
}

.map__info-btn-time {
	display: flex;
	align-items: center;
	font-weight: 500;
	font-size: 8rem;
	line-height: 10rem;
}

.map__info-btn-time svg {
	width: 10rem;
	height: 10rem;
	margin-right: 4rem;
}

.map__info-btn-cost {
	display: flex;
	align-items: center;
	font-weight: 500;
	font-size: 8rem;
	line-height: 10rem;
}

.map__info-btn-cost svg {
	width: 6rem;
	height: 10rem;
	margin-right: 4rem;
}

@media (min-width: 1000px) {
	.map {
		margin-top: 100rem;
		margin-left: 330rem;
		height: calc(100vh - 100rem);
		width: calc(100vw - 330rem);
	}
	.map__info {
		width: 360rem;
		top: 0;
		left: 0;
		bottom: initial;
		transform: scale(1.5);
		transform-origin: top left;
	}
	.map__modfilter {
		top: 90rem;
		left: initial;
		right: 0;
		width: 360rem;
	}
	.map__tops {
		width: 360rem;
		transform: scale(1.5);
		left: initial;
		right: 0;
		transform-origin: top right;
	}
}

/*! translate  */

.translate {
	padding-top: 14rem;
	padding-bottom: 24rem;
	height: calc(100% - 60rem);
	overflow-y: auto;
	overflow-x: hidden;
	font-size: 14rem;
}

.translate__title {
	margin: 0;
	margin-bottom: 24rem;
}

.translate__wrapper {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 50rem;
	margin-bottom: 24rem;
}

.translate__checkbox {
	margin-bottom: 0 !important;
}

.translate table {
	border-collapse: collapse;
	width: 100%;
}

.translate table textarea {
	display: block;
	width: 100%;
	resize: none;
	background-color: transparent;
	color: var(--c10one);
}

.translate table th {
	font-weight: 400;
	background-color: var(--c30);
	height: 24rem;
}

.translate table td {
	padding: 6rem;
}

.translate table.odd td {
	padding: 0;
}

.translate table a {
	display: block;
	color: var(--c10one);
	width: 100%;
	padding: 8rem;
}

.translate table tr:nth-of-type(even) {
	background-color: var(--c30);
}

.translate table.odd tr:nth-of-type(even) {
	background-color: transparent;
}

.translate table.odd tr:nth-of-type(odd) {
	background-color: var(--c30);
}

.translate__selectContainer {
	width: 336rem;
	margin: 0 auto;
	margin-bottom: 24rem;
}

@media (min-width: 1000px) {
	.translate {
		margin-top: 100rem;
		margin-left: 330rem;
		width: calc(100vw - 330rem);
		height: calc(100vh - 100rem);
	}
}

/*! edu */

.edu {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	font-size: 14rem;
	pointer-events: none;
	opacity: 0;
	transition: opacity 0.3s ease;
	color: var(--c10one);
}

.edu.active {
	pointer-events: all;
	opacity: 1;
}

.edu__content {
	position: absolute;
	bottom: 60rem;
	left: 0;
	width: 100%;
	height: max-content;
	padding: 18rem;
	padding-top: 62rem;
	background-image: linear-gradient(
		to right,
		rgba(0, 0, 0, 1),
		rgba(0, 0, 0, 0.75)
	);
	pointer-events: none;
	opacity: 0;
	transition: opacity 0.2s ease;
}

.edu__content.active {
	opacity: 1;
	pointer-events: all;
}

.edu__img {
	position: absolute;
	top: -50rem;
	left: 50%;
	transform: translateX(-50%);
	width: 100rem;
	height: 100rem;
	border: solid 2rem var(--c10two);
}

.edu__text {
	margin: 0;
	margin-bottom: 12rem;
	line-height: 1.3;
}

.edu__btns {
	display: flex;
	justify-content: space-between;
	width: 100%;
	gap: 12rem;
	margin-bottom: 12rem;
}

.edu__btn {
	flex-grow: 1;
	border: 0;
	background-color: var(--c10two);
	color: var(--c60);
	line-height: 30rem;
	text-align: center;
	padding: 0;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.3s ease;
	cursor: pointer;
}

.edu__btn.active {
	pointer-events: all;
	opacity: 1;
}

.edu__btn:disabled {
	cursor: default;
}

.edu__rewardImg {
	margin: 0 auto;
	margin-bottom: 12rem;
	width: 60rem;
	height: 60rem;
}

.edu__dont {
	display: block;
	width: 100%;
	text-decoration: underline;
	color: var(--c10two);
	text-align: center;
	margin: 0;
	padding: 0;
	border: 0;
	background-color: transparent;
	cursor: pointer;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.3s ease;
	cursor: pointer;
}

.edu__dont.active {
	pointer-events: all;
	opacity: 1;
}

.edu__dont:disabled {
	cursor: default;
}

.edu__glow {
	position: absolute;
	cursor: pointer;
	animation: edu-glow 0.75s ease-in-out infinite both !important;
}

.edu__glow.click::after {
	position: absolute;
	right: -4rem;
	bottom: -10rem;
	display: block;
	width: 30rem;
	height: 30rem;
	content: '';
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	background-image: url('../img/click.gif');
}

.edu-glow {
	animation: edu-glow 0.75s ease-in-out infinite both !important;
}

@keyframes edu-glow {
	0% {
		box-shadow: 0 0 5rem 0 var(--c10one);
	}
	50% {
		box-shadow: 0 0 10rem 0 var(--c10one);
	}
	100% {
		box-shadow: 0 0 5rem 0 var(--c10one);
	}
}

@media (min-width: 1000px) {
	.edu {
		z-index: 9999;
	}
	.edu__content {
		left: 50%;
		bottom: initial;
		top: 50%;
		transform: translate(-50%, -50%);
		width: 600rem;
	}
}

/*! shop */

.shop {
	padding-top: 14rem;
	padding-bottom: 24rem;
	height: calc(100% - 60rem);
	overflow-y: auto;
	overflow-x: hidden;
}

.shop__title {
	margin: 0;
	margin-bottom: 24rem;
}

.shop__tabs {
	padding-left: 0;
	list-style: none;
	width: 336rem;
	overflow-x: auto;
	overflow-y: hidden;
	display: flex;
}

.shop__tabs li {
	flex-shrink: 0;
}

.shop__tab {
	flex-shrink: 0;
	position: relative;
	display: flex;
	height: 36rem;
	padding: 0;
	padding-right: 6rem;
	background-color: var(--c60);
	transition: all 0.5s ease;
	border: 0;
	cursor: pointer;
}

.shop__tab img {
	flex-shrink: 0;
	display: block;
	width: 36rem;
	height: 36rem;
	margin-right: 6rem;
}

.shop__tab span {
	flex-shrink: 0;
	font-weight: 400;
	font-size: 18rem;
	line-height: 36rem;
	letter-spacing: -0.04em;
	color: var(--c10one);
	transition: all 0.5s ease;
}

.shop__tab::before {
	position: absolute;
	top: -1px;
	right: -1px;
	display: block;
	width: 8rem;
	height: 8rem;
	content: '';
	background-color: var(--c60);
	clip-path: polygon(0 0, 100% 0, 100% 100%);
}

.shop__tab.active {
	background-color: var(--c10two);
}

.shop__tab.active span {
	color: var(--c60);
}

.shop__container {
	display: flex;
	flex-direction: column;
	gap: 12rem;
	padding: 0 12rem;
}

.shop__stickersBlock {
	display: none;
	flex-direction: column;
	gap: 12rem;
}

.shop__stickersBlock.active {
	display: flex;
}

.shop__stickersList {
	display: flex;
	flex-wrap: wrap;
	gap: 2rem;
	justify-content: space-between;
	overflow-y: auto;
	padding-left: 0;
	list-style: none;
}

.shop__stickersInfo {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 12rem;
	font-size: 14rem;
	padding: 12rem;
	background-color: var(--c30);
}

.shop__line {
	height: 1px;
	background-image: linear-gradient(
		to right,
		transparent,
		var(--c10one),
		transparent
	);
}

.shop__stickersInfo::after {
	position: absolute;
	top: -1px;
	right: -1px;
	display: block;
	width: 12rem;
	height: 12rem;
	content: '';
	background-color: var(--c60);
	clip-path: polygon(0% 0%, 100% 0%, 100% 100%);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
}

.shop__stickersText {
	display: flex;
	flex-direction: column;
	gap: 6rem;
}

.shop__stickersText p {
	margin: 0;
}

.shop__stickersText a {
	text-decoration: underline;
	color: var(--c10two);
}

.shop__stickersBuy {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6rem;
}

.shop__stickersBuy h3 {
	margin: 0;
	font-weight: 400;
	font-size: 14rem;
}

.shop__stick {
	display: block;
	width: 82.5rem;
	height: 82.5rem;
	padding: 0;
	border: 0;
	background-color: transparent;
}

.shop__stick img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
}

@media (min-width: 1000px) {
	.shop {
		padding-top: 14rem;
		padding-bottom: 72rem;
		margin-top: 100rem;
		height: calc(100% - 100rem);
		margin-left: 330rem;
	}
	.shop__tabs {
		width: 100%;
	}
	.shop__stickersInfo {
		flex-direction: row;
		justify-content: space-between;
	}
	.shop__line {
		display: none;
	}
	.shop__stickersList {
		gap: 12rem;
		justify-content: flex-start;
	}
	.shop__stick {
		display: block;
		width: 166rem;
		height: 166rem;
		padding: 0;
		border: 0;
		background-color: transparent;
	}
}

/*! box */

@keyframes fadeOut {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

.box {
	padding-top: 14rem;
	padding-bottom: 24rem;
	height: calc(100% - 60rem);
	overflow-y: auto;
	overflow-x: hidden;
	font-size: 14rem;
}

.box__title {
	margin: 0;
	margin-bottom: 24rem;
}

.box__tabs {
	margin-bottom: 24rem;
}

.box__block {
	display: none;
	flex-direction: column;
}

.box__block.active {
	display: flex;
	animation: fadeOut 1s ease both;
}

.box__desc {
	margin: 0;
	margin-bottom: 24rem;
	padding: 0 24rem;
	text-align: center;
	line-height: 1.5;
}

.box__pic {
	position: relative;
	display: block;
	width: 312rem;
	height: 207rem;
	margin: 0 24rem;
	margin-bottom: 24rem;
}

.box__picChestCount {
	margin: 0;
	font-size: 18rem;
	line-height: 1;
}

.box__picChestCount--count {
	color: var(--c10two);
}

.box__pic > img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

.box__picBtn {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	flex-direction: column;
	justify-content: center;
	gap: 24rem;
	padding: 30rem 24rem;
	border: 0;
	color: var(--c10one);
	background-color: transparent;
}

.box__picBtns {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	flex-direction: column;
	justify-content: center;
	gap: 16rem;
	padding: 30rem 24rem;
}

.box__list {
	padding: 0 24rem;
	list-style: none;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 12rem;
}

.box__list--modal {
	gap: 6rem;
}

.box__item {
	display: flex;
	align-items: center;
	gap: 12rem;
}

.box__item > svg,
.box__item > img {
	display: block;
	width: 60rem;
	height: 60rem;
	object-fit: contain;
	object-position: center;
}

.box__itemBlock {
	display: flex;
	flex-direction: column;
	gap: 12rem;
	flex-grow: 1;
}

.box__itemBlock > h2 {
	position: relative;
	width: 100%;
	margin: 0;
	font-weight: 400;
	font-size: 14rem;
	line-height: 1.5;
}

.box__itemBlock > h2::after {
	position: absolute;
	bottom: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 1px;
	content: '';
	background-image: linear-gradient(to right, var(--c10one), transparent);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
}

.box__innerList {
	padding-left: 0;
	margin: 0;
	list-style-type: none;
	display: flex;
	justify-content: space-between;
}

.box__buyList {
	display: flex;
	flex-direction: column;
	gap: 24rem;
	padding: 0 12rem;
	margin: 0;
	list-style: none;
}

.box__buyItem {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.box__buyItem > img {
	display: block;
	width: 54rem;
	height: 54rem;
}

.box__buyItem > span {
	font-size: 35rem;
}

.box__buyBtnBlock {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2rem;
}

.box__sale {
	margin: 0;
	line-height: 1;
}

.box__sale span {
	color: var(--c10two);
}

.box__modal {
	z-index: 5;
	position: absolute;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	overflow-x: hidden;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	padding: 60rem 0;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.5s ease;
	background-color: var(--c60);
}

.box__modal--noCenter {
	justify-content: flex-start;
	background-color: var(--c60);
}

.box__modal.active {
	opacity: 1;
	pointer-events: all;
}

.box__modal--3 {
	justify-content: flex-start;
}

.box__modal--3 > div .carListContainerDiv::after {
	content: none;
}

.box__close {
	position: absolute;
	right: 20rem;
	top: 20rem;
	display: block;
	width: 30rem;
	height: 30rem;
	border: 0;
	background-color: transparent;
	padding: 0;
	cursor: pointer;
}

.box__close svg {
	display: block;
	width: 100%;
	height: 100%;
}

.box__subTitle {
	margin: 0;
	margin-bottom: 24rem;
	text-align: center;
	padding: 0 24rem;
	font-weight: 400;
}

.box__pic--anima {
	animation: glow 3s ease-in-out infinite both;
}

.box__altList {
	padding: 0 12rem;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 24rem;
}

.box__altItem {
	display: flex;
	gap: 40rem;
	justify-content: space-between;
	width: 100%;
}

.box__altItemLeft {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.box__altItemLeft span {
	font-size: 20rem;
	font-weight: 700;
}

.box__altItemLeft span:first-of-type {
	font-size: 14rem;
	font-weight: 400;
}

.box__altItemRight {
	display: flex;
	flex-direction: column;
	gap: 6rem;
	flex-grow: 1;
}

.box__altItemRight > h3 {
	margin: 0;
	font-size: 14rem;
	font-weight: 400;
	text-align: center;
}

.box__altItemGrid {
	display: flex;
    justify-content: center;
	gap: 6rem;
}

.box__altItemGrid img,
.box__altItemGrid span,
.box__altItemGrid button {
	width: 40rem;
	height: 40rem;
	line-height: 40rem;
	text-align: center;
	object-fit: contain;
	object-position: center;
}

.box__altItemGrid button {
	padding: 5rem;
	background-color: var(--c10two);
	border: 0;
	border-radius: 3rem;
}
.box__altItemGrid button svg {
	width: 30rem;
	height: 30rem;
}

.box__modalGrid {
	display: grid;
	gap: 12rem;
	padding: 12rem;
	grid-template-columns: 1fr 1fr;
}

.box__modalGrid img {
	object-fit: contain;
	object-position: center;
	width: 100%;
	height: 100%;
}

.box__picOpen,
.box__picOpen10 {
	flex-shrink: 0;
}

@keyframes glow {
	0% {
		filter: drop-shadow(0 0 10rem var(--c10two));
	}
	50% {
		filter: drop-shadow(0 0 50rem var(--c10two));
	}
	100% {
		filter: drop-shadow(0 0 10rem var(--c10two));
	}
}

.box__itemCount {
	font-size: 20rem;
}

.box__modalDesc {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-top: 32rem;
	margin-bottom: 12rem;
	font-size: 16rem;
	font-weight: 700;
	line-height: 1.5;
}

.box__modalBtns {
	display: flex;
	gap: 12rem;
	justify-content: center;
}

.box__modal--3 .box__modalBtns {
	margin-top: 24rem;
}

.box__modalInfo {
	transition: opacity 1s ease-out;
	opacity: 0;
	pointer-events: none;
}

.box__modalInfo.active {
	opacity: 1;
	pointer-events: all;
}

.box__modalInfo p {
	transform: scale(0);
	transition: all 1s ease-in-out;
}

.box__modalInfo.active p {
	transform: scale(1);
}

#carousel1,
#carousel2,
#carousel3,
#carousel4 {
	display: flex;
	flex-direction: column;
	align-items: center;
}

@media (min-width: 1000px) {
	.box {
		padding-top: 14rem;
		padding-bottom: 20rem;
		margin-top: 100rem;
		height: calc(100% - 100rem);
		margin-left: 330rem;
	}
	.box__tabs {
		width: 360rem;
		margin: 0 auto;
		margin-bottom: 24rem;
	}
	.box__pic {
		margin: 0 auto;
		margin-bottom: 24rem;
	}
	.box__list {
		width: 600rem;
		margin: 0 auto;
	}
	.box__buyList {
		margin: 0 auto;
		width: 600rem;
	}
	.box__modal {
		margin-left: 330rem;
		width: calc(100vw - 330rem);
		height: calc(100vh - 110rem);
		gap: 30rem;
		padding: 40rem 0;
		justify-content: flex-start;
	}
	.box__list--modal {
		align-items: center;
	}
	.box__altList {
		display: grid;
		grid-template-columns: 1fr 1fr;
		max-width: 600rem;
		margin: 0 auto;
		column-gap: 100rem;
	}
	.box__3carouselWrapper {
		display: flex;
		gap: 40rem;
		justify-content: center;
	}
	#carousel1 {
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	#carousel2 {
		order: 1;
	}
	#carousel4 {
		order: 2;
	}
	#carousel3 {
		order: 3;
	}
	.box__altItem {
		gap: 20rem;
	}
	.box__modalGrid {
		grid-template-columns: repeat(5, 1fr);
	}
}

/*! rewards */

.rewards {
	padding-top: 14rem;
	padding-bottom: 24rem;
	height: calc(100% - 60rem);
	overflow-y: auto;
	overflow-x: hidden;
	font-size: 14rem;
}

.rewards__title {
	margin: 0;
	margin-bottom: 24rem;
}

.rewards__grid {
	display: grid;
	gap: 12rem;
	margin: 0;
	padding: 0 12rem;
	list-style: none;
}

.rewards__item {
	background-color: var(--c30);
	padding-left: 12rem;
	padding-bottom: 6rem;
	padding-right: 6rem;
	display: flex;
	gap: 6rem;
	max-width: 336rem;
}

.rewards__item > img,
.rewards__item > svg {
	flex-shrink: 0;
	display: block;
	width: 34rem;
	height: 56rem;
	object-fit: contain;
	object-position: center top;
}

.rewards__desc {
	padding-top: 6rem;
	padding-left: 6rem;
	flex-grow: 1;
}

.rewards__desc > h2 {
	position: relative;
	margin: 0;
	margin-bottom: 4rem;
	font-size: 14rem;
	line-height: 1;
	font-weight: 400;
}

.rewards__desc > h2::after {
	position: absolute;
	top: calc(100% + 2rem);
	left: 0;
	display: block;
	width: 100%;
	height: 1px;
	content: '';
	background-color: var(--c10one);
	opacity: 0.25;
}

.rewards__desc > p {
	margin: 0;
	font-size: 12rem;
}

.rewards__counter {
	position: relative;
	width: 30rem;
	height: 48rem;
}

.rewards__counter svg {
	display: block;
	width: 30rem;
	height: 48rem;
}

.rewards__counter span {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -70%);
	color: var(--c60);
	font-size: 16rem;
	font-weight: 700;
}

@media (min-width: 1000px) {
	.rewards {
		padding-top: 14rem;
		padding-bottom: 20rem;
		margin-top: 100rem;
		height: calc(100% - 100rem);
		margin-left: 330rem;
	}

	.rewards__grid {
		margin: 0 auto;
		grid-template-columns: repeat(3, 1fr);
		width: max-content;
		gap: 18rem;
	}
}

/*! wp-loader */

.wp-loader-wrapper {
	z-index: 5;
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: flex;
	justify-content: center;
	align-items: center;
	width: 70px;
	height: 70px;
	background-color: var(--c30);
	border-radius: 50%;
	pointer-events: none;
	opacity: 0;
	transition: opacity 0.3s ease;
	border: 3px solid var(--c10two);
}

.wp-loader-wrapper.active {
	opacity: 1;
}

.wp-loader {
	width: 48px;
	height: 48px;
	border-radius: 50%;
	display: inline-block;
	border: 3px solid;
	border-color: var(--c10one) var(--c10one) transparent transparent;
	box-sizing: border-box;
	animation: rotationLoader 1s linear infinite;
}

.wp-loader::after,
.wp-loader::before {
	z-index: 2;
	content: '';
	box-sizing: border-box;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	border: 3px solid;
	border-color: transparent transparent var(--c10two) var(--c10two);
	width: 40px;
	height: 40px;
	border-radius: 50%;
	box-sizing: border-box;
	animation: rotationLoaderBack 0.5s linear infinite;
	transform-origin: center center;
}
.wp-loader::before {
	width: 32px;
	height: 32px;
	border-color: var(--c10one) var(--c10one) transparent transparent;
	animation: rotationLoader 1.5s linear infinite;
}

@keyframes rotationLoader {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}
@keyframes rotationLoaderBack {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(-360deg);
	}
}

@media (min-width: 1000px) {
	.wp-loader-wrapper {
		left: calc(50% + 165rem);
		transform: scale(1.5) translate(-50%, -50%);
	}
}

/*! ct__two-select-wrapper */

.ct__two-select-wrapper {
	position: relative;
	width: 314rem;
	height: 157rem;
	padding: 12rem;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.ct__two-select-wrapper > svg {
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	width: 100%;
	height: 100%;
}

.ct__two-select-info-wrapper {
	display: flex;
	justify-content: space-between;
	margin-bottom: 12rem;
	width: 100%;
}

.ct__two-select-wrapper p {
	position: relative;
	margin: 0;
	font-size: 13rem;
	line-height: 14rem;
	letter-spacing: -0.05em;
	color: var(--c10one);
}

.ct__two-select-wrapper-check {
	position: relative;
	margin-bottom: 12rem;
}

.ct__two-select-wrapper-check label {
	width: 288rem;
	height: 24rem;
	display: flex;
	align-items: center;
	font-size: 13rem;
	line-height: 14rem;
	justify-content: center;
}

.ct__two-select-wrapper-check--min {
	margin: 0;
}

.ct__two-select-wrapper-check--min label {
	width: max-content;
	margin: 0;
}

.ct__two-select-wrapper-check span {
	width: 20rem;
	height: 20rem;
	display: none;
	margin-right: 12rem;
}

.ct__two-select-wrapper-check span svg {
	width: 100%;
	height: 100%;
}

.ct__two-select-wrapper-check label > svg {
	width: 20rem;
	height: 20rem;
	display: block;
	margin-right: 12rem;
}

.ct__two-select-wrapper-check input:checked + svg {
	display: none;
}

.ct__two-select-wrapper-check input:checked ~ span {
	display: block;
}

/*! ct__check-box30 */

.ct__check-box30 {
	position: relative;
	margin-bottom: 12rem;
}

.ct__check-box30 label {
	height: 30rem;
	display: flex;
	align-items: center;
	font-size: 16rem;
	line-height: 16rem;
	justify-content: center;
}

.ct__check-box30--col label {
	flex-direction: column;
}

.ct__check-box30 span {
	width: 30rem;
	height: 30rem;
	display: none;
	margin-right: 12rem;
}

.ct__check-box30 span svg {
	width: 100%;
	height: 100%;
}

.ct__check-box30 label > svg {
	width: 30rem;
	height: 30rem;
	display: block;
	margin-right: 12rem;
}

.ct__check-box30 input:checked + svg {
	display: none;
}

.ct__check-box30 input:checked ~ span {
	display: block;
}

/*! ct__wide-label-select */

.ct__wide-label-select {
	position: relative;
	display: flex;
	width: 288rem;
	height: 24rem;
	align-items: center;
}

.ct__wide-label-select::after {
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	width: 100%;
	height: 100%;
	content: '';
	border: 1px solid var(--c10one);
	opacity: 0.2;
	pointer-events: none;
}

.ct__wide-label-select select {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	font-size: 13rem;
	line-height: 14rem;
	letter-spacing: -0.05em;
	color: var(--c10one);
	padding: 0 5rem;
	border: 0;
	background-color: var(--c30);
	color: var(--c10one);
	outline: none;
	appearance: none;
}

.ct__wide-label-select select:focus {
	box-shadow: 0 0 1rem 0 var(--c10one);
}

.ct__wide-label-select svg {
	position: absolute;
	right: 5rem;
	top: 9rem;
	width: 13rem;
	height: 6rem;
	pointer-events: none;
}

/*! ct__wide-modal-label-select */

.ct__wide-modal-label-select {
	position: relative;
	display: flex;
	width: 312rem;
	height: 30rem;
	align-items: center;
}

.ct__wide-modal-label-select--335 {
	width: 335rem;
}

.ct__wide-modal-label-select--min {
	height: 24rem;
	width: 300rem;
}

.ct__wide-modal-label-select--100 {
	height: 24rem;
	width: 100%;
}

.ct__wide-modal-label-select::after {
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	width: 100%;
	height: 100%;
	content: '';
	border: 1px solid var(--c10one);
	opacity: 0.3;
	pointer-events: none;
}

.ct__wide-modal-label-select select {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	font-weight: 300;
	font-size: 16rem;
	line-height: 30rem;
	letter-spacing: -0.05em;
	color: var(--c10one);
	padding: 0 12rem;
	border: 0;
	background-color: var(--c60);
	color: var(--c10one);
	outline: none;
	appearance: none;
}

.ct__wide-modal-label-select--min select {
	line-height: 24rem;
	background-color: var(--c30);
	font-size: 14rem;
}

.ct__wide-modal-label-select--100 select {
	line-height: 24rem;
	font-size: 14rem;
}

.ct__wide-modal-label-select select:focus {
	box-shadow: 0 0 1rem 0 var(--c10one);
}

.ct__wide-modal-label-select svg {
	position: absolute;
	right: 5rem;
	top: 12rem;
	width: 13rem;
	height: 6rem;
	pointer-events: none;
}

.ct__wide-modal-label-select--min svg {
	top: 10rem;
}

/*! ct__select-region */

.ct__select-region {
	position: relative;
	display: block;
	width: 240rem;
	height: 18rem;
}

.ct__select-region select {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	font-size: 18rem;
	line-height: 18rem;
	letter-spacing: -0.04em;
	color: var(--c10one);
	padding: 0 5rem;
	border: 0;
	background-color: var(--c60);
	color: var(--c10one);
	outline: none;
	appearance: none;
}

.ct__select-region svg {
	position: absolute;
	right: 0;
	top: 4rem;
	width: 21rem;
	height: 11rem;
	pointer-events: none;
}

/*! ct__card */

.ct__card {
	position: relative;
	display: grid;
	width: 312rem;
	height: 98rem;
	column-gap: 10rem;
	padding: 9rem 12rem 12rem;
	grid-template-columns: 108rem 170rem;
	color: var(--c10one);
}

.ct__card svg {
	position: absolute;
	left: 0;
	top: 0;
	width: 312rem;
	height: 98rem;
}

.ct__card h3 {
	z-index: 2;
	position: relative;
	margin: 0;
	font-weight: 400;
	font-size: 18rem;
	line-height: 18rem;
	letter-spacing: -0.04em;
}

.ct__card span {
	z-index: 2;
	position: relative;
	display: block;
	text-align: right;
	font-size: 14rem;
	line-height: 14rem;
	letter-spacing: -0.04em;
}

.ct__card p {
	z-index: 2;
	position: relative;
	margin: 0;
	margin-top: 8rem;
	margin-bottom: 14rem;
	grid-column: 1 / 3;
	text-align: right;
	font-size: 14rem;
	line-height: 14rem;
	letter-spacing: -0.04em;
}

.ct__card input {
	z-index: 2;
	position: relative;
	width: 90rem;
	height: 24rem;
	border: 1px solid var(--c10one);
	background-color: transparent;
	text-align: center;
	font-weight: 400;
	font-size: 14rem;
	line-height: 24rem;
	text-align: center;
	letter-spacing: -0.04em;
	color: var(--c10one);
}

.ct__card form {
	display: flex;
	justify-content: space-between;
	grid-column: 1 / 3;
	width: 100%;
	border: none;
	background-color: transparent;
}

.ct__card button {
	z-index: 2;
	position: relative;
	width: 90rem;
	height: 24rem;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--c10two);
	color: var(--c60);
	font-size: 14rem;
	line-height: 24rem;
	text-align: center;
	letter-spacing: -0.04em;
	border: none;
}

.ct__card button svg {
	position: static;
	width: 14rem;
	height: 14rem;
	display: block;
	margin-right: 6rem;
	margin-top: -2rem;
}

.ct__card button.cancel {
	background-color: var(--c10one);
	opacity: 0.75;
}

/*! ----- ct__widebar ----- */

.ct__widebar {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 312rem;
}

.ct__widebar > span {
	font-size: 14rem;
	line-height: 22rem;
	text-align: center;
	letter-spacing: -0.04em;
	color: var(--c10one);
}

.ct__widebar-bar {
	flex-shrink: 0;
	position: relative;
	display: flex;
	justify-content: center;
	height: 16rem;
	width: 312rem;
	border: 1px solid var(--c10two);
}

.ct__widebar-bar span {
	z-index: 2;
	position: relative;
	font-size: 14rem;
	line-height: 14rem;
	text-align: center;
	letter-spacing: -0.04em;
	color: var(--c10one);
	text-shadow: -1px -1px 0px var(--c60);
}

.ct__widebar-fill {
	position: absolute;
	left: 0;
	top: 0;
	height: 16rem;
	background-color: var(--c10two);
}

/*! ----- ct__nickname ----- */
.ct__nickname {
	position: relative;
	margin: 0;
	margin-bottom: 24rem;
	font-weight: 500;
	font-size: 22rem;
	line-height: 20rem;
	text-align: center;
	letter-spacing: -0.07em;
	color: var(--c10one);
}

.ct__nickname > span {
	position: relative;
	z-index: 2;
	display: block;
	padding: 0 46rem;
}

.ct__nickname-input {
	position: relative;
	z-index: 2;
	width: 265rem;
	height: 20rem;
	padding: 0 8rem;
	text-align: center;
	background-color: transparent;
	color: var(--c10two);
	border: none;
}

.ct__nickname::before {
	position: absolute;
	left: 0;
	bottom: 3rem;
	width: 100%;
	height: 10rem;
	content: '';
	background-color: var(--c30);
}

.ct__nickname-edit {
	position: absolute;
	left: 11rem;
	top: -4rem;
}
.ct__nickname-exit {
	position: absolute;
	left: 11rem;
	top: -4rem;
}
.ct__nickname-save {
	position: absolute;
	right: 11rem;
	top: -4rem;
}
.ct__nickname-save span {
	position: absolute;
	bottom: 100%;
	left: 2rem;
	font-weight: 700;
	font-size: 11rem;
	line-height: 11rem;
	color: var(--c10one);
}
.ct__nickname-message {
	z-index: 3;
	position: absolute;
	right: 11rem;
	top: -3rem;
}

/*! ----- ct__page-title ----- */

.ct__page-title {
	position: relative;
	margin: 0;
	margin-bottom: 24rem;
	font-weight: 500;
	font-size: 22rem;
	line-height: 20rem;
	text-align: center;
	letter-spacing: -0.07em;
	color: var(--c10one);
}

.ct__page-title > span {
	position: relative;
	z-index: 2;
	display: block;
	padding: 0 46rem;
}

.ct__page-title::before {
	z-index: -1;
	position: absolute;
	left: 0;
	bottom: 3rem;
	width: 100%;
	height: 10rem;
	content: '';
	background-color: var(--c30);
}

.ct__page-title-elipsis {
	display: block;
	margin: 0 12rem;
	padding: 0 !important;
	width: calc(100% - 24rem);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/*! ----- ct__s ----- */
.ct__s {
	font-weight: 400;
	font-size: 14rem;
	line-height: 24rem;
	letter-spacing: -0.04em;
	color: var(--c10one);
}

.ct__s-title {
	position: relative;
	margin: 0;
	display: flex;
	padding-left: 14rem;
	align-items: center;
	font-weight: inherit;
	font-size: inherit;
	background: linear-gradient(90deg, var(--c30) 0%, transparent 100%);
}

.ct__s-title--about {
	padding-left: 39rem;
}

.ct__s-text {
	margin: 0;
	padding-left: 14rem;
	padding-right: 14rem;
}

.ct__s-text a {
	color: var(--c10two);
	text-decoration: none;
}

.ct__s-edit {
	position: absolute;
	top: 0;
	left: 0;
}

.ct__s-exit {
	position: absolute;
	top: 0;
	left: 0;
}

.ct__s-save {
	position: absolute;
	top: 0;
	right: 24rem;
}

.ct__s-text-input {
	display: flex;
	height: 24rem;
	padding-right: 24rem;
	align-items: center;
	justify-content: space-between;
}

.ct__s-text-input label {
	position: relative;
	display: flex;
	width: 60rem;
	height: 18rem;
	margin-right: 3rem;
}

.ct__s-text-input label::before {
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	width: 100%;
	height: 100%;
	content: '';
	border: 1px solid var(--c10one);
	opacity: 0.2;
}

.ct__s-text-input input {
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	width: 100%;
	height: 100%;
	text-align: center;
	font-size: 14rem;
	line-height: 14rem;
	letter-spacing: -0.04em;
	color: var(--c10one);
	padding: 0;
	border: 0;
	background-color: transparent;
}

.ct__s-text-input span {
	font-size: 14rem;
	line-height: 14rem;
	letter-spacing: -0.04em;
	color: var(--c10one);
}

.ct__s-text-input span:last-of-type {
	margin-left: auto;
}

/*! ----- ct__js-table ----- */

.ct__js-table-container {
	position: relative;
}

.ct__js-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 14rem;
	line-height: 1.25;
}

.ct__js-table img,
.ct__js-table svg {
	display: inline-block;
	width: 30rem;
	height: 30rem;
	object-fit: contain;
	object-position: center;
	margin-right: 6rem;
}

.ct__js-table tr:nth-of-type(odd) {
	background-color: var(--c30);
}

.ct__js-table td {
	padding: 5rem;
}

.ct__js-modal-sett {
	z-index: 2;
	position: absolute;
	width: 100%;
	top: -13rem;
	left: 0;
	padding: 30rem;
	padding-left: 100rem;
	display: flex;
	flex-direction: column;
	opacity: 0;
	pointer-events: none;
	transition: all 0.3s ease;
	font-size: 16rem;
	background-color: var(--c30);
	box-shadow: 0 0 20rem 0 rgba(0, 0, 0, 0.8);
}

.ct__js-modal-sett label {
	display: flex;
	align-items: center;
}

.ct__js-modal-sett label:not(:last-of-type) {
	margin-bottom: 20rem;
}

.ct__js-modal-sett input[type='checkbox'] + span {
	display: block;
	width: 20rem;
	height: 20rem;
	margin-right: 20rem;
	border: 1px solid var(--c10two);
}

.ct__js-modal-sett input[type='checkbox']:checked + span {
	background-color: var(--c10two);
}

.ct__js-modal-sett.active {
	opacity: 1;
	pointer-events: all;
}

.ct__js-modal-sett-close {
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	width: 30rem;
	height: 30rem;
	border: 0;
	padding: 0;
	background-color: transparent;
}

.ct__js-modal-sett-open {
	display: block;
	position: absolute;
	right: 12rem;
	top: -2rem;
	width: 30rem;
	height: 30rem;
	border: 0;
	padding: 0;
	background-color: transparent;
}

.ct__js-modal-sett-close svg,
.ct__js-modal-sett-open svg {
	display: block;
	width: 100%;
	height: 100%;
}

.ct__js-table-pag {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 20rem;
}

.ct__js-table-pag > span {
	font-size: 18rem;
	margin: 0 20rem;
}

.ct__js-color-btn {
	display: block;
	margin-left: auto;
	width: max-content;
	text-align: center;
	padding: 3rem;
	background-color: var(--c10two);
	color: var(--c60);
	border: 0;
}

.ct__js-table-pag-prev,
.ct__js-table-pag-next {
	display: block;
	width: 30rem;
	height: 30rem;
	padding: 0;
	border: 0;
	background-color: transparent;
}

.ct__js-table-pag-prev svg,
.ct__js-table-pag-next svg {
	display: block;
	width: 100%;
	height: 100%;
}

.ct__js-table-pag-prev {
	transform: scaleX(-1);
}

@media (max-width: 1000px) {
	.ct__js-tablePC {
		display: none;
	}
}

.ct__war_list {
	max-width: 13rem;
	align-content: center;
}

@media (max-width: 1000px) {
	.ct__war_list {
		max-width: 37rem;
		align-content: center;
	}
}

/*! ----- ct__decor-border ----- */

.ct__decor-border {
	width: 360rem;
	height: 192rem;
}

.ct__decor-border svg {
	width: 100%;
	height: 100%;
}

/*! ----- ct__square-btn ----- */
.ct__square-btn {
	padding: 0;
	border: 0;
	background-color: transparent;
	width: 100rem;
	height: 100rem;
}
.ct__square-btn svg {
	width: 100%;
	height: 100%;
}

/*! ----- square-mid-btn ----- */
.ct__square-mid-btn {
	display: inline-flex;
	width: 30rem;
	height: 30rem;
	background-color: transparent;
	border: none;
	padding: 0;
	cursor: pointer;
}
.ct__square-mid-btn svg {
	width: 30rem;
	height: 30rem;
}

/*! ----- square-small-btn ----- */
.ct__square-small-btn {
	width: 24rem;
	height: 24rem;
	background-color: transparent;
	border: none;
	padding: 0;
	cursor: pointer;
}
.ct__square-small-btn svg {
	width: 24rem;
	height: 24rem;
}

/*! ----- ct__long-btn ----- */
.ct__long-btn {
	position: relative;
	display: block;
	background-color: transparent;
	border: none;
	padding: 0;
	cursor: pointer;
	width: 176rem;
	height: 30rem;
}

.ct__long-btn svg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.ct__long-btn span {
	z-index: 2;
	position: relative;
	display: block;
	text-align: center;
	font-weight: 400;
	font-size: 14rem;
	line-height: 24rem;
	color: var(--c60);
}

.ct__long-btn .treg1 {
	transform-origin: 38rem 18em;
	animation: rotate360 10s linear infinite;
}

.ct__long-btn .treg2 {
	transform-origin: 80rem 7rem;
	animation: rotate-360 10s linear infinite;
}

.ct__long-btn .treg3 {
	transform-origin: 140rem 13rem;
	animation: rotate360 10s linear infinite;
}

/*! ----- ct__mid-btn ----- */

.ct__mid-btn {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: transparent;
	border: none;
	padding: 0;
	cursor: pointer;
	width: 144rem;
	height: 30rem;
}

.ct__mid-btn svg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.ct__mid-btn span {
	z-index: 2;
	position: relative;
	display: block;
	text-align: center;
	font-weight: 400;
	font-size: 18rem;
	line-height: 14rem;
	color: var(--c60);
}

.ct__mid-btn .treg1 {
	transform-origin: 120rem 15em;
	animation: rotate360 10s linear infinite;
}

.ct__mid-btn .treg2 {
	transform-origin: 92rem 12rem;
	animation: rotate-360 10s linear infinite;
}

.ct__mid-btn .treg3 {
	transform-origin: 30rem 13rem;
	animation: rotate360 10s linear infinite;
}

/*! ct__selectWithImage */

.ct__selectWithImage {
	position: relative;
	display: inline-block;
	width: 100%;
	font-size: 14rem;
	cursor: pointer;
}

.ct__selectWithImage-content {
	display: none;
	position: absolute;
	z-index: 3;
	width: 100%;
	max-height: 110rem;
	border: 1px solid var(--c60);
}

.ct__selectWithImage.active .ct__selectWithImage-content {
	display: block;
}

.ct__selectWithImage-content div {
	position: relative;
	display: flex;
	align-items: center;
	padding: 6rem;
	cursor: pointer;
	width: 100%;
	box-sizing: border-box;
	background-color: var(--c30);
}

.ct__selectWithImage-content div:not(:last-of-type) {
	border-bottom: 1px solid var(--c60);
}

.ct__selectWithImage-content div::after {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	content: '';
	background-color: rgba(0, 0, 0, 0.1);
	opacity: 0;
	transition: all 0.3s ease;
	pointer-events: none;
}

.ct__selectWithImage-content div:hover::after {
	opacity: 1;
}

.ct__selectWithImage-content img {
	margin-right: 10rem;
	height: 24rem;
	width: 24rem;
	object-fit: contain;
	object-position: center;
}

.ct__selectWithImage-selected {
	position: relative;
	display: flex;
	align-items: center;
	padding: 6rem;
}

.ct__selectWithImage-selected::after {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	content: '';
	border: 1px solid var(--c10one);
	opacity: 0.3;
	pointer-events: none;
}

.ct__selectWithImage-selected img {
	margin-right: 10rem;
	height: 24rem;
	width: 24rem;
	object-fit: contain;
	object-position: center;
}

.ct__selectWithImage-firstText {
	flex-grow: 1;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 6rem;
}

.ct__selectWithImage-arrow {
	display: inline-block;
	width: 15rem;
	height: 8rem;
}

.ct__selectWithImage.active .ct__selectWithImage-arrow {
	transform: scaleY(-1);
}

/*! ct__top-tabs */

.ct__top-tabs {
	display: flex;
	justify-content: space-between;
	padding: 0 24rem;
}

.ct__top-tabs--wide {
	padding: 0 12rem;
}

.ct__top-tab .geometry1,
.ct__top-tab .geometry2 {
	fill: none;
}

.ct__top-tab {
	background: linear-gradient(90deg, var(--c30) 0%, transparent 100%);
}

.ct__top-tab.active {
	background: transparent;
}

.ct__top-tab span {
	color: var(--c10one);
}

.ct__top-tab.active span {
	color: var(--c60);
}

.ct__top-tab.active .geometry1,
.ct__top-tab.active .geometry2 {
	fill: var(--c10two);
}

.ct__top-tab .treg1,
.ct__top-tab .treg2,
.ct__top-tab .treg3 {
	display: none;
}

.ct__top-tab.active .treg1,
.ct__top-tab.active .treg2,
.ct__top-tab.active .treg3 {
	display: block;
}

/*! ----- burger-btn ----- */

#burger {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 40rem;
	height: 25rem;
	transform: translate(-50%, -50%);
	cursor: pointer;
}

#burger:before {
	content: '';
	position: absolute;
	background-color: var(--c60);
	width: 100%;
	height: 4rem;
	top: 0;
	left: 0;
	transition: 0.5s all;
}

#burger:after {
	content: '';
	position: absolute;
	background-color: var(--c60);
	width: 100%;
	height: 4rem;
	bottom: 0;
	left: 0;
	transition: 0.5s all;
}

#burger i {
	opacity: 1;
	position: absolute;
	background-color: var(--c60);
	width: 100%;
	height: 4rem;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	transition: 0.5s all;
}

#burger:hover i {
	width: 90%;
	transition: 0.5s all;
}

.burgeractive i {
	opacity: 0 !important;
	width: 0% !important;
}

.burgeractive:before {
	top: 50% !important;
	transform: rotate(45deg);
	transition: 0.5s all;
}

.burgeractive:after {
	top: 50% !important;
	transform: rotate(-45deg);
	transition: 0.5s all;
}

/*! ----- animations ----- */

@keyframes rotate360 {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
	}
}

@keyframes rotate-360 {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(-360deg);
	}
}

/*! -----глобальное модальное окно ----- */

.modal,
.img_modal {
	z-index: 1001;
	position: fixed;
	left: 0;
	top: 0;
	width: 100vw;
	height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: rgba(0, 0, 0, 0.8);
	backdrop-filter: blur(3px);
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.3s ease;
}

.modal.active,
.img_modal.active {
	opacity: 1;
	pointer-events: all;
}

.modal__inner-window {
	padding-top: 20rem;
	position: relative;
	width: 360rem;
	height: 200rem;
	background-color: var(--c60);
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.modal__text {
	margin: 0;
	padding: 0 18rem;
	font-weight: 400;
	font-size: 14rem;
	line-height: 1.5;
	text-align: center;
	letter-spacing: -0.04em;
}

.modal__header {
	margin-bottom: 0;
	padding: 0 18rem;
}

.modal__header span {
	z-index: 2;
	position: relative;
	padding: 0;
}

.modal__btn-wrapper {
	display: flex;
	padding: 0 18rem;
	margin-bottom: -15rem;
}

.modal__ok {
	position: relative;
	display: block;
	background-color: transparent;
	border: none;
	padding: 0;
	cursor: pointer;
	width: 144rem;
	height: 30rem;
}

.modal__ok svg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.modal__ok span {
	z-index: 2;
	position: relative;
	display: block;
	text-align: center;
	font-weight: 400;
	font-size: 18rem;
	line-height: 14rem;
	color: var(--c60);
}

.modal__cancel {
	position: relative;
	margin-left: auto;
}

.modal__decor {
	z-index: 2;
	position: absolute;
	left: 0;
	top: 0;
	pointer-events: none;
}

/*! ----- M-sett ----- */

.m-sett {
	z-index: 1001;
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	padding: 0 24rem;
	align-items: center;
	justify-content: center;
	background-color: var(--c60);
	transition: all 0.5s ease;
	transform: translateX(-101%);
}

.m-sett.active {
	transform: translateX(0);
}

.m-sett__close {
	position: absolute;
	top: 12rem;
	right: 12rem;
}

.m-sett__form {
	position: relative;
	width: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	background-color: var(--c30);
	padding: 24rem;
}

.m-sett__form::before,
.m-sett__form::after {
	position: absolute;
	top: -1px;
	left: -1px;
	display: block;
	width: 12rem;
	height: 12rem;
	content: '';
	background-color: var(--c60);
	clip-path: polygon(0% 0%, 100% 0%, 0% 100%);
}

.m-sett__form::after {
	top: initial;
	left: initial;
	right: -1px;
	bottom: -1px;
	transform: scale(-1);
}

.m-sett__form-label {
	margin-bottom: 24rem;
}

.m-sett__form-check {
	margin-bottom: 24rem;
}

.m-sett__colors {
	display: flex;
	justify-content: space-between;
	width: 100%;
}

.m-sett__l-color {
	display: flex;
	align-items: center;
	background-color: var(--c30);
}

.m-sett__l-color input {
	border: none;
	border: 1px solid #fff;
	width: 40rem;
	height: 40rem;
	padding: 0;
	appearance: none;
}

/* -webkit */
.m-sett__l-color input[type='color']::-webkit-color-swatch-wrapper {
	padding: 0;
}

.m-sett__l-color input[type='color']::-webkit-color-swatch {
	border: none;
	border: 1px solid #fff;
}

/* firefox */
.m-sett__l-color input[type='color']::-moz-focus-inner {
	border: none;
	padding: 0;
}

.m-sett__l-color input[type='color']::-moz-color-swatch {
	border: 1px solid #fff;
}

.m-sett__l-color span {
	font-weight: 400;
	font-size: 14rem;
	line-height: 24rem;
	letter-spacing: -0.04em;
	color: var(--c10one);
}

.m-sett__save {
	margin-top: 40rem;
	align-self: center;
}

/* Специфичные стили для вкладок в модальном окне настроек */
.m-sett .articles__tabs {
	min-width: 300rem;
}

.m-sett .articles__tabs button {
	font-size: 14rem;
}

.m-sett .articles__list.active {
	animation: none;
}

.m-sett .articles__list {
	min-height: 200rem;
}

@media (min-width: 1000px) {
	.m-sett {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}
	.m-sett__form {
		width: 312rem;
		height: initial;
	}
}

/*! -----custom scroll----- */

.custom-scroll {
	scrollbar-color: var(--c10two) var(--c30);
	scrollbar-width: auto;
	overflow-y: auto;
}

.custom-scroll--alt {
	scrollbar-color: var(--c10two) var(--c60);
}

.custom-scroll::-webkit-scrollbar {
	width: 4rem;
	background-color: var(--c30);
}

.custom-scroll--alt::-webkit-scrollbar {
	background-color: var(--c60);
}

.custom-scroll::-webkit-scrollbar-thumb {
	background-color: var(--c10two);
}

@media (min-width: 1000px) {
	.pc-custom-scroll {
		scrollbar-color: var(--c10two) var(--c30);
		scrollbar-width: auto;
		overflow-y: auto;
	}

	.pc-custom-scroll::-webkit-scrollbar {
		width: 4rem;
		background-color: var(--c30);
	}

	.pc-custom-scroll::-webkit-scrollbar-thumb {
		background-color: var(--c10two);
	}
}

/*! -----Служебные классы----- */

.visually-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	border: 0;
	padding: 0;
	white-space: nowrap;
	-webkit-clip-path: inset(100%);
	clip-path: inset(100%);
	clip: rect(0 0 0 0);
	overflow: hidden;
}

/*! ----- Cropper ----- */

/*!
 * Cropper.js v1.5.12
 * https://fengyuanchen.github.io/cropperjs
 *
 * Copyright 2015-present Chen Fengyuan
 * Released under the MIT license
 *
 * Date: 2021-06-12T08:00:11.623Z
 */
.cropper-container {
	direction: ltr;
	font-size: 0;
	line-height: 0;
	position: relative;
	-ms-touch-action: none;
	touch-action: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
.cropper-container img {
	image-orientation: 0deg;
	display: block;
	height: 100%;
	max-height: none !important;
	max-width: none !important;
	min-height: 0 !important;
	min-width: 0 !important;
	width: 100%;
}
.cropper-canvas,
.cropper-crop-box,
.cropper-drag-box,
.cropper-modal,
.cropper-wrap-box {
	bottom: 0;
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
}
.cropper-canvas,
.cropper-wrap-box {
	overflow: hidden;
}
.cropper-drag-box {
	background-color: #fff;
	opacity: 0;
}
.cropper-modal {
	background-color: #000;
	opacity: 0.5;
}
.cropper-view-box {
	display: block;
	height: 100%;
	outline: 1px solid #39f;
	outline-color: rgba(51, 153, 255, 0.75);
	overflow: hidden;
	width: 100%;
}
.cropper-dashed {
	border: 0 dashed #eee;
	display: block;
	opacity: 0.5;
	position: absolute;
}
.cropper-dashed.dashed-h {
	border-bottom-width: 1px;
	border-top-width: 1px;
	height: 33.33333%;
	left: 0;
	top: 33.33333%;
	width: 100%;
}
.cropper-dashed.dashed-v {
	border-left-width: 1px;
	border-right-width: 1px;
	height: 100%;
	left: 33.33333%;
	top: 0;
	width: 33.33333%;
}
.cropper-center {
	display: block;
	height: 0;
	left: 50%;
	opacity: 0.75;
	position: absolute;
	top: 50%;
	width: 0;
}
.cropper-center:after,
.cropper-center:before {
	background-color: #eee;
	content: ' ';
	display: block;
	position: absolute;
}
.cropper-center:before {
	height: 1px;
	left: -3px;
	top: 0;
	width: 7px;
}
.cropper-center:after {
	height: 7px;
	left: 0;
	top: -3px;
	width: 1px;
}
.cropper-face,
.cropper-line,
.cropper-point {
	display: block;
	height: 100%;
	opacity: 0.1;
	position: absolute;
	width: 100%;
}
.cropper-face {
	background-color: #fff;
	left: 0;
	top: 0;
}
.cropper-line {
	background-color: #39f;
}
.cropper-line.line-e {
	cursor: ew-resize;
	right: -3px;
	top: 0;
	width: 5px;
}
.cropper-line.line-n {
	cursor: ns-resize;
	height: 5px;
	left: 0;
	top: -3px;
}
.cropper-line.line-w {
	cursor: ew-resize;
	left: -3px;
	top: 0;
	width: 5px;
}
.cropper-line.line-s {
	bottom: -3px;
	cursor: ns-resize;
	height: 5px;
	left: 0;
}
.cropper-point {
	background-color: #39f;
	height: 5px;
	opacity: 0.75;
	width: 5px;
}
.cropper-point.point-e {
	cursor: ew-resize;
	margin-top: -3px;
	right: -3px;
	top: 50%;
}
.cropper-point.point-n {
	cursor: ns-resize;
	left: 50%;
	margin-left: -3px;
	top: -3px;
}
.cropper-point.point-w {
	cursor: ew-resize;
	left: -3px;
	margin-top: -3px;
	top: 50%;
}
.cropper-point.point-s {
	bottom: -3px;
	cursor: s-resize;
	left: 50%;
	margin-left: -3px;
}
.cropper-point.point-ne {
	cursor: nesw-resize;
	right: -3px;
	top: -3px;
}
.cropper-point.point-nw {
	cursor: nwse-resize;
	left: -3px;
	top: -3px;
}
.cropper-point.point-sw {
	bottom: -3px;
	cursor: nesw-resize;
	left: -3px;
}
.cropper-point.point-se {
	bottom: -3px;
	cursor: nwse-resize;
	height: 20px;
	opacity: 1;
	right: -3px;
	width: 20px;
}
@media (min-width: 768px) {
	.cropper-point.point-se {
		height: 15px;
		width: 15px;
	}
}
@media (min-width: 992px) {
	.cropper-point.point-se {
		height: 10px;
		width: 10px;
	}
}
@media (min-width: 1000px) {
	.cropper-point.point-se {
		height: 5px;
		opacity: 0.75;
		width: 5px;
	}
}
.cropper-point.point-se:before {
	background-color: #39f;
	bottom: -50%;
	content: ' ';
	display: block;
	height: 200%;
	opacity: 0;
	position: absolute;
	right: -50%;
	width: 200%;
}
.cropper-invisible {
	opacity: 0;
}
.cropper-bg {
	background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz////TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC');
}
.cropper-hide {
	display: block;
	height: 0;
	position: absolute;
	width: 0;
}
.cropper-hidden {
	display: none !important;
}
.cropper-move {
	cursor: move;
}
.cropper-crop {
	cursor: crosshair;
}
.cropper-disabled .cropper-drag-box,
.cropper-disabled .cropper-face,
.cropper-disabled .cropper-line,
.cropper-disabled .cropper-point {
	cursor: not-allowed;
}

.modal-cropper-wrapper {
	width: 100%;
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
}

.modal-dialog {
	position: relative;
	background-color: var(--c60);
}

.modal-dialog .close {
	width: 24rem;
	height: 24rem;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: var(--c10two);
	padding: 0;
	border: none;
}

.modal-dialog .close span {
	font-size: 24rem;
}

.modal-header {
	display: flex;
	justify-content: flex-end;
	padding: 12rem;
}

.modal-body {
	position: relative;
	/* height: 300rem; */
}

.modal-footer {
	display: flex;
	justify-content: space-between;
	font-size: 14rem;
	padding: 12rem;
	background-color: var(--c60);
}

.btn-l-wrapper {
	display: flex;
	width: max-content;
}

.btn-group {
	display: grid;
	row-gap: 6rem;
}

.btn-group button {
	width: 24rem;
	height: 24rem;
	display: flex;
	justify-content: center;
	align-items: center;
	border: none;
	background-color: var(--c10two);
}

.btn-r-wrapper {
	display: grid;
	row-gap: 6rem;
}

.btn-r-wrapper button {
	width: 160rem;
	height: 24rem;
	background-color: var(--c10two);
	padding: 0;
	border: 0;
}

.fade.in {
	opacity: 1;
}

/*! carousel */

.carListContainer {
	position: relative;
	padding-top: 20px;
	width: 320px;
	height: 220px;
	overflow-x: hidden;
}

.carListContainer::before,
.carListContainer::after {
	z-index: 1;
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 50px;
	height: 100%;
	content: '';
	background-image: linear-gradient(
		to right,
		var(--c60),
		var(--c60) 10%,
		transparent
	);
}

.carListContainer::after {
	transform: scaleX(-1);
	left: initial;
	right: 0;
}

.carList {
	position: relative;
	display: flex;
	padding: 0;
	margin: 0;
	list-style: none;
	transition: transform 7.5s ease;
}

.carListContainerDiv {
	position: relative;
	width: 320px;
}

.carListContainerDiv::before,
.carListContainerDiv::after {
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	display: block;
	width: 20px;
	height: 20px;
	content: '';
	background-color: #fff;
	clip-path: polygon(0% 0%, 100% 0%, 50% 100%);
}

.carListContainerDiv::after {
	top: initial;
	bottom: -20px;
	transform: scaleY(-1) translateX(-50%);
}

.carImg {
	display: block;
	width: 200px;
	height: 200px;
	object-fit: contain;
	object-position: center;
	border: 5px solid var(--c60);
	box-sizing: border-box;
	max-width: initial;
}

/*! svg-reload */

.svg-reload {
	z-index: 99999;
	position: fixed;
	top: 0;
	left: calc(50% - 25rem);
	display: block;
	width: 50rem;
	height: 50rem;
	transform: translateY(-110%) scaleX(-1);
	border-radius: 50%;
	background-color: var(--c60);
}

.page-new-private-mine .newmine-form {
	display: flex;
	flex-direction: column;
	gap: 15rem;
}

.page-new-private-mine .newmine-col {
	width: 100%;
}

/* второй столбец по умолчанию сверху вниз */
.page-new-private-mine .newmine-col--right {
	margin-top: 15rem;
}

/* label выпадающего списка - по умолчанию 100% */
.page-new-private-mine .newmine-select-label {
	width: 100%;
}

/* контейнер формы - на мобиле отступы 15rem */
.page-new-private-mine .newmine-container {
	padding-left: 15rem;
	padding-right: 15rem;
	margin-top: 20rem;
}

/* дополнительные утилитарные стили страницы */
.page-new-private-mine .nm-header {
	display: flex;
	align-items: center;
	flex-direction: column;
	margin-top: 30rem;
}

.page-new-private-mine .nm-subtitle {
	position: relative;
	margin: 0;
	margin-bottom: 3rem;
	padding-bottom: 2rem;
	font-weight: 400;
	font-size: 16rem;
	line-height: 18rem;
	text-align: center;
	letter-spacing: -0.04em;
	color: var(--c10one);
}

.page-new-private-mine .nm-region-row {
	display: flex;
	align-items: center;
	margin-top: 8rem;
}

.page-new-private-mine .nm-region-img {
	display: block;
	top: 5rem;
	left: 6rem;
	width: 30rem;
	height: 30rem;
	object-fit: contain;
	object-position: center;
	margin-right: 10rem;
}

.page-new-private-mine .newmine-h3 {
	margin: 0;
	margin-bottom: 20rem;
	font-weight: 400;
	font-size: 16rem;
	line-height: 16rem;
	letter-spacing: -0.04em;
	color: var(--c10one);
}

.page-new-private-mine .newmine-input {
	display: block;
	width: 100%;
	height: 30rem;
	border: 1px solid color-mix(in srgb, var(--c10one) 30%, transparent);
	padding: 0 8rem;
	font-weight: 400;
	font-size: 14rem;
	line-height: 20rem;
	letter-spacing: -0.04em;
	color: var(--c10one);
	background-color: transparent;
	outline: none;
}

.page-new-private-mine .newmine-form--spaced {
	margin-top: 15rem;
}

.page-new-private-mine .nm-overview-title {
	position: relative;
	top: initial;
	transform: translate(-50%, 0%);
	margin-bottom: 10rem;
}

.page-new-private-mine .nm-info {
	margin-bottom: 10rem;
	width: 100%;
	font-size: 16rem;
}

.page-new-private-mine .nm-info--mt20 {
	margin-top: 20rem;
}

.page-new-private-mine .nm-info--muted {
	color: var(--c10two);
}

.page-new-private-mine .nm-card-overlay {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 2;
	display: flex;
	flex-direction: column;
	width: max-content;
	align-items: center;
	padding-left: 15rem;
	padding-right: 15rem;
}

.page-new-private-mine .nm-text-center-16 {
	font-size: 16rem;
	text-align: center;
	z-index: 2;
	position: relative;
	margin-top: 8rem;
	line-height: 14rem;
	letter-spacing: -0.04em;
	margin-bottom: 10rem;
}

.page-new-private-mine .nm-text-highlight {
	color: #eb9929;
}

.page-new-private-mine .nm-row-gap-5 {
	display: flex;
	gap: 5rem;
}

/* Локальный класс страницы, эквивалент visual-ролли .ct__card (для изоляции стилей на странице) */
.page-new-private-mine .nm-ct-card {
	position: relative;
	display: grid;
	width: 312rem;
	height: 98rem;
	column-gap: 10rem;
	padding: 9rem 12rem 12rem;
	grid-template-columns: 108rem 170rem;
	color: var(--c10one);
}

.page-new-private-mine .nm-ct-card svg {
	position: absolute;
	left: 0;
	top: 0;
	width: 312rem;
	height: 98rem;
}

@media (min-width: 1000px) {
	.page-new-private-mine .newmine-form {
		flex-direction: row;
		gap: 10vw;
	}
	.page-new-private-mine .newmine-col {
		width: 50%;
	}
	/* На ПК убираем отступ сверху и выравниваем содержимое вниз/вправо */
	.page-new-private-mine .newmine-col--right {
		margin-top: 0;
		display: flex;
		flex-direction: column;
		justify-content: flex-end;
		align-items: flex-end;
	}
	/* На ПК label выпадающего списка - 50% */
	.page-new-private-mine .newmine-select-label {
		width: 50%;
	}
	/* На ПК для некоторых select оставляем 100% ширину */
	.page-new-private-mine .newmine-select-label--full {
		width: 100%;
	}
	/* На ПК контейнер формы - отступы 15vw */
	.page-new-private-mine .newmine-container {
		padding-left: 15vw;
		padding-right: 15vw;
	}
	/* На ПК игнорируем выравнивание .newmine-col--right для блока "Списание материалов" */
	.page-new-private-mine .newmine-col--right .newmine-right-ignore {
		align-self: flex-start;
		margin-right: auto;
		margin-bottom: auto;
	}
}