@layer properties {
	@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))) {

		*,
		:before,
		:after,
		::backdrop {
			--tw-rotate-x: initial;
			--tw-rotate-y: initial;
			--tw-rotate-z: initial;
			--tw-skew-x: initial;
			--tw-skew-y: initial;
			--tw-border-style: solid;
			--tw-blur: initial;
			--tw-brightness: initial;
			--tw-contrast: initial;
			--tw-grayscale: initial;
			--tw-hue-rotate: initial;
			--tw-invert: initial;
			--tw-opacity: initial;
			--tw-saturate: initial;
			--tw-sepia: initial;
			--tw-drop-shadow: initial;
			--tw-drop-shadow-color: initial;
			--tw-drop-shadow-alpha: 100%;
			--tw-drop-shadow-size: initial;
			--tw-shadow: 0 0 #0000;
			--tw-shadow-color: initial;
			--tw-shadow-alpha: 100%;
			--tw-inset-shadow: 0 0 #0000;
			--tw-inset-shadow-color: initial;
			--tw-inset-shadow-alpha: 100%;
			--tw-ring-color: initial;
			--tw-ring-shadow: 0 0 #0000;
			--tw-inset-ring-color: initial;
			--tw-inset-ring-shadow: 0 0 #0000;
			--tw-ring-inset: initial;
			--tw-ring-offset-width: 0;
			--tw-ring-offset-color: #fff;
			--tw-ring-offset-shadow: 0 0 #0000;
			--tw-outline-style: solid;
			--tw-duration: initial;
			--tw-translate-x: 0;
			--tw-translate-y: 0;
			--tw-translate-z: 0;
			--tw-ease: initial;
			--tw-font-weight: initial;
			--tw-leading: initial;
			--tw-gradient-position: initial;
			--tw-gradient-from: #0000;
			--tw-gradient-via: #0000;
			--tw-gradient-to: #0000;
			--tw-gradient-stops: initial;
			--tw-gradient-via-stops: initial;
			--tw-gradient-from-position: 0%;
			--tw-gradient-via-position: 50%;
			--tw-gradient-to-position: 100%;
			--tw-content: "";
			--tw-backdrop-blur: initial;
			--tw-backdrop-brightness: initial;
			--tw-backdrop-contrast: initial;
			--tw-backdrop-grayscale: initial;
			--tw-backdrop-hue-rotate: initial;
			--tw-backdrop-invert: initial;
			--tw-backdrop-opacity: initial;
			--tw-backdrop-saturate: initial;
			--tw-backdrop-sepia: initial;
			--tw-scale-x: 1;
			--tw-scale-y: 1;
			--tw-scale-z: 1;
			--tw-space-x-reverse: 0
		}
	}
}

@layer theme {

	:root,
	:host {
		--font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
		--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
		--color-white: #fff;
		--spacing: .25rem;
		--text-xs: .75rem;
		--text-xs--line-height: calc(1/.75);
		--text-sm: .875rem;
		--text-sm--line-height: calc(1.25/.875);
		--text-base: 1rem;
		--text-base--line-height: calc(1.5/1);
		--text-lg: 1.125rem;
		--text-lg--line-height: calc(1.75/1.125);
		--text-xl: 1.25rem;
		--text-xl--line-height: calc(1.75/1.25);
		--text-2xl: 1.5rem;
		--text-2xl--line-height: calc(2/1.5);
		--text-3xl: 1.875rem;
		--text-3xl--line-height: calc(2.25/1.875);
		--text-4xl: 2.25rem;
		--text-4xl--line-height: calc(2.5/2.25);
		--text-5xl: 3rem;
		--text-5xl--line-height: 1;
		--text-8xl: 6rem;
		--text-8xl--line-height: 1;
		--font-weight-medium: 500;
		--font-weight-semibold: 600;
		--font-weight-bold: 700;
		--font-weight-black: 900;
		--radius-md: .375rem;
		--radius-lg: .5rem;
		--radius-xl: .75rem;
		--radius-2xl: 1rem;
		--radius-3xl: 1.5rem;
		--ease-in-out: cubic-bezier(.4, 0, .2, 1);
		--animate-spin: spin 1s linear infinite;
		--animate-pulse: pulse 2s cubic-bezier(.4, 0, .6, 1)infinite;
		--blur-sm: 8px;
		--blur-xl: 24px;
		--default-transition-duration: .15s;
		--default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
		--default-font-family: var(--font-sans);
		--default-mono-font-family: var(--font-mono)
	}
}

@layer base {

	*,
	:after,
	:before,
	::backdrop {
		box-sizing: border-box;
		border: 0 solid;
		margin: 0;
		padding: 0
	}

	::file-selector-button {
		box-sizing: border-box;
		border: 0 solid;
		margin: 0;
		padding: 0
	}

	html,
	:host {
		-webkit-text-size-adjust: 100%;
		tab-size: 4;
		line-height: 1.5;
		font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
		font-feature-settings: var(--default-font-feature-settings, normal);
		font-variation-settings: var(--default-font-variation-settings, normal);
		-webkit-tap-highlight-color: transparent
	}

	hr {
		height: 0;
		color: inherit;
		border-top-width: 1px
	}

	abbr:where([title]) {
		-webkit-text-decoration: underline dotted;
		text-decoration: underline dotted
	}

	h1,
	h2,
	h3,
	h4,
	h5,
	h6 {
		font-size: inherit;
		font-weight: inherit
	}

	a {
		color: inherit;
		-webkit-text-decoration: inherit;
		-webkit-text-decoration: inherit;
		-webkit-text-decoration: inherit;
		text-decoration: inherit
	}

	b,
	strong {
		font-weight: bolder
	}

	code,
	kbd,
	samp,
	pre {
		font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
		font-feature-settings: var(--default-mono-font-feature-settings, normal);
		font-variation-settings: var(--default-mono-font-variation-settings, normal);
		font-size: 1em
	}

	small {
		font-size: 80%
	}

	sub,
	sup {
		vertical-align: baseline;
		font-size: 75%;
		line-height: 0;
		position: relative
	}

	sub {
		bottom: -.25em
	}

	sup {
		top: -.5em
	}

	table {
		text-indent: 0;
		border-color: inherit;
		border-collapse: collapse
	}

	:-moz-focusring {
		outline: auto
	}

	progress {
		vertical-align: baseline
	}

	summary {
		display: list-item
	}

	ol,
	ul,
	menu {
		list-style: none
	}

	img,
	svg,
	video,
	canvas,
	audio,
	iframe,
	embed,
	object {
		vertical-align: middle;
		display: block
	}

	img,
	video {
		max-width: 100%;
		height: auto
	}

	button,
	input,
	select,
	optgroup,
	textarea {
		font: inherit;
		font-feature-settings: inherit;
		font-variation-settings: inherit;
		letter-spacing: inherit;
		color: inherit;
		opacity: 1;
		background-color: #0000;
		border-radius: 0
	}

	::file-selector-button {
		font: inherit;
		font-feature-settings: inherit;
		font-variation-settings: inherit;
		letter-spacing: inherit;
		color: inherit;
		opacity: 1;
		background-color: #0000;
		border-radius: 0
	}

	:where(select:is([multiple], [size])) optgroup {
		font-weight: bolder
	}

	:where(select:is([multiple], [size])) optgroup option {
		padding-inline-start: 20px
	}

	::file-selector-button {
		margin-inline-end: 4px
	}

	::placeholder {
		opacity: 1
	}

	@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px) {
		::placeholder {
			color: currentColor
		}

		@supports (color:color-mix(in lab, red, red)) {
			::placeholder {
				color: color-mix(in oklab, currentcolor 50%, transparent)
			}
		}
	}

	textarea {
		resize: vertical
	}

	::-webkit-search-decoration {
		-webkit-appearance: none
	}

	::-webkit-date-and-time-value {
		min-height: 1lh;
		text-align: inherit
	}

	::-webkit-datetime-edit {
		display: inline-flex
	}

	::-webkit-datetime-edit-fields-wrapper {
		padding: 0
	}

	::-webkit-datetime-edit {
		padding-block: 0
	}

	::-webkit-datetime-edit-year-field {
		padding-block: 0
	}

	::-webkit-datetime-edit-month-field {
		padding-block: 0
	}

	::-webkit-datetime-edit-day-field {
		padding-block: 0
	}

	::-webkit-datetime-edit-hour-field {
		padding-block: 0
	}

	::-webkit-datetime-edit-minute-field {
		padding-block: 0
	}

	::-webkit-datetime-edit-second-field {
		padding-block: 0
	}

	::-webkit-datetime-edit-millisecond-field {
		padding-block: 0
	}

	::-webkit-datetime-edit-meridiem-field {
		padding-block: 0
	}

	:-moz-ui-invalid {
		box-shadow: none
	}

	button,
	input:where([type=button], [type=reset], [type=submit]) {
		appearance: button
	}

	::file-selector-button {
		appearance: button
	}

	::-webkit-inner-spin-button {
		height: auto
	}

	::-webkit-outer-spin-button {
		height: auto
	}

	[hidden]:where(:not([hidden=until-found])) {
		display: none !important
	}
}

@layer components;

@layer utilities {
	.collapse {
		visibility: collapse
	}

	.visible {
		visibility: visible
	}

	.absolute {
		position: absolute
	}

	.fixed {
		position: fixed
	}

	.relative {
		position: relative
	}

	.static {
		position: static
	}

	.sticky {
		position: sticky
	}

	.top-2 {
		top: calc(var(--spacing)*2)
	}

	.left-2 {
		left: calc(var(--spacing)*2)
	}

	.container {
		width: 100%
	}

	@media (min-width:40rem) {
		.container {
			max-width: 40rem
		}
	}

	@media (min-width:48rem) {
		.container {
			max-width: 48rem
		}
	}

	@media (min-width:64rem) {
		.container {
			max-width: 64rem
		}
	}

	@media (min-width:80rem) {
		.container {
			max-width: 80rem
		}
	}

	@media (min-width:96rem) {
		.container {
			max-width: 96rem
		}
	}

	.block {
		display: block
	}

	.flex {
		display: flex
	}

	.grid {
		display: grid
	}

	.hidden {
		display: none
	}

	.inline {
		display: inline
	}

	.inline-block {
		display: inline-block
	}

	.table {
		display: table
	}

	.transform {
		transform: var(--tw-rotate-x, )var(--tw-rotate-y, )var(--tw-rotate-z, )var(--tw-skew-x, )var(--tw-skew-y, )
	}

	.resize {
		resize: both
	}

	.truncate {
		text-overflow: ellipsis;
		white-space: nowrap;
		overflow: hidden
	}

	.border {
		border-style: var(--tw-border-style);
		border-width: 1px
	}

	.opacity-25 {
		opacity: .25
	}

	.opacity-75 {
		opacity: .75
	}

	.blur {
		--tw-blur: blur(8px);
		filter: var(--tw-blur, )var(--tw-brightness, )var(--tw-contrast, )var(--tw-grayscale, )var(--tw-hue-rotate, )var(--tw-invert, )var(--tw-saturate, )var(--tw-sepia, )var(--tw-drop-shadow, )
	}

	.filter {
		filter: var(--tw-blur, )var(--tw-brightness, )var(--tw-contrast, )var(--tw-grayscale, )var(--tw-hue-rotate, )var(--tw-invert, )var(--tw-saturate, )var(--tw-sepia, )var(--tw-drop-shadow, )
	}

	.transition {
		transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter;
		transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
		transition-duration: var(--tw-duration, var(--default-transition-duration))
	}

	.backface-hidden {
		backface-visibility: hidden
	}
}

:root {
	--primary: #38A0FF;
	--primary-gradient: linear-gradient(to right, #0055F3, #38A0FF);
	--primary-gradient-hover: linear-gradient(to right, #0069F3, #38AFFF);
	--coin: linear-gradient(to bottom, #ffa220 28%, #ffe520);
	--energy: linear-gradient(to bottom, #0069F3 28%, #38AFFF);
	--gray: #5b6787;
	--gray-light: #a6b2d9;
	--gray-hover: #9aabdb;
	--shadow-primary: 0 .5rem 1.25rem #38A0FF26;
	--shadow-primary-hover: 0 .5rem 1.5rem #38A0FF33
}

[x-cloak] {
	display: none !important
}

* {
	box-sizing: border-box;
	--tw-ring-shadow: var(--tw-ring-inset, )0 0 0 calc(0px + var(--tw-ring-offset-width))var(--tw-ring-color, currentcolor);
	box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
	--tw-outline-style: none;
	outline-style: none
}

:focus {
	--tw-ring-shadow: var(--tw-ring-inset, )0 0 0 calc(0px + var(--tw-ring-offset-width))var(--tw-ring-color, currentcolor);
	box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
	outline-style: var(--tw-outline-style);
	--tw-outline-style: none;
	outline-width: 0;
	outline-style: none
}

button {
	cursor: pointer;
	text-align: left
}

a *,
button * {
	pointer-events: none
}

body {
	font-family: Roboto;
	font-size: var(--text-base);
	line-height: var(--tw-leading, var(--text-base--line-height));
	color: var(--color-white);
	background-color: #0F1115;
	flex-direction: column;
	flex: 1;
	justify-content: space-between;
	display: flex
}

html {
	flex-direction: column;
	justify-content: space-between;
	height: 100%;
	display: flex;
	position: relative
}

span,
p,
h1,
h2,
h3,
h4,
h5,
h6,
strong,
b,
i {
	cursor: default
}

a span,
button span,
button i {
	pointer-events: none
}

li {
	list-style-type: none
}

main {
	padding-bottom: calc(var(--spacing)*4);
	flex: 1
}

@media (min-width:1201px) {
	main {
		padding-bottom: calc(var(--spacing)*6)
	}
}

img {
	pointer-events: none
}

@media (min-width:1651px) {
	html {
		font-size: .833333vw
	}
}

@media (max-width:1650px) and (min-width:386px) {
	html {
		font-size: 14px
	}
}

@media (max-width:385px) {
	html {
		font-size: 13px
	}
}

main {
	padding-top: 10.75rem
}

@media (min-width:1051px) {
	main {
		/* padding-top: 14rem */
		padding-top: 13rem;
	}
}

main .wrapper {
	gap: calc(var(--spacing)*4);
	flex-direction: column;
	display: flex
}

@media (min-width:1051px) {
	main .wrapper {
		gap: calc(var(--spacing)*6)
	}
}

.wrapper {
	width: 100%;
	/* max-width: 74.75rem; */
	max-width: 85rem;
	padding-inline: calc(var(--spacing)*4);
	margin-inline: auto;
	position: relative
}

/* Затычка чтобы на больших экранах интерфейс не увеличивался */
@media (min-width:2000px) {
	html {
		font-size: 1rem;
	}
}

.header {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	z-index: 11;
	width: 100%;
	/* padding-block: calc(var(--spacing)*3); */
	position: absolute
}

.secondaryHeader {
	position: absolute;
	top: 7.5rem;
	left: 0;
	right: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.header .wrapper {
	flex-direction: column;
	display: flex;
    background: #16191E;
    border-radius: var(--radius-3xl);
}

.qhw {
    border: 1px #1E2229 solid
}

.secondaryHeader__pModes {
	position: relative;
	display: flex;
    align-items: center;
	gap: 5px;
}

.pModes__item {
	position: relative;
	/* width: 100%; */
	padding: 8px 12px;
	color: rgba(255, 255, 255, 0.5);
	/* background: rgba(0, 105, 243, 0.2); */
	border-radius: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.pModes__item:hover .pModes__text {
	color: #ffffff;
}

.pModes__item.active {
    color: #ffffff;
	background: #1E2229;
}

.pModes__text {
	position: relative;
	font-size: var(--text-base);
	font-weight: 500;
	transition: color 0.2s;
}

.pModes__img {
    width: auto;
	height: 30px;
    opacity: 0.7;
    transition: opacity 0.2s;
}
.pModes__item:hover .pModes__img {
    opacity: 1;
}
.pModes__item.active .pModes__img {
    opacity: 1;
}

.header__live {
	/* height: 7.9375rem; */
	height: auto;
	justify-content: space-between;
	align-items: center;
	display: flex;
	position: relative;
}

.header__live-buttons {
	justify-content: center;
	align-items: center;
	/* gap: calc(var(--spacing)*2); */
	gap: 0.313rem;
	/* padding: calc(var(--spacing)*3); */
	padding: 0.313rem;
	--tw-duration: .3s;
	background-color: #16191E;
	border-radius: 1.75rem;
	flex-flow: column wrap;
	transition-duration: .3s;
	display: flex;
	position: relative
}

/* Элемент внутреннего закругдения в лайвленте (когда был вместе с шапкой) */
/* .header__live-buttons:before {
	--tw-content: "";
	content: var(--tw-content);
	background: #0F1115;
	border-radius: 0 0 0 2.5rem;
	width: 4.375rem;
	height: 1.875rem;
	position: absolute;
	bottom: 0;
	right: -4.375rem;
	box-shadow: -.625rem .375rem #16191E
}

@media (max-width:360px) {
	.header__live-buttons:before {
		width: 1.5rem;
		height: 1.875rem;
		right: -1.5rem;
		box-shadow: -.625rem .5rem #16191E
	}
} */

.header__live-button {
	/* width: calc(var(--spacing)*12); */
	/* height: calc(var(--spacing)*12); */
	width: 1.563rem;
	height: 1.563rem;
	/* font-size: var(--text-2xl); */
	font-size: var(--text-base);
	line-height: var(--tw-leading, var(--text-2xl--line-height));
	color: var(--gray);
	background-color: #1E2229;
	border-radius: 3.40282e38px;
	justify-content: center;
	align-items: center;
	display: flex
}

@media (hover:hover) {
	.header__live-button:hover {
		color: var(--color-white);
		background-color: #2A2E38
	}
}

.header__live-button.active {
	color: var(--color-white);
	/* background-color: transparent */
	background: var(--primary-gradient);
}

.header__live-button .icon {
	z-index: 1;
	position: relative
}

/* .header__live-button-tab { */
	/* top: calc(var(--spacing)*3); */
	/* width: calc(var(--spacing)*12); */
	/* height: calc(var(--spacing)*12); */
	/* top: 5px;
	width: 1.563rem;
	height: 1.563rem;
	--tw-translate-x: calc(calc(1/2*100%)*-1);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	--tw-duration: .3s;
	--tw-ease: var(--ease-in-out);
	transition-duration: .3s;
	transition-timing-function: var(--ease-in-out);
	background: var(--primary-gradient);
	box-shadow: var(--shadow-primary);
	border-radius: 3.40282e38px;
	position: absolute;
	left: 50%;
	z-index: -1
} */

/* .header__live-button-tab.active { */
	/* --tw-translate-y: 3.5rem; */
	/* top: auto; */
	/* bottom: 4px; */
	/* --tw-translate-y: 27px;
	translate: var(--tw-translate-x)var(--tw-translate-y)
} */

.header__live-wrapp {
	align-items: stretch;
	/* gap: calc(var(--spacing)*3); */
	gap: calc(var(--spacing)*2);
	padding-left: calc(var(--spacing)*3);
	flex: 1;
	display: flex;
	overflow: hidden;
	/* -webkit-mask-image: linear-gradient(90deg, #fff 60%, #0000); */
	/* mask-image: linear-gradient(90deg, #fff 60%, #0000); */
	/* top: calc(var(--spacing)*-1); */
	position: relative;
	-webkit-mask-image: linear-gradient(90deg, #fff 80%, #0000);
	mask-image: linear-gradient(90deg, #fff 80%, #0000);
}

body:not(.animate_on) .header__live-wrapp .itemHorizontal__item {
	animation-fill-mode: forwards;
	animation-duration: .75s;
	animation-timing-function: ease-out;
	will-change: transform, opacity
}

body:not(.animate_on) .header__live-wrapp .itemHorizontal__item:first-child {
	animation-name: First !important
}

body:not(.animate_on) .header__live-wrapp .itemHorizontal__item:nth-child(odd) {
	animation-name: Odd
}

body:not(.animate_on) .header__live-wrapp .itemHorizontal__item:nth-child(2n) {
	animation-name: Even
}

body:not(.animate_on) .header__live-wrapp .itemHorizontal__item:last-child {
	animation-name: Last
}

@keyframes First {
	0% {
		opacity: 0;
		transform: translate3d(-100%, 0, 0)
	}

	to {
		opacity: 1;
		transform: translateZ(0)
	}
}

@keyframes Last {
	0% {
		transform: translate3d(-100%, 0, 0)
	}

	to {
		transform: translateZ(0)
	}
}

@keyframes Odd {
	0% {
		transform: translate3d(-100%, 0, 0)
	}
}

@keyframes Even {
	0% {
		transform: translate3d(-100%, 0, 0)
	}
}

.header__bottom {
	height: 4.5rem;
	display: flex;
	align-items: stretch;
	justify-content: space-between;
}

.header__left {
	align-items: center;
	gap: calc(var(--spacing)*4);
	height: 100%;
	/* padding-inline: calc(var(--spacing)*4); */
	display: flex
	/* background-color: #16191E; */
	/* border-radius: 0 1.5rem 1.5rem; */
}

/* @media not all and (min-width:350px) {
	.header__left {
		width: 45%
	}
}

@media not all and (min-width:360px) {
	@media (min-width:351px) {
		.header__left {
			width: 42%
		}
	}
} */

.header__logotype {
	align-items: center;
	gap: calc(var(--spacing)*2.5);
	font-size: var(--text-3xl);
	line-height: var(--tw-leading, var(--text-3xl--line-height));
	--tw-font-weight: var(--font-weight-black);
	font-weight: var(--font-weight-black);
	display: flex
}

.header__logotype-wrapp {
	width: calc(var(--spacing)*10);
	height: calc(var(--spacing)*10);
	border-style: var(--tw-border-style);
	border-width: 2px;
	border-color: var(--primary);
	border-radius: 3.40282e38px;
	justify-content: center;
	align-items: center;
	display: flex;
	position: relative
}

.header__logotype-wrapp img {
	top: calc(var(--spacing)*-1.5);
	left: calc(var(--spacing)*0);
	object-fit: contain;
	width: 100%;
	height: 100%;
	position: absolute;
	scale: 1.4
}

.header__online {
	align-items: center;
	gap: calc(var(--spacing)*2);
	display: flex
}

.header__online-info {
	gap: calc(var(--spacing)*.5);
	flex-direction: column;
	display: flex;
    text-align: center;
}

:is(.header__online-info>*) {
	--tw-leading: 100%;
	line-height: 100%
}

.header__online-info span {
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
    font-size: 0.875rem;
}

.header__online-info p {
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray)
}


.animate_on .header__online-ellipse {
	animation: none
}

.header__divider {
	height: calc(var(--spacing)*4);
	background-color: #1E2229;
	width: 2px;
	display: flex
}

.header__nav {
	align-items: center;
	gap: calc(var(--spacing)*2);
	display: flex
}

.header__nav a {
	height: calc(var(--spacing)*11);
	align-items: center;
	gap: calc(var(--spacing)*2);
	padding-inline: calc(var(--spacing)*3);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #16191E;
	border-radius: 3.40282e38px;
	display: flex
}

@media (hover:hover) {
	.header__nav a:hover {
		color: var(--color-white);
		/* background-color: #2A2E38 */
	}
}

.header__nav a .icon {
	font-size: var(--text-lg);
	line-height: var(--tw-leading, var(--text-lg--line-height))
}

/* .header__nav a.vip {
	color: #ffde83;
	background-color: oklab(90.9269% -.000148326 .116442/.07)
}

@media (hover:hover) {
	.header__nav a.vip:hover {
		background-color: oklab(90.9269% -.000148326 .116442/.15)
	}
} */

.header__right {
	align-items: center;
	/* gap: calc(var(--spacing)*4); */
	display: flex
}

.header__auth {
	align-items: center;
	gap: calc(var(--spacing)*3);
	/* height: 100%; */
	/* padding-right: calc(var(--spacing)*3); */
	/* background-color: #16191E; */
	/* border-radius: 1.25rem; */
	display: flex
}

.header__settings-btn {
	color: var(--gray);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	display: flex;
    font-size: var(--text-xl);
}

@media (hover:hover) {
	.header__settings-btn:hover {
		color: var(--gray-hover)
	}
}

.header.active {
	position: fixed
}

.header.active .header__mask {
	position: absolute;
}

/* .header.active .itemHorizontal {
	width: 7rem;
	padding: calc(var(--spacing)*2);
	flex-direction: column-reverse;
	max-height: 6.25rem;
} */

/* .header.active .itemHorizontal__images {
	max-width: 4rem;
} */

/* .header.active .itemHorizontal__images .icon {
	font-size: var(--text-5xl);
	line-height: var(--tw-leading, var(--text-5xl--line-height));
} */

/* .header.active .sum.sum--sm.sum--bgWhite {
	padding-inline: calc(var(--spacing)*1);
	padding-block: calc(var(--spacing)*.5);
	font-size: .7rem;
	background: red;
	color: red;
} */

/* .header.active .sum.sum--sm.sum--bgWhite .icon {
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height))
} */

/* .header.active .itemHorizontal__left {
	gap: calc(var(--spacing)*2);
	display: none
} */

/* .header.active .itemHorizontal__left span {
	font-size: .7rem
} */

/* .header.active .itemHorizontal__left p {
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height))
} */

/* .header.active .itemHorizontal__info {
	gap: calc(var(--spacing)*.5);
	display: none
} */

/* .header.active .itemHorizontal__user {
	display: none
} */

/* .header.active .header__live-buttons {
	flex-direction: row
} */

/* .header.active .header__live-button-tab {
	left: calc(var(--spacing)*3);
	--tw-translate-x: calc(var(--spacing)*0);
	translate: var(--tw-translate-x)var(--tw-translate-y)
} */

/* .header.active .header__live-button-tab.active {
	--tw-translate-x: 3.5rem;
	translate: var(--tw-translate-x)var(--tw-translate-y);
	--tw-translate-y: calc(var(--spacing)*0);
	translate: var(--tw-translate-x)var(--tw-translate-y)
} */

/* .header.active .header__live-wrapp {
	top: calc(var(--spacing)*-1);
	gap: calc(var(--spacing)*2);
	position: relative;
	-webkit-mask-image: linear-gradient(90deg, #fff 80%, #0000);
	mask-image: linear-gradient(90deg, #fff 80%, #0000)
} */

/* .header.active .header__live {
	height: 4.5rem
} */

.header.active .additionalPages {
    visibility: hidden;
    opacity: 0;
}

.header__live .itemHorizontal__left span {
	font-size: .7rem;
    display: none;
}

.header__live .itemHorizontal__left p {
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
    color: rgba(255, 255, 255, 0.5);
}

.header .wadp {
    padding: 0;
    background: none;
    z-index: 0 !important;
}

.header .additionalPages {
    position: relative;
    margin-left: var(--radius-3xl);
    width: fit-content;
    background: #16191E;
    border-radius: 0 0 var(--radius-3xl) var(--radius-3xl);
    /* max-width: 74.75rem; */
    /* padding-inline: calc(var(--spacing) * 4); */
    /* align-items: start; */
    /* background: #16191E; */
    /* border-radius: var(--radius-3xl); */
    /* z-index: 1; */
    visibility: visible;
    opacity: 1;
    /* transition: visibility 1s, opacity 1s; */
}

.header .additionalPages a {
    height: auto;
    padding: 0;
}

@media (max-width:1050px) {
	.header {
		position: fixed
	}

	.header__live .itemHorizontal {
		width: 7rem;
		padding: calc(var(--spacing)*2);
		flex-direction: column-reverse
	}

	.header__live .itemHorizontal__images {
		max-width: 4rem
	}

	.header__live .itemHorizontal__images .icon {
		font-size: var(--text-5xl);
		line-height: var(--tw-leading, var(--text-5xl--line-height))
	}

	.header__live .sum.sum--sm.sum--bgWhite {
		padding-inline: calc(var(--spacing)*1);
		padding-block: calc(var(--spacing)*.5);
		font-size: .7rem
	}

	.header__live .sum.sum--sm.sum--bgWhite .icon {
		font-size: var(--text-xs);
		line-height: var(--tw-leading, var(--text-xs--line-height))
	}

	.header__live .itemHorizontal__left {
		gap: calc(var(--spacing)*2);
		/* display: none */
	}

	/* .header__live .itemHorizontal__left span {
		font-size: .7rem
	} */

	/* .header__live .itemHorizontal__left p {
		font-size: var(--text-xs);
		line-height: var(--tw-leading, var(--text-xs--line-height))
	} */

	/* .header__live .itemHorizontal__info {
		gap: calc(var(--spacing)*.5);
		display: none
	} */

	.header__live .itemHorizontal__user {
		display: none
	}

	/* .header__live .header__live-buttons {
		flex-direction: row
	} */

	/* .header__live .header__live-button-tab {
		left: calc(var(--spacing)*3);
		--tw-translate-x: calc(var(--spacing)*0);
		translate: var(--tw-translate-x)var(--tw-translate-y)
	} */

	/* .header__live .header__live-button-tab.active {
		--tw-translate-x: 3.5rem;
		translate: var(--tw-translate-x)var(--tw-translate-y);
		--tw-translate-y: calc(var(--spacing)*0);
		translate: var(--tw-translate-x)var(--tw-translate-y)
	} */

	.header__live .header__live-wrapp {
		top: calc(var(--spacing)*-1);
		gap: calc(var(--spacing)*2);
		position: relative;
		-webkit-mask-image: linear-gradient(90deg, #fff 80%, #0000);
		mask-image: linear-gradient(90deg, #fff 80%, #0000)
	}

	.header__live .header__live {
		height: 4.5rem
	}

	.secondaryHeader__pModes {
		display: none;
	}
}

.header__mask {
	pointer-events: none;
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	--tw-gradient-position: to bottom in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-from: #0F1115;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-from-position: 50%;
	--tw-gradient-to: transparent;
	width: 100%;
	height: calc(100% + 3rem);
	/* position: absolute */
}

.header .wrapper {
	z-index: 1;
	position: relative
}

@media not all and (min-width:975px) {
	:is(.header .header__nav, .header .header__divider) {
		display: none
	}
}

@media not all and (min-width:591px) {
	.header .header__logotype span {}
}

@media not all and (min-width:470px) {
	.header .header__online {
		display: none
	}
}

.header.home .header__mask {
	--tw-gradient-from-position: 70%
}

.header__user-avatar {
	width: calc(var(--spacing)*10);
	height: calc(var(--spacing)*10);
	object-fit: cover;
	border-radius: 3.40282e38px
}

.header__balance {
    position: relative;
    padding: 8px 10px;
    background: #1E2229;
    border-radius: 100px;
	display: flex;
	align-items: flex-end;
	flex-direction: column;
	/* gap: calc(var(--spacing)*1); */
    gap: 10px;
    transition: background 0.2s;
}

.header__balance:hover {
    background: #2A2E38;
}

.header__balance__emptyLayer {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

@media (min-width:1px) {
	.header__balance {
		align-items: center;
		/* gap: calc(var(--spacing)*4); */
		flex-direction: row
	}
}

.butProf {
    transition: opacity 0.2s;
}

.butProf:hover {
    opacity: 0.7;
}

.header__balance-buttons {
	align-items: center;
	gap: calc(var(--spacing)*1);
	display: flex
}

.header__balance-buttons .dropdown__inner {
	padding: calc(var(--spacing)*0);
	background-color: #2e3956;
	flex-direction: column;
	display: flex;
	overflow: hidden
}

.header__balance-button {
	width: calc(var(--spacing)*8);
	height: calc(var(--spacing)*8);
	justify-content: center;
	align-items: center;
	gap: calc(var(--spacing)*1);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	color: var(--gray);
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #1f2841;
	border-radius: 3.40282e38px;
	display: flex
}

@media (hover:hover) {
	.header__balance-button:hover {
		color: var(--color-white);
		background-color: #273250
	}
}

.header__balance-button.deposit {
	color: var(--color-white);
	background: var(--primary-gradient);
	box-shadow: var(--shadow-primary)
}

@media (hover:hover) {
	.header__balance-button.deposit:hover {
		scale: 1.1
	}
}

@media not all and (min-width:360px) {
	.header .header__language span {
		text-overflow: ellipsis;
		white-space: nowrap;
		max-width: 2.5rem;
		overflow: hidden
	}
}

.header__balance-drop-link {
	align-items: center;
	gap: calc(var(--spacing)*4);
	border-bottom-style: var(--tw-border-style);
	padding-inline: calc(var(--spacing)*4);
	padding-block: calc(var(--spacing)*4);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	border-bottom-width: 1px;
	border-bottom-color: #3c496c;
	display: flex
}

.header__balance-drop-link:last-child {
	border-bottom-style: var(--tw-border-style);
	border-bottom-width: 0
}

@media (hover:hover) {
	.header__balance-drop-link:hover {
		background-color: #384464
	}
}

.header__balance-drop-link .icon {
	font-size: var(--text-xl);
	line-height: var(--tw-leading, var(--text-xl--line-height));
	color: var(--gray-light)
}

.header__balance-drop-inner {
	gap: calc(var(--spacing)*1);
	flex-direction: column;
	display: flex
}

:is(.header__balance-drop-inner>*) {
	--tw-leading: 100%;
	line-height: 100%
}

.header__balance-drop-inner span {
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold)
}

.header__balance-drop-inner span span {
	margin-left: calc(var(--spacing)*1);
	padding-inline: calc(var(--spacing)*1.5);
	padding-block: calc(var(--spacing)*.5);
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	background: var(--primary-gradient);
	box-shadow: var(--shadow-primary);
	border-radius: 3.40282e38px
}

.header__balance-drop-inner p {
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray-light)
}

.icon {
	width: 1em;
	height: 1em;
	position: relative;
	-webkit-mask-position: 50%;
	mask-position: 50%;
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat
}

.icon::before {
	content: '';
	background-color: currentColor;
	background-position: 50%;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	display: flex
}

.icon.coin:before {
	background: var(--coin)
}

.icon.energy:before {
	background: var(--energy)
}

.itemHorizontal {
	justify-content: space-between;
	align-items: center;
	/* width: 14.5rem; */
	width: 7rem;
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	--tw-duration: .3s;
	border-radius: 1.5rem;
	flex-shrink: 0;
	/* padding: .875rem; */
	padding: calc(var(--spacing)*2);
	transition-duration: .3s;
	display: flex;
	position: relative;
	overflow: hidden;
	height: 100%;
	max-height: 6.25rem;
	flex-direction: column-reverse;
	background-color: #16191E;
	background-position: center;
	background-size: 100%;

}

.itemHorizontal.consumer {
	/* --tw-gradient-position: to right in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-from: #505e70;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-from-position: 30%;
	--tw-gradient-via: #526781;
	--tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-via)var(--tw-gradient-via-position), var(--tw-gradient-to)var(--tw-gradient-to-position);
	--tw-gradient-via-position: 70%;
	--tw-gradient-to: #708093;
	--tw-gradient-to-position: 100% */
	/* background-color: #16191E; */
	background-image: url(/images/case/shadow-consumer.webp);
}

.itemHorizontal.industrial {
	/* --tw-gradient-position: to right in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-from: #79a0d0;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-from-position: 30%;
	--tw-gradient-via: #72a1db;
	--tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-via)var(--tw-gradient-via-position), var(--tw-gradient-to)var(--tw-gradient-to-position);
	--tw-gradient-via-position: 70%;
	--tw-gradient-to: #aed2ff;
	--tw-gradient-to-position: 100% */
	background-image: url(/images/case/shadow-industrial.webp);

}

.itemHorizontal.milspec {
	/* --tw-gradient-position: to right in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-from: #295fa2;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-from-position: 30%;
	--tw-gradient-via: #428ce8;
	--tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-via)var(--tw-gradient-via-position), var(--tw-gradient-to)var(--tw-gradient-to-position);
	--tw-gradient-via-position: 70%;
	--tw-gradient-to: #56a9ff;
	--tw-gradient-to-position: 100% */
	background-image: url(/images/case/shadow-milspec.webp);

}

.itemHorizontal.restricted {
	/* --tw-gradient-position: to right in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-from: #5a2b8c;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-from-position: 30%;
	--tw-gradient-via: #481979;
	--tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-via)var(--tw-gradient-via-position), var(--tw-gradient-to)var(--tw-gradient-to-position);
	--tw-gradient-via-position: 70%;
	--tw-gradient-to: #6106c2;
	--tw-gradient-to-position: 100% */
	background-image: url(/images/case/shadow-restricted.webp);

}

.itemHorizontal.classified {
	/* --tw-gradient-position: to right in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-from: #72206d;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-from-position: 30%;
	--tw-gradient-via: #a936ad;
	--tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-via)var(--tw-gradient-via-position), var(--tw-gradient-to)var(--tw-gradient-to-position);
	--tw-gradient-via-position: 70%;
	--tw-gradient-to: #d749e3;
	--tw-gradient-to-position: 100% */
	background-image: url(/images/case/shadow-classified.webp);

}

.itemHorizontal.covert {
	/* --tw-gradient-position: to right in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-from: #ac241e;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-from-position: 30%;
	--tw-gradient-via: #d43730;
	--tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-via)var(--tw-gradient-via-position), var(--tw-gradient-to)var(--tw-gradient-to-position);
	--tw-gradient-via-position: 70%;
	--tw-gradient-to: #f74c3d;
	--tw-gradient-to-position: 100% */
	background-image: url(/images/case/shadow-covert.webp);

}

.itemHorizontal.rare {
	/* --tw-gradient-position: to right in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-from: #d17c1c;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-from-position: 30%;
	--tw-gradient-via: #eca330;
	--tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-via)var(--tw-gradient-via-position), var(--tw-gradient-to)var(--tw-gradient-to-position);
	--tw-gradient-via-position: 70%;
	--tw-gradient-to: #f3c03a;
	--tw-gradient-to-position: 100% */
	background-image: url(/images/case/shadow-rare.webp);

}

.itemHorizontal.immortal {
	--tw-gradient-position: to right in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-from: #e26420;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-from-position: 30%;
	--tw-gradient-via: #ec5630;
	--tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-via)var(--tw-gradient-via-position), var(--tw-gradient-to)var(--tw-gradient-to-position);
	--tw-gradient-via-position: 70%;
	--tw-gradient-to: #ff9f31;
	--tw-gradient-to-position: 100%
}

.itemHorizontal__left {
    position: absolute;
    left: 10px;
	align-items: flex-start;
	/* gap: calc(var(--spacing)*4); */
	gap: calc(var(--spacing)*2);
	flex-direction: column;
	display: flex;
    width: 60px;
}

.itemHorizontal__info {
    width: 100%;
	/* gap: calc(var(--spacing)*1.5); */
	gap: calc(var(--spacing)*.5);
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	flex-direction: column;
	display: flex;
	/* display: none; */
}

:is(.itemHorizontal__info>*) {
	--tw-leading: 100%;
	line-height: 100%
}

.itemHorizontal__info p {
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height))
}

.itemHorizontal__info span {
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	color: #ffffff80
}

@supports (color:color-mix(in lab, red, red)) {
	.itemHorizontal__info span {
		color: color-mix(in oklab, var(--color-white)50%, transparent)
	}
}

.itemHorizontal__info * {
	word-break: break-all;
	text-overflow: ellipsis;
	white-space: nowrap;
	width: 100%;
	max-width: 6.5rem;
	overflow: hidden
}

.itemHorizontal__images {
	width: 100%;
	/* max-width: 6rem; */
	max-width: 4rem;
	position: relative;
}

.itemHorizontal__images .icon {
	--tw-translate-x: calc(calc(1/2*100%)*-1);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	--tw-translate-y: calc(calc(1/2*100%)*-1);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	/* font-size: 5rem; */
	font-size: var(--text-5xl);
	/* line-height: var(--tw-leading, var(--text-8xl--line-height)); */
	line-height: var(--tw-leading, var(--text-5xl--line-height));
	/* color: #ffffff26; */
	color: rgba(255, 255, 255, 0.08);
	position: absolute;
	top: 50%;
	left: 50%;

}

@supports (color:color-mix(in lab, red, red)) {
	.itemHorizontal__images .icon {
		/* color: color-mix(in oklab, var(--color-white)15%, transparent); */
		color: rgba(255, 255, 255, 0.08);
	}
}

.itemHorizontal__weapon {
	z-index: 1;
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	position: relative;
	/* max-height: 5rem; */
	max-height: 3rem;
	margin: 0 auto;
	object-fit: contain;
}

.itemHorizontal .sum .icon:before {
	background: #fff
}

.itemHorizontal__case {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	--tw-translate-x: calc(var(--spacing)*4);
	width: 100%;
	height: 100%;
	translate: var(--tw-translate-x)var(--tw-translate-y);
	opacity: 0;
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	justify-content: center;
	align-items: center;
	display: flex;
	position: absolute;
	rotate: 6deg;
	/* z-index: -1; */
}

.itemHorizontal__case img {
	object-fit: contain;
	width: 100%
}

.itemHorizontal__item {
	position: relative;
	max-height: 6.25rem;
}

.itemHorizontal__item:hover .itemHorizontal__case {
	--tw-translate-x: calc(var(--spacing)*0);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	opacity: 1;
	rotate: none;
	z-index: 1
}

.itemHorizontal__item:hover .itemHorizontal__weapon {
	--tw-translate-x: calc(var(--spacing)*-4);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	opacity: 0;
	rotate: -12deg
}

.itemHorizontal__item:hover .itemHorizontal__info {
	--tw-translate-y: 100%;
	translate: var(--tw-translate-x)var(--tw-translate-y);
	opacity: 0
}

.itemHorizontal__item:hover .itemHorizontal__user {
	/* --tw-translate-y: calc(var(--spacing)*0); */
	--tw-translate-y: 8px;
	translate: var(--tw-translate-x)var(--tw-translate-y);
	opacity: 1
}

.itemHorizontal__user {
	bottom: calc(var(--spacing)*3);
	--tw-translate-y: -100%;
	translate: var(--tw-translate-x)var(--tw-translate-y);
	align-items: center;
	gap: calc(var(--spacing)*1.5);
	padding: calc(var(--spacing)*.5);
	padding-right: calc(var(--spacing)*2);
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	opacity: 0;
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	/* background-color: #ffffff14; */
	background-color: rgba(10, 16, 32, 0.5);
	border-radius: 3.40282e38px;
	display: flex;
	position: absolute;
	/* left: .875rem; */
	left: .5rem;
	z-index: 2;
}

.itemHorizontal__user:hover {
	background: rgba(10, 16, 32, 0.8);
}

/* @supports (color:color-mix(in lab, red, red)) {
	.itemHorizontal__user {
		background-color: color-mix(in oklab, var(--color-white)8%, transparent)
	}
}

@media (hover:hover) {
	.itemHorizontal__user:hover {
		background-color: #ffffff26
	}

	@supports (color:color-mix(in lab, red, red)) {
		.itemHorizontal__user:hover {
			background-color: color-mix(in oklab, var(--color-white)15%, transparent)
		}
	}
} */

.itemHorizontal__user img {
	width: calc(var(--spacing)*6);
	height: calc(var(--spacing)*6);
	border-radius: 3.40282e38px
}

.itemHorizontal__user span {
	word-break: break-all;
	text-overflow: ellipsis;
	white-space: nowrap;
	width: 100%;
	max-width: 3.5rem;
	overflow: hidden
}

.banners {
	gap: calc(var(--spacing)*4);
	flex-direction: column;
	/* padding-top: .75rem; */
	display: flex;
	position: relative
}

@media (min-width:1001px) {
	.banners {
		flex-direction: row;
		align-items: stretch
	}
}

.banners__event {
	--tw-gradient-position: to bottom in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-from: #16191E;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-from-position: 80%;
	--tw-gradient-to: #1E2229;
	border-radius: 1.5rem;
	width: 100%;
	position: relative;
}

@media (min-width:1001px) {
	.banners__event {
		max-width: 29.1875rem
	}
}

.banners__event-body {
	z-index: 1;
	align-items: center;
	gap: calc(var(--spacing)*3);
	padding: calc(var(--spacing)*3);
	flex-wrap: wrap;
	display: flex;
	position: relative
}

@media (min-width:651px) {
	.banners__event-body {
		gap: calc(var(--spacing)*4);
		padding: calc(var(--spacing)*4)
	}
}

.banners__event-overlay {
	z-index: 1;
	z-index: 2;
	justify-content: center;
	gap: calc(var(--spacing)*3);
	width: 100%;
	padding: calc(var(--spacing)*6);
	flex-direction: column;
	display: flex;
	position: relative
}

@media (min-width:1001px) {
	.banners__event-overlay {
		gap: calc(var(--spacing)*4)
	}
}

.banners__event-overlay h2 {
	max-width: 50%;
	font-size: var(--text-2xl);
	line-height: var(--tw-leading, var(--text-2xl--line-height));
	--tw-leading: 100%;
	--tw-font-weight: var(--font-weight-bold);
	line-height: 100%;
	font-weight: var(--font-weight-bold)
}

@media (min-width:1001px) {
	.banners__event-overlay h2 {
		font-size: var(--text-3xl);
		line-height: var(--tw-leading, var(--text-3xl--line-height))
	}
}

.banners__event-image {
	width: 100%;
	display: flex;
	position: relative
}

.banners__event-image * {
	pointer-events: none
}

.banners__event-image-bg {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	border-radius: var(--radius-3xl);
	object-fit: cover;
	width: 100%;
	height: 100%;
	position: absolute;
	object-position: right
}

.banners__event-timer {
	align-items: center;
	gap: calc(var(--spacing)*2);
	display: flex
}

.banners__event-timer-item {
	width: calc(var(--spacing)*16);
	height: calc(var(--spacing)*16);
	justify-content: center;
	align-items: center;
	gap: calc(var(--spacing)*1);
	border-radius: var(--radius-2xl);
	--tw-gradient-position: to bottom in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-from: #2A2E38;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-to: #1E2229;
	--tw-gradient-to-position: 75%;
	flex-direction: column;
	flex-shrink: 0;
	display: flex
}

:is(.banners__event-timer-item>*) {
	--tw-leading: 100%;
	line-height: 100%
}

.banners__event-timer-item p {
	--tw-font-weight: var(--font-weight-medium);
	font-size: .7rem;
	font-weight: var(--font-weight-medium);
	color: var(--gray-light);
	text-transform: uppercase
}

.banners__event-timer-item span {
	font-size: var(--text-2xl);
	line-height: var(--tw-leading, var(--text-2xl--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold);
	color: #38A0FF
}

.banners__event-btn {
	height: calc(var(--spacing)*11);
	--tw-gradient-position: to bottom in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-from: #2A2E38;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-to: #1E2229;
	padding-inline: calc(var(--spacing)*5);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-semibold);
	font-weight: var(--font-weight-semibold);
	--tw-shadow: inset 0 .25rem .375rem var(--tw-shadow-color, #ffffff26);
	box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
	border-radius: 3.40282e38px;
	justify-content: center;
	align-items: center;
	display: flex;
	position: relative
}

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

.banners__event-btn:before {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	--tw-gradient-position: to bottom in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-from: #303541;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-to: #2A2E38;
	opacity: 0;
	--tw-shadow: inset 0 .25rem .375rem var(--tw-shadow-color, #ffffff26);
	width: 100%;
	height: 100%;
	box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
	transition-property: opacity;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	--tw-content: "";
	content: var(--tw-content);
	border-radius: 3.40282e38px;
	position: absolute
}

.banners__event-btn:hover:before {
	opacity: 1
}

.banners__event-info {
	align-items: center;
	gap: calc(var(--spacing)*5);
	display: flex
}

@media (min-width:651px) {
	.banners__event-info {
		gap: calc(var(--spacing)*6)
	}
}

.banners__event-info-item {
	align-items: flex-start;
	gap: calc(var(--spacing)*2.5);
	display: flex
}

.banners__event-info-item .icon {
	top: calc(var(--spacing)*.5);
	position: relative
}

@media (min-width:651px) {
	.banners__event-info-item .icon {
		font-size: var(--text-lg);
		line-height: var(--tw-leading, var(--text-lg--line-height))
	}
}

.banners__event-info-item .icon:before {
	--tw-gradient-position: to bottom in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-from: #0069F3;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-to: #38AFFF
}

.banners__event-info-item-txt {
	gap: calc(var(--spacing)*1);
	flex-direction: column;
	flex: 1;
	display: flex
}

:is(.banners__event-info-item-txt>*) {
	--tw-leading: 100%;
	line-height: 100%
}

.banners__event-info-item-txt p {
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray-light)
}

.banners__event-info-item-txt span {
	font-size: var(--text-base);
	line-height: var(--tw-leading, var(--text-base--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold)
}

@media (min-width:651px) {
	.banners__event-info-item-txt span {
		font-size: var(--text-xl);
		line-height: var(--tw-leading, var(--text-xl--line-height))
	}
}

.banners__list {
	align-items: stretch;
	gap: calc(var(--spacing)*4);
	flex-direction: column;
	display: none;
	position: relative;
}

@media (min-width:651px) {
	.banners__list {
		flex-direction: row;
		flex: 1;
		display: flex
	}
}

.banners__list-item {
	border-radius: var(--radius-3xl);
	width: 100%;
	height: 16rem;
	position: relative
}

@media not all and (min-width:1000px) {
	.banners__list-item {
		align-items: center;
		display: flex
	}
}

@media (min-width:1001px) {
	.banners__list-item {
		height: 100%
	}
}

.banners__list-item.vip {
	--tw-gradient-position: to bottom right in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	/* --tw-gradient-from: #c85929; */
	--tw-gradient-from: rgba(200, 89, 41, 0.6);
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-from-position: 9%;
	/* --tw-gradient-to: #ffae19; */
	--tw-gradient-to: rgba(255, 174, 25, 0.1);
	--tw-gradient-to-position: 78%
}

.banners__list-item.giveaway {
	--tw-gradient-position: to bottom right in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	/* --tw-gradient-from: #a319ff; */
	--tw-gradient-from: rgba(163, 25, 255, 0.6);
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-from-position: 9%;
	/* --tw-gradient-to: #5529c8; */
	--tw-gradient-to: rgba(86, 41, 200, 0.1);
	--tw-gradient-to-position: 78%
}

.banners__list-item.refferal {
	--tw-gradient-position: to bottom right in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	/* --tw-gradient-from: #e01495; */
	--tw-gradient-from: rgba(224, 20, 149, 0.6);
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-from-position: 9%;
	/* --tw-gradient-to: #7714e0; */
	--tw-gradient-to: rgba(119, 20, 224, 0.1);
	--tw-gradient-to-position: 78%
}

.banners__list-item.event {
	--tw-gradient-position: to bottom right in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-from: #002897;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-from-position: 9%;
	--tw-gradient-to: #27b2ff;
	--tw-gradient-to-position: 78%
}

.gw1 {
	background: #16191E !important;
	/* background: linear-gradient(#2A2E38, #1E2229) !important; */
	/* background: linear-gradient(135deg, #1E2229, #16191E) !important; */
	/* background: linear-gradient(135deg, #1E2229, #16191E) !important; */
	transition: background 0.2s;
	overflow: hidden;
}

.gw1:hover {
	background: #1E2229 !important;
}

/* body:not(.animate_on) .banners__list-item:hover .banners__list-item-image img {
	scale: 1.05
} */

.banners__list-item:hover .banners__list-item-info .icon {
	opacity: 1
}

.banners__list-item-info {
	z-index: 2;
	gap: calc(var(--spacing)*2);
	height: 100%;
	padding: calc(var(--spacing)*5);
	flex-direction: column;
	display: flex;
	position: relative
}

@media not all and (min-width:650px) {
	.banners__list-item-info {
		justify-content: center
	}
}

.banners__list-item-info .icon {
	font-size: var(--text-2xl);
	line-height: var(--tw-leading, var(--text-2xl--line-height));
	opacity: .4;
	transition-property: opacity;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration))
}

.banners__list-item-top {
	gap: calc(var(--spacing)*1.5);
	flex-direction: column;
	display: flex;
	line-height: 100%
}

:is(.banners__list-item-top>*) {
	--tw-leading: 100%;
	line-height: 100%
}

.banners__list-item span {
	font-size: var(--text-2xl);
	line-height: var(--tw-leading, var(--text-2xl--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold);
	line-height: 100%
}

.banners__list-item p {
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-leading: 130%;
	color: #ffffffbf;
	line-height: 130%
}

@supports (color:color-mix(in lab, red, red)) {
	.banners__list-item p {
		color: color-mix(in oklab, var(--color-white)75%, transparent)
	}
}

.banners__list-item-top p span {
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	color: var(--color-white);
	display: inline-block
}

.banners__list-item-top.gray p {
	color: var(--gray-light)
}

.banners__list-item-image {
	bottom: 0;
	left: calc(var(--spacing)*0);
	border-radius: var(--radius-3xl);
	width: 100%;
	height: calc(100% - 40px);
	position: absolute;
	overflow: hidden
}

.banners__list-item-image img {
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	position: absolute;
	bottom: -15%;
	scale: .95;
	width: 100%;
	height: 100%;
	object-fit: contain
}

@media not all and (min-width:650px) {
	.banners__list-item-image img {
		right: calc(var(--spacing)*0);
		max-width: 8rem;
		max-height: 8rem
	}
}

@media (min-width:651px) {
	.banners__list-item-image img {
		--tw-translate-x: calc(calc(1/2*100%)*-1);
		translate: var(--tw-translate-x)var(--tw-translate-y);
		bottom: -30%;
		left: 50%
	}
}

@media (min-width:1001px) {
	.banners__list-item-image img {
		bottom: -15%
	}
}

.games {
	gap: calc(var(--spacing)*4);
	grid-template-columns: repeat(2, minmax(0, 1fr));
	display: grid
}

@media (min-width:991px) {
	.games {
		grid-template-columns: repeat(4, minmax(0, 1fr))
	}
}

.games__item {
	border-radius: var(--radius-3xl);
	--tw-gradient-position: to bottom in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-from: #202a50;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-from-position: 20%;
	--tw-gradient-to: #5465a6;
	height: 8rem;
	padding: calc(var(--spacing)*5);
	display: flex;
	position: relative
}

@media (min-width:526px) {
	.games__item {
		align-items: center
	}
}

body:not(.animate_on) .games__item:hover .games__item-image img {
	scale: 1.1
}

.games__item:hover .games__item-top .icon {
	opacity: 1
}

.games__item:hover:before {
	border-style: var(--tw-border-style);
	opacity: 1;
	border-width: 2px;
	border-color: #a6e1ff
}

.games__item:before {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	z-index: 1;
	border-radius: var(--radius-3xl);
	border-style: var(--tw-border-style);
	--tw-gradient-position: to bottom in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-from: #3d4876;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-from-position: 20%;
	--tw-gradient-to: #4ed0ff;
	opacity: 0;
	width: 100%;
	height: 100%;
	transition-property: opacity;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	--tw-content: "";
	content: var(--tw-content);
	border-width: 2px;
	border-color: #0000;
	position: absolute
}

.games__item-top {
	z-index: 3;
	position: relative
}

.games__item-top span {
	font-size: var(--text-xl);
	line-height: var(--tw-leading, var(--text-xl--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold)
}

@media (min-width:526px) {
	.games__item-top span {
		font-size: var(--text-2xl);
		line-height: var(--tw-leading, var(--text-2xl--line-height))
	}
}

.games__item-top .icon {
	font-size: var(--text-lg);
	line-height: var(--tw-leading, var(--text-lg--line-height));
	opacity: .4;
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration))
}

@media (min-width:526px) {
	.games__item-top .icon {
		font-size: var(--text-2xl);
		line-height: var(--tw-leading, var(--text-2xl--line-height))
	}
}

.games__item-image {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	z-index: 1;
	border-radius: var(--radius-3xl);
	width: 100%;
	height: 100%;
	position: absolute;
	overflow: hidden
}

.games__item-image img {
	max-height: 8rem;
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	position: absolute;
	bottom: -25%;
	right: -5%;
	object-fit: contain
}

@media (min-width:526px) {
	.games__item-image img {
		height: 9rem;
		width: 12rem;
		bottom: -35%;
		max-height: 12rem
	}
}

.cases {
	gap: calc(var(--spacing)*4);
	flex-direction: column;
	display: flex
}

@media not all and (min-width:470px) {
	.cases {
		border-radius: var(--radius-3xl);
		background-color: #16191E;
		padding: 1rem
	}
}

@media (min-width:471px) {
	.cases {
		gap: calc(var(--spacing)*4)
	}
}

.cases__top {
	left: calc(var(--spacing)*0);
	z-index: 3;
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	justify-content: space-between;
	align-items: flex-start;
	display: flex
}

@media not all and (min-width:930px) {
	.cases__top {
		flex-direction: row-reverse
	}
}

@media not all and (min-width:740px) {
	.cases__top {
		flex-direction: column
	}
}

@media (min-width:471px) {
	.cases__top {
		border-radius: var(--radius-3xl);
		background-color: #16191E;
		padding: .75rem;
	}
}

@media (min-width:741px) {
	.cases__top {
		align-items: center
	}
}

@media (min-width:471px) {
	.cases__top.shown {
		z-index: 10;
		background-color: #1E2229
	}

	.cases__top.shown .cases__select-game {
		background-color: #27355c
	}

	.cases__top.shown .cases__select-game-btn {
		color: #748ac5;
		background-color: #334474
	}

	@media (hover:hover) {
		.cases__top.shown .cases__select-game-btn:hover {
			color: var(--color-white);
			background-color: #3d4f81
		}
	}

	.cases__top.shown .cases__select-game-btn.active {
		color: var(--color-white)
	}

	.cases__top.shown .form-input__wrapp input,
	.cases__top.shown .cases__prices {
		background-color: #27355c
	}

	.cases__top.shown .checkbox__button-el {
		background-color: #2a3961
	}

	.cases__top.shown .checkbox__button:hover .checkbox__button-el {
		background-color: #2e3f6d
	}
}

.cases__top-left {
	align-items: center;
	gap: calc(var(--spacing)*4);
	display: flex
}

@media not all and (min-width:930px) {
	.cases__top-left .cases__select-game {
		margin-bottom: 12px;
		width: 100%
	}

	.cases__top-left {
		width: 100%
	}
}

@media not all and (min-width:740px) {
	.cases__top-left .btn-gray {
		display: none
	}
}

.cases__select-game {
	justify-content: center;
	align-items: center;
	gap: calc(var(--spacing)*2);
	border-radius: var(--radius-3xl);
	height: 3.5rem;
	padding-inline: calc(var(--spacing)*4);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #1E2229;
	display: flex
}

.cases__select-game-btn {
	width: 2.3rem;
	height: 2.3rem;
	font-size: var(--text-xl);
	line-height: var(--tw-leading, var(--text-xl--line-height));
	color: var(--gray);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #2A2E38;
	border-radius: 3.40282e38px;
	justify-content: center;
	align-items: center;
	display: flex
}

@media (hover:hover) {
	.cases__select-game-btn:hover {
		color: var(--color-white);
		background-color: #303541
	}
}

.cases__select-game-btn.active {
	color: var(--color-white);
	background: var(--primary-gradient);
	box-shadow: var(--shadow-primary)
}

.cases__top-right {
	align-items: center;
	gap: calc(var(--spacing)*3)
}

@media not all and (min-width:930px) {
	.cases__top-right {
		flex-direction: row-reverse
	}
}

@media not all and (min-width:470px) {
	.cases__top-right {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		display: grid
	}
}

@media (min-width:471px) {
	.cases__top-right {
		display: flex
	}
}

@media (min-width:741px) {
	.cases__top-right {
		gap: calc(var(--spacing)*4)
	}
}

.cases__top-right .form-input {
	width: fit-content
}

@media not all and (min-width:470px) {
	.cases__top-right .checkbox {
		padding-block: calc(var(--spacing)*2);
		order: 1
	}
}

.cases__prices {
	border-radius: var(--radius-3xl);
	background-color: #1E2229;
	justify-content: center;
	align-items: stretch;
	height: 3.5rem;
	display: flex;
	position: relative
}

@media (min-width:471px) {
	.cases__prices {
		width: 14rem
	}
}

.cases__prices .form-input__wrapp {
	flex: 1
}

.cases__prices .form-input__wrapp input {
	text-align: center
}

.cases__prices-slider {
	bottom: calc(var(--spacing)*0);
	margin-left: calc(var(--spacing)*-1);
	--tw-translate-x: calc(calc(1/2*100%)*-1);
	width: 90%;
	translate: var(--tw-translate-x)var(--tw-translate-y);
	position: absolute;
	left: 50%
}

.cases__prices-divider {
	height: calc(var(--spacing)*4);
	--tw-translate-x: calc(calc(1/2*100%)*-1);
	width: 2px;
	translate: var(--tw-translate-x)var(--tw-translate-y);
	--tw-translate-y: calc(calc(1/2*100%)*-1);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	background-color: #515e82;
	position: absolute;
	top: 50%;
	left: 50%
}

.cases__list {
	gap: calc(var(--spacing)*4);
	flex-direction: column;
	display: flex
}

@media (min-width:471px) {
	.cases__list {
		--tw-gradient-position: to bottom in oklab;
		background-image: linear-gradient(var(--tw-gradient-stops));
		--tw-gradient-from: #16191E;
		--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
		--tw-gradient-to: #1E2229;
		border-radius: 1.75rem;
		padding: 1.75rem
	}
}

.cases__block {
	gap: calc(var(--spacing)*4);
	flex-direction: column;
	display: flex
}

.cases__head {
	align-items: center;
	gap: calc(var(--spacing)*2);
	justify-content: space-between;
	display: flex;
	position: relative
}

.cases__head>span {
	font-size: var(--text-xl);
	line-height: var(--tw-leading, var(--text-xl--line-height));
	--tw-leading: 100%;
	--tw-font-weight: var(--font-weight-bold);
	line-height: 100%;
	font-weight: var(--font-weight-bold)
}

@media (min-width:471px) {
	.cases__head>span {
		font-size: var(--text-3xl);
		line-height: var(--tw-leading, var(--text-3xl--line-height))
	}
}

.cases__head .dropdown__btn--small {
	padding-inline: calc(var(--spacing)*4);
	color: var(--gray-light)
}

@media (hover:hover) {
	.cases__head .dropdown__btn--small:hover {
		color: var(--color-white)
	}
}

@media (min-width:581px) {
	.cases__head .dropdown__btn--small {
		top: calc(var(--spacing)*3);
		right: calc(var(--spacing)*0);
		position: absolute
	}
}

.cases__head .dropdown__btn--small:not(.closed) i {
	top: calc(var(--spacing)*.5);
	position: relative;
	rotate: -135deg
}

.cases__cases {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	display: grid;
	position: relative
}

@media (min-width:496px) {
	.cases__cases {
		grid-template-columns: repeat(3, minmax(0, 1fr))
	}
}

@media (min-width:741px) {
	.cases__cases {
		grid-template-columns: repeat(4, minmax(0, 1fr))
	}
}

@media (min-width:861px) {
	.cases__cases {
		grid-template-columns: repeat(5, minmax(0, 1fr))
	}
}

.cases__case {
	justify-content: center;
	align-items: center;
	gap: calc(var(--spacing)*2);
	flex-direction: column;
	display: flex;
	position: relative;
	padding-inline: calc(var(--spacing) * 2);
	padding-block: calc(var(--spacing) * 4)
	transition-property: transform;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
}

body:not(.animate_on) .cases__case:hover {
	transform: translateY(-3px) scale(1.05);
}


.cases__case:hover .cases__case-bg {
	opacity: 1
}


@media (min-width:496px) {
	.cases__case {
		padding-inline: calc(var(--spacing)*4);
		padding-block: calc(var(--spacing)*6)
	}
}

.cases__case .sum.sum--bgWhite.cases__sum {
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #2A2E38
}

.cases__case .sum.sum--bgWhite.cases__sum .icon:before {
	background: var(--coin)
}

.cases__case-img {
	position: relative
}

.cases__case img {
	max-height: 12.5rem;
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration))
}

.cases__case-name {
	text-align: center;
	width: 100%;
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray-light);
	position: relative;
	z-index: 1
}

.cases__case-bg {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	--tw-gradient-position: to bottom in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-from: #1E2229;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-from-position: 57%;
	--tw-gradient-to: #3095fd;
	opacity: 0;
	width: 100%;
	height: 100%;
	transition-property: opacity;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	border-radius: 2rem;
	padding: 2px;
	position: absolute
}

@media (min-width:991px) {
	.cases__case:before {
		border-radius: 3rem
	}
}

.cases__case-bg-inner {
	--tw-gradient-position: to bottom in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-from: #1E2229;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-from-position: 38%;
	--tw-gradient-to: #1f2d56;
	border-radius: 2rem;
	width: 100%;
	height: 100%
}

@media (min-width:991px) {
	.cases__case-bg-inner {
		border-radius: 3rem
	}
}

.cases__arrow-icon {
	top: calc(var(--spacing)*6);
	right: calc(var(--spacing)*6);
	font-size: var(--text-2xl);
	line-height: var(--tw-leading, var(--text-2xl--line-height));
	opacity: 0;
	transition-property: opacity;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	position: absolute
}

.cases__arrow-icon:before {
	background-color: #ffffff4d
}

@supports (color:color-mix(in lab, red, red)) {
	.cases__arrow-icon:before {
		background-color: color-mix(in oklab, var(--color-white)30%, transparent)
	}
}

.cases__view.sum {
	bottom: calc(var(--spacing)*14);
	margin-top: calc(var(--spacing)*-4);
	--tw-translate-x: calc(calc(1/2*100%)*-1);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	opacity: 0;
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background: var(--primary-gradient);
	box-shadow: var(--shadow-primary);
	position: absolute;
	left: 50%
}

.cases__clear-all-mobile.btn-gray {
	order: 1
}

@media (min-width:471px) {
	.cases__clear-all-mobile.btn-gray {
		display: none
	}
}

.modal {
	width: 22rem;
	color: var(--color-white);
	background-color: #1E2229;
	border-radius: 1.5rem;
	position: relative
}

.modal__body {
	gap: calc(var(--spacing)*4);
	padding: calc(var(--spacing)*6);
	flex-direction: column;
	display: flex
}

.modal .page__controls-right-inner {
	background-color: #2A2E38
}

.modal .page__controls-right-inner .checkbox__button-el {
	background-color: #1E2229
}

.modal .page__controls-right-inner .checkbox:hover .checkbox__button-el {
	background-color: #141b30
}

.modal .form-input .form-input__wrapp input,
.modal .form-input .form-input__wrapp .input {
	background-color: #2A2E38
}

:is(.modal .form-input .form-input__wrapp input, .modal .form-input .form-input__wrapp .input):focus {
	background-color: #1f2c4c
}

@media (hover:hover) {

	:is(.modal .form-input .form-input__wrapp input, .modal .form-input .form-input__wrapp .input):not(:disabled):hover,
	.modal .form-input button.form-input__wrapp:hover {
		background-color: #1f2c4c
	}
}

.modal__body-desc {
	justify-content: center;
	align-items: center;
	gap: calc(var(--spacing)*1.5);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	color: var(--gray-light);
	display: flex
}

.modal__body-desc span {
	align-items: center;
	gap: calc(var(--spacing)*1.5);
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--color-white);
	display: flex
}

.modal .dropdown__inner {
	background-color: #2a375a
}

@media (hover:hover) {
	.modal .dropdown__inner .dropdown__link:hover {
		background-color: #384770
	}
}

.auth,
.auth__image {
	position: relative;
}

.auth__image-overlay {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	z-index: 1;
	justify-content: flex-end;
	gap: calc(var(--spacing)*4);
	width: 100%;
	min-height: 19rem;
	padding: calc(var(--spacing)*5);
	flex-direction: column;
	display: flex;
	position: relative
}

.auth__image img {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	object-fit: cover
}

.auth__image {
	position: relative;
	display: flex;
	flex-direction: column
}

.auth__image-overlay .header__logotype-wrapp {
	width: calc(var(--spacing)*6);
	height: calc(var(--spacing)*6)
}

.auth__image-overlay .header__logotype-wrapp img {
	top: calc(var(--spacing)*-1)
}

.auth__image-overlay .header__logotype {
	font-size: var(--text-xl);
	line-height: var(--tw-leading, var(--text-xl--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold)
}

.auth__image-title {
	font-size: var(--text-2xl);
	line-height: var(--tw-leading, var(--text-2xl--line-height));
	--tw-leading: 100%;
	--tw-font-weight: var(--font-weight-bold);
	line-height: 100%;
	font-weight: var(--font-weight-bold)
}

.auth__image-bottom {
	justify-content: space-between;
	align-items: flex-end;
	gap: calc(var(--spacing)*4);
	display: flex
}

.auth__image-bottom .sum {
	flex-shrink: 0
}

.auth__image-bottom .sum .icon:before {
	background: var(--coin)
}

.auth__desc {
	gap: calc(var(--spacing)*1.5);
	padding-bottom: calc(var(--spacing)*1);
	flex-direction: column;
	display: flex
}

:is(.auth__desc>*) {
	--tw-leading: 100%;
	line-height: 100%
}

.auth__desc span {
	font-size: var(--text-2xl);
	line-height: var(--tw-leading, var(--text-2xl--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold)
}

.auth__desc p {
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray-light)
}

.auth__buttons {
	gap: calc(var(--spacing)*2);
	grid-template-columns: repeat(2, minmax(0, 1fr));
	display: grid
}

.auth__buttons .fill {
	grid-column: span 2/span 2
}

.auth__button {
	justify-content: center;
	align-items: center;
	gap: calc(var(--spacing)*3);
	padding-block: calc(var(--spacing)*3);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray-light);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #222f51;
	border-radius: 1rem;
	display: flex
}

@media (hover:hover) {
	.auth__button:hover {
		color: var(--color-white);
		background-color: #2d3c66
	}
}

.auth__button .icon {
	font-size: var(--text-base);
	line-height: var(--tw-leading, var(--text-base--line-height))
}

.confirm .modal__body {
	padding: calc(var(--spacing)*8)
}

.confirm .auth__desc {
	align-items: center;
	gap: calc(var(--spacing)*4);
	text-align: center
}

.confirm~.is-close {
	display: none
}

.confirm .btn__inner-left {
	text-align: center;
	align-items: center
}

.confirm .btn__inner {
	justify-content: center;
	width: 100%
}

.confirm__sum {
	font-size: var(--text-xl);
	line-height: var(--tw-leading, var(--text-xl--line-height));
	justify-content: center;
	align-items: center;
	display: flex
}

.sum {
	align-items: center;
	gap: calc(var(--spacing)* 1);
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold);
	display: flex;
	white-space: nowrap
}

.sum.sum--sm {
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height))
}

.sum.sum--xs {
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height))
}

.sum.sum--xs .icon {
	font-size: .75rem;
	line-height: var(--tw-leading, var(--text-sm--line-height))
}

.sum.sum--xs.sum--bgWhite {
	padding-inline: calc(var(--spacing)*1.25);
	padding-block: calc(var(--spacing)*0.75);
	gap: .2rem
}

.sum.sum--bgWhite {
	padding-inline: calc(var(--spacing)*2);
	padding-block: calc(var(--spacing)*1.5);
	background-color: #ffffff1f;
	border-radius: 3.40282e38px
}

@supports (color:color-mix(in lab, red, red)) {
	.sum.sum--bgWhite {
		background-color: color-mix(in oklab, var(--color-white)12%, transparent)
	}
}

.sum .icon {
	font-size: var(--text-lg);
	line-height: var(--tw-leading, var(--text-lg--line-height))
}

.dropdown {
	position: relative
}

.dropdown__btn--small {
	height: calc(var(--spacing)*11);
	align-items: center;
	gap: calc(var(--spacing)*2);
	padding-right: calc(var(--spacing)*3);
	padding-left: calc(var(--spacing)*3);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #1E2229;
	border-radius: 3.40282e38px;
	display: flex
}

@media (hover:hover) {
	.dropdown__btn--small:hover {
		background-color: #2A2E38
	}
}

.dropdown__btn--small img {
	width: calc(var(--spacing)*5)
}

.dropdown__btn--small i {
	height: calc(var(--spacing)*1.5);
	width: calc(var(--spacing)*1.5);
	border-right-style: var(--tw-border-style);
	border-right-width: 2px;
	border-bottom-style: var(--tw-border-style);
	color: var(--gray);
	border-bottom-width: 2px;
	border-bottom-color: currentColor;
	border-right-color: currentColor;
	flex-shrink: 0;
	rotate: 45deg
}

.dropdown__inner {
	visibility: hidden;
	top: calc(100% + .5rem);
	left: calc(var(--spacing)*0);
	transform-origin: 0 0;
	--tw-scale-x: 95%;
	--tw-scale-y: 95%;
	--tw-scale-z: 95%;
	width: max-content;
	scale: var(--tw-scale-x)var(--tw-scale-y);
	border-radius: var(--radius-2xl);
	padding: calc(var(--spacing)*2);
	white-space: nowrap;
	opacity: 0;
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #2A2E38;
	flex-direction: column;
	flex-shrink: 0;
	display: flex;
	position: absolute
}

.dropdown__link {
	align-items: center;
	gap: calc(var(--spacing)*2);
	border-radius: var(--radius-xl);
	width: 100%;
	padding-inline: calc(var(--spacing)*3);
	padding-block: calc(var(--spacing)*2);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray-hover);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	flex-shrink: 0;
	display: flex
}

@media (hover:hover) {
	.dropdown__link:hover {
		color: var(--color-white);
		background-color: #303541
	}
}

.dropdown__link img {
	width: calc(var(--spacing)*6);
	height: calc(var(--spacing)*6);
	border-radius: 3.40282e38px
}

.dropdown__link.active {
	color: var(--color-white);
	background-color: #1E2229
}

.dropdown.active {
	z-index: 10
}

.dropdown.active .dropdown__inner {
	visibility: visible;
	--tw-scale-x: 100%;
	--tw-scale-y: 100%;
	--tw-scale-z: 100%;
	scale: var(--tw-scale-x)var(--tw-scale-y);
	opacity: 1
}

.dropdown.dropdown--reverse .dropdown__inner {
	top: inherit;
	z-index: 10;
	bottom: calc(100% + .5rem)
}

.dropdown.dropdown--right .dropdown__inner {
	right: calc(var(--spacing)*0);
	left: inherit;
	transform-origin: 100% 0
}

.btn {
	height: 4.5rem!important;
	/* height: 3rem !important; */
	padding-inline: calc(var(--spacing)*4);
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	display: flex;
	position: relative
}

.btn__inner {
	pointer-events: none;
	z-index: 2;
	justify-content: center;
	align-items: center;
	gap: calc(var(--spacing)*3);
	width: 100%;
	height: 100%;
	display: flex;
	position: relative
}

.btn__inner .icon {
	font-size: var(--text-lg);
	line-height: var(--tw-leading, var(--text-lg--line-height))
}

.btn__inner-left {
	gap: 0.625rem;
	/* flex-direction: column; */
	display: flex
}

.caseText1 {
    width: 100%;
    text-align: center;
    justify-content: center;
}

:is(.btn__inner-left>*) {
	--tw-leading: 100%;
	line-height: 100%
}

.btn__inner-left p {
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	color: #ffffffa6
}

@supports (color:color-mix(in lab, red, red)) {
	.btn__inner-left p {
		color: color-mix(in oklab, var(--color-white)65%, transparent)
	}
}

.header__right .btn:before, .header__right .btn:after {
    display: none;
}

.btn:before {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	width: 100%;
	height: 100%;
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	--tw-content: "";
	content: var(--tw-content);
	background: var(--primary-gradient);
	box-shadow: var(--shadow-primary);
	border-radius: 1.25rem;
	position: absolute
}

.btn:after {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	opacity: 0;
	width: 100%;
	height: 100%;
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	--tw-content: "";
	content: var(--tw-content);
	background: var(--primary-gradient-hover);
	box-shadow: var(--shadow-primary-hover);
	border-radius: 1.25rem;
	position: absolute
}

.btn:hover:before {
	--tw-shadow: 0 0 #0000;
	box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
}

.btn:hover:after,
.btn:hover .btn__icon {
	opacity: 1
}

.btn__icon {
	top: calc(var(--spacing)*2);
	right: calc(var(--spacing)*2);
	z-index: 2;
	font-size: var(--text-lg);
	line-height: var(--tw-leading, var(--text-lg--line-height));
	opacity: .6;
	transition-property: opacity;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	position: absolute
}

/* .btn.btn--gray:before {
	box-shadow: none;
	background: linear-gradient(90deg, #1E2229, #29334f)
}

.btn.btn--gray:after {
	box-shadow: none;
	background: linear-gradient(90deg, #232f4d, #3b4665)
} */

.btn.btn--start .btn__inner {
	justify-content: flex-start
}

.btn.btn--center .btn__inner {
	text-align: center;
	justify-content: center;
	align-items: center
}

.btn.btn--justify .btn__inner {
	justify-content: space-between
}

.btn-gray {
	align-items: center;
	gap: calc(var(--spacing)*1.5);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-semibold);
	font-weight: var(--font-weight-semibold);
	color: var(--gray);
	text-transform: uppercase;
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	display: flex
}

@media (hover:hover) {
	.btn-gray:hover {
		color: var(--gray-light)
	}
}

@keyframes showLiveItem {
	0% {
		opacity: 0;
		transform: translate(-.75rem)
	}

	to {
		opacity: 100;
		transform: translate(0)
	}
}

.select-game {
	width: 24rem
}

@media (min-width:421px) {
	.select-game {
		width: 27.5rem
	}
}

.select-game__grid {
	gap: calc(var(--spacing)*3);
	grid-template-columns: repeat(2, minmax(0, 1fr));
	display: grid
}

.select-game__grid:hover .select-game__grid-item {
	opacity: .3
}

.select-game__grid-item {
	border-radius: var(--radius-3xl);
	width: 100%;
	padding: calc(var(--spacing)*6);
	font-size: var(--text-2xl);
	line-height: var(--tw-leading, var(--text-2xl--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold);
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	flex-direction: column;
	display: flex;
	position: relative;
	overflow: hidden
}

.select-game__grid-item span {
	z-index: 3;
	position: relative
}

.select-game__grid-item:before,
.select-game__grid-item:after {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	border-radius: var(--radius-3xl);
	--tw-gradient-position: to bottom right in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-to: #1d212f;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-content: "";
	content: var(--tw-content);
	width: 100%;
	height: 100%;
	position: absolute
}

.select-game__grid-item:after {
	z-index: 1;
	opacity: 0;
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration))
}

.select-game__grid-item.cs2:before {
	--tw-gradient-from: #894600;
	--tw-gradient-stops: var(--tw-gradient-via-stops);
	--tw-gradient-via: #ff8300;
	--tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-via)var(--tw-gradient-via-position), var(--tw-gradient-to)var(--tw-gradient-to-position)
}

.select-game__grid-item.cs2:after {
	--tw-gradient-from: #d37411;
	--tw-gradient-stops: var(--tw-gradient-via-stops);
	--tw-gradient-via: #ff9d00;
	--tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-via)var(--tw-gradient-via-position), var(--tw-gradient-to)var(--tw-gradient-to-position)
}

.select-game__grid-item.dota2:before {
	--tw-gradient-from: #700505;
	--tw-gradient-stops: var(--tw-gradient-via-stops);
	--tw-gradient-via: #ea2c2c;
	--tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-via)var(--tw-gradient-via-position), var(--tw-gradient-to)var(--tw-gradient-to-position)
}

.select-game__grid-item.dota2:after {
	--tw-gradient-from: #890000;
	--tw-gradient-stops: var(--tw-gradient-via-stops);
	--tw-gradient-via: #ff4340;
	--tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-via)var(--tw-gradient-via-position), var(--tw-gradient-to)var(--tw-gradient-to-position)
}

.select-game__grid-item.rust:before {
	--tw-gradient-from: #242f50;
	--tw-gradient-stops: var(--tw-gradient-via-stops);
	--tw-gradient-via: #353f5c;
	--tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-via)var(--tw-gradient-via-position), var(--tw-gradient-to)var(--tw-gradient-to-position)
}

.select-game__grid-item.rust:after {
	--tw-gradient-from: #2e3b62;
	--tw-gradient-stops: var(--tw-gradient-via-stops);
	--tw-gradient-via: #455278;
	--tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-via)var(--tw-gradient-via-position), var(--tw-gradient-to)var(--tw-gradient-to-position)
}

.select-game__grid-item:not(:last-child) {
	min-height: 17.5rem
}

.select-game__grid-item img {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	z-index: 2;
	object-fit: cover;
	width: 100%;
	height: 100%;
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	--tw-duration: .3s;
	transition-duration: .3s;
	position: absolute
}

.select-game__grid-item:hover {
	scale: 1.02;
	opacity: 1 !important
}

.select-game__grid-item:hover img {
	--tw-scale-x: 110%;
	--tw-scale-y: 110%;
	--tw-scale-z: 110%;
	scale: var(--tw-scale-x)var(--tw-scale-y)
}

.select-game__grid-item:hover:after {
	opacity: 1
}

.select-game__grid-item:last-child {
	grid-column: span 2/span 2;
	min-height: 9.375rem
}

.free-case {
	width: 24rem
}

.free-case .auth__desc span {
	font-size: 1.7rem;
	line-height: var(--tw-leading, var(--text-3xl--line-height))
}

.free-case .auth__desc p {
	--tw-leading: 140%;
	line-height: 140%
}

.free-case__wrapp {
	gap: calc(var(--spacing)*4);
	border-radius: var(--radius-3xl);
	padding: calc(var(--spacing)*4);
	background-color: #2A2E38;
	flex-direction: column;
	display: flex
}

.free-case__wrapp .banners__event-timer {
	width: 100%
}

.free-case__wrapp .banners__event-timer .banners__event-timer-item {
	--tw-gradient-from: #1E2229;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-to: #1E2229;
	flex: 1
}

.free-case__wrapp .banners__event-timer .banners__event-timer-item span {
	color: var(--color-white)
}

.free-case__wrapp .banners__event-timer .banners__event-timer-item p {
	color: var(--gray-light)
}

.free-case__promo-label {
	margin-inline: auto;
	margin-top: calc(var(--spacing)*-7);
	width: fit-content;
	padding-inline: calc(var(--spacing)*3);
	padding-block: calc(var(--spacing)*1.5);
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	background-color: #303541;
	border-radius: 3.40282e38px
}

.free-case__timer {
	gap: calc(var(--spacing)*2);
	flex-direction: column;
	display: flex
}

.free-case__promo-wrapp {
	justify-content: center;
	align-items: center;
	gap: calc(var(--spacing)*4);
	padding-top: calc(var(--spacing)*4);
	display: flex
}

.free-case__promo-wrapp span {
	font-size: var(--text-3xl);
	line-height: var(--tw-leading, var(--text-3xl--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold)
}

.free-case__img {
	z-index: calc(1*-1);
	--tw-translate-x: calc(calc(1/2*100%)*-1);
	max-width: fit-content;
	translate: var(--tw-translate-x)var(--tw-translate-y);
	--tw-translate-y: calc(calc(1/2*100%)*-1);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	position: absolute;
	top: 50%;
	left: 50%
}

.contract__wrapp {
	justify-content: space-between;
	align-items: stretch;
	gap: calc(var(--spacing)*4);
	flex-direction: column;
	display: flex;
	position: relative
}

@media (min-width:991px) {
	.contract__wrapp {
		flex-direction: row
	}
}

.contract__wrapp.win .contract__overlay-win {
	visibility: visible;
	opacity: 1
}

.contract__play {
	gap: calc(var(--spacing)*4);
	flex-direction: column;
	flex-shrink: 0;
	width: 100%;
	display: flex
}

@media (min-width:991px) {
	.contract__play {
		max-width: 27.75rem
	}
}

.contract__center {
	flex-direction: column;
	flex: 1;
	display: flex;
	position: relative
}

.contract__modes {
	gap: calc(var(--spacing)*3);
	grid-template-columns: repeat(3, minmax(0, 1fr));
	display: grid
}

.contract__modes:hover .contract__mode {
	opacity: .3
}

.contract__mode {
	border-radius: var(--radius-3xl);
	--tw-gradient-position: to bottom right in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-from: #1E2229;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-from-position: 30%;
	min-height: 9rem;
	padding: calc(var(--spacing)*3);
	opacity: .3;
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	flex-direction: column;
	justify-content: space-between;
	display: flex;
	position: relative;
	overflow: hidden
}

@media (min-width:476px) {
	.contract__mode {
		min-height: 11rem
	}
}

.contract__mode.low {
	--tw-gradient-to: #91bd26;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position))
}

.contract__mode.low .contract__mode-coeff {
	--tw-gradient-from: #486e0a;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-to: #cbff28
}

.contract__mode.medium {
	--tw-gradient-to: #bd8326;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position))
}

.contract__mode.medium .contract__mode-coeff {
	--tw-gradient-from: #99630b;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-to: #ffaa21
}

.contract__mode.high {
	--tw-gradient-to: #d42d2d;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position))
}

.contract__mode.high .contract__mode-coeff {
	--tw-gradient-from: #a40d0d;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-to: #ff3737
}

.contract__mode.active {
	opacity: 1
}

.contract__mode:hover {
	--tw-scale-x: 105%;
	--tw-scale-y: 105%;
	--tw-scale-z: 105%;
	scale: var(--tw-scale-x)var(--tw-scale-y);
	opacity: 1 !important
}

.contract__mode:hover .contract__mode-img {
	--tw-scale-x: 110%;
	--tw-scale-y: 110%;
	--tw-scale-z: 110%;
	scale: var(--tw-scale-x)var(--tw-scale-y)
}

.contract__mode-info {
	z-index: 1;
	gap: calc(var(--spacing)*1);
	flex-direction: column;
	display: flex;
	position: relative
}

:is(.contract__mode-info>*) {
	--tw-leading: 100%;
	line-height: 100%
}

.contract__mode-info span {
	font-size: var(--text-base);
	line-height: var(--tw-leading, var(--text-base--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold)
}

@media (min-width:476px) {
	.contract__mode-info span {
		font-size: var(--text-xl);
		line-height: var(--tw-leading, var(--text-xl--line-height))
	}
}

.contract__mode-info p {
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: #fff9
}

@supports (color:color-mix(in lab, red, red)) {
	.contract__mode-info p {
		color: color-mix(in oklab, var(--color-white)60%, transparent)
	}
}

.contract__mode-coeff {
	z-index: 1;
	width: calc(var(--spacing)*9);
	height: calc(var(--spacing)*9);
	--tw-gradient-position: to bottom right in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-from-position: 42%;
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold);
	border-radius: 3.40282e38px;
	justify-content: center;
	align-items: center;
	display: flex;
	position: relative
}

.contract__mode-img {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	object-fit: cover;
	width: 100%;
	height: 100%;
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	--tw-duration: .3s;
	transition-duration: .3s;
	position: absolute
}

.contract__info {
	border-radius: var(--radius-3xl);
	padding: calc(var(--spacing)*4);
	background-color: #1E2229;
	display: flex
}

.contract__info .withdraw__info-left {
	justify-content: space-between;
	width: 100%
}

.contract__buttons {
	align-items: center;
	gap: calc(var(--spacing)*3);
	display: flex
}

.contract__buttons .btn {
	flex: 1
}

.contract__buttons .btn:before {
	box-shadow: none !important
}

.contract__skins {
	gap: calc(var(--spacing)*3);
	grid-template-columns: repeat(5, minmax(0, 1fr));
	display: grid
}

@media (min-width:521px) {
	.contract__skins {
		grid-template-columns: repeat(5, minmax(0, 1fr))
	}
}

@media (min-width:611px) {
	.contract__skins {
		grid-template-columns: repeat(5, minmax(0, 1fr))
	}
}

.contract__skin {
	border-radius: var(--radius-3xl);
	background-color: #1E2229;
	min-height: 8rem;
	position: relative;
	overflow: hidden
}

@media (min-width:751px) {
	.contract__skin {
		min-height: 10.75rem
	}
}

.contract__skin.active .contract__skin-overlay {
	--tw-translate-x: -100%;
	translate: var(--tw-translate-x)var(--tw-translate-y);
	opacity: 0
}

.contract__skin.active .contract__skin-inner {
	--tw-translate-x: calc(var(--spacing)*0);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	opacity: 1
}

.contract__skin.active .contract__skin-delete {
	visibility: visible;
	opacity: 1
}

.contract__skin-overlay {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	width: 100%;
	height: 100%;
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	justify-content: center;
	align-items: center;
	display: flex;
	position: absolute
}

.contract__skin-overlay img {
	object-fit: contain;
	max-height: 4rem
}

.contract__skin-inner {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	--tw-translate-x: 100%;
	width: 100%;
	height: 100%;
	translate: var(--tw-translate-x)var(--tw-translate-y);
	padding: calc(var(--spacing)*3);
	opacity: 0;
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	-webkit-user-select: none;
	user-select: none;
	flex-direction: column;
	justify-content: center;
	display: flex;
	position: absolute
}

@media (min-width:751px) {
	.contract__skin-inner {
		justify-content: space-between
	}
}

.contract__skin-inner .item__center-dolphin {
	font-size: var(--text-4xl);
	line-height: var(--tw-leading, var(--text-4xl--line-height))
}

.contract__skin-inner .item__rarity-img {
	--tw-translate-x: calc(calc(1/2*100%)*-1);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	--tw-translate-y: calc(calc(1/2*100%)*-1);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	object-fit: contain;
	position: absolute;
	top: 50%;
	left: 50%
}

.contract__skin-inner .item__model,
.contract__skin-inner .item__quality {
	font-size: .6rem
}

.contract__skin-inner .item__name {
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height))
}

@media not all and (min-width:750px) {
	.contract__skin-inner .item__bottom {
		display: none
	}
}

.contract__skin-delete {
	visibility: hidden;
	top: calc(var(--spacing)*2);
	right: calc(var(--spacing)*2);
	z-index: 1;
	width: calc(var(--spacing)*6);
	height: calc(var(--spacing)*6);
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	color: var(--gray);
	opacity: 0;
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #273354;
	border-radius: 3.40282e38px;
	justify-content: center;
	align-items: center;
	display: flex;
	position: absolute
}

@media (hover:hover) {
	.contract__skin-delete:hover {
		color: var(--gray-light);
		background-color: #2f3d62
	}
}

.contract__overlay-win {
	visibility: hidden;
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	z-index: 3;
	justify-content: center;
	align-items: center;
	gap: calc(var(--spacing)*4);
	opacity: 0;
	width: 100%;
	height: 100%;
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: rgba(22, 25, 30, 0.95);
	flex-direction: column;
	display: flex;
	position: absolute
}

::-webkit-scrollbar {
	border-radius: 8px;
	width: 4px
}

::-webkit-scrollbar-thumb {
	background: var(--primary);
	border-radius: 12px
}

::-webkit-scrollbar-track {
	background: 0 0
}

.checkbox {
	flex-shrink: 0;
	position: relative
}

.checkbox input {
	visibility: hidden;
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	height: calc(var(--spacing)*0);
	width: calc(var(--spacing)*0);
	opacity: 0;
	position: absolute
}

.checkbox__button {
	cursor: pointer;
	align-items: center;
	gap: calc(var(--spacing)*3);
	display: flex
}

:is(.checkbox__button>*) {
	pointer-events: none
}

.checkbox__button:hover .checkbox__button-el {
	background-color: #213052
}

.checkbox__button-el {
	height: calc(var(--spacing)*6);
	width: calc(var(--spacing)*10);
	border-radius: var(--radius-xl);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #2A2E38;
	padding: 4px;
	display: flex;
	position: relative
}

.checkbox__button-desc {
	gap: calc(var(--spacing)*1);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	flex-direction: column;
	display: flex
}

:is(.checkbox__button-desc>*) {
	--tw-leading: 100%;
	line-height: 100%
}

.checkbox__button-desc span {
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold);
	text-transform: uppercase
}

.checkbox__button-desc p {
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold);
	color: var(--gray)
}

.checkbox__button-el-inner {
	height: calc(var(--spacing)*4);
	width: calc(var(--spacing)*5);
	border-radius: var(--radius-xl);
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #46547e
}

.checkbox input:checked~label .checkbox__button-el,
.checkbox.active .checkbox__button-el {
	background: #0069F3 !important
}

.checkbox input:checked~label .checkbox__button-el-inner,
.checkbox.active .checkbox__button-el-inner {
	--tw-translate-x: calc(var(--spacing)*3);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	background-color: var(--color-white)
}

.form-input {
	gap: calc(var(--spacing)*2);
	flex-direction: column;
	width: 100%;
	display: flex;
	position: relative;
	transform: none
}

.form-input__wrapp {
	width: 100%;
	position: relative
}

.form-input__wrapp input,
.form-input__wrapp .input {
	border-radius: var(--radius-3xl);
	border-style: var(--tw-border-style);
	width: 100%;
	height: 3.5rem;
	padding-inline: calc(var(--spacing)*6);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #1E2229;
	border-width: 2px;
	border-color: #0000;
	align-items: center;
	display: flex
}

:is(.form-input__wrapp input, .form-input__wrapp .input)::placeholder {
	color: var(--gray-light)
}

@supports (color:color-mix(in lab, red, red)) {
	:is(.form-input__wrapp input, .form-input__wrapp .input)::placeholder {
		color: color-mix(in oklab, var(--gray-light)50%, transparent)
	}
}

:is(.form-input__wrapp input, .form-input__wrapp .input):focus {
	border-color: var(--primary)
}

:is(.form-input__wrapp input, .form-input__wrapp .input):focus::placeholder {
	opacity: 0
}

@media (hover:hover) {
	:is(.form-input__wrapp input, .form-input__wrapp .input):not(:disabled):hover {
		background-color: #2A2E38
	}
}

.form-input__wrapp .form-input__icon~input,
.form-input__wrapp .form-input__icon~.input {
	padding-left: 3.5rem
}

.form-input__wrapp input:focus~input:focus,
.form-input__wrapp:focus-within .form-input__icon {
	color: var(--primary)
}

.form-input__icon {
	pointer-events: none;
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	width: 4rem;
	height: 3.5rem;
	font-size: var(--text-lg);
	line-height: var(--tw-leading, var(--text-lg--line-height));
	color: var(--gray);
	justify-content: center;
	align-items: center;
	display: flex;
	position: absolute;
	z-index: 1
}

.form-input__label {
	align-items: center;
	gap: calc(var(--spacing)*2);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray-light);
	display: flex;
	justify-content: space-between
}

.form-input__label .tooltip {
	font-size: var(--text-lg);
	line-height: var(--tw-leading, var(--text-lg--line-height));
	opacity: .5;
	transition-property: opacity;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	border-radius: 3.40282e38px;
	justify-content: center;
	align-items: center;
	display: flex
}

@media (hover:hover) {
	.form-input__label .tooltip:hover {
		opacity: 1
	}
}

.form-input__button {
	top: calc(var(--spacing)*0);
	right: calc(var(--spacing)*0);
	justify-content: center;
	align-items: center;
	width: 4.5rem;
	height: 3.5rem;
	display: flex;
	position: absolute;
	z-index: 1
}

.form-input__button .page__header-back {
	background-color: #2A2E38
}

@media (hover:hover) {
	.form-input__button .page__header-back:hover {
		background-color: #303541
	}
}

.form-input__button~input,
.form-input__button~.input {
	padding-right: 4.5rem
}

.form-input button.form-input__wrapp {
	border-radius: var(--radius-3xl);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #2A2E38;
	position: relative
}

@media (hover:hover) {
	.form-input button.form-input__wrapp:hover {
		background-color: #2A2E38
	}
}

.form-input button.form-input__wrapp .input {
	justify-content: space-between;
	background: 0 0 !important
}

.form-input button.form-input__wrapp .input i {
	top: calc(var(--spacing)*-.5);
	height: calc(var(--spacing)*2);
	width: calc(var(--spacing)*2);
	border-right-style: var(--tw-border-style);
	border-right-width: 2px;
	border-bottom-style: var(--tw-border-style);
	color: var(--gray);
	border-bottom-width: 2px;
	border-bottom-color: currentColor;
	border-right-color: currentColor;
	position: relative;
	rotate: 45deg
}

.form-input button.form-input__wrapp .icon {
	color: var(--primary)
}

.form-input__buttons {
	align-items: center;
	gap: calc(var(--spacing)*2);
	flex-wrap: wrap;
	display: flex
}

.form-input__buttons button {
	height: calc(var(--spacing)*8);
	border-radius: var(--radius-xl);
	padding-inline: calc(var(--spacing)*3);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray-light);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #202d4c;
	flex: 1;
	justify-content: center;
	align-items: center;
	display: flex
}

@media (hover:hover) {
	.form-input__buttons button:hover {
		color: var(--color-white)
	}

	.form-input__buttons button:not(.active):hover {
		background-color: #253456
	}
}

.form-input__buttons button.active {
	color: var(--color-white);
	background: var(--primary-gradient);
	box-shadow: var(--shadow-primary)
}

.footer .wrapper {
	gap: calc(var(--spacing)*4);
	padding-bottom: calc(var(--spacing)*4);
	flex-direction: column;
	display: flex
}

.footer__wrapp {
	flex-direction: column;
	align-items: stretch;
	width: 100%;
	display: flex
}

@media (min-width:1001px) {
	.footer__wrapp {
		flex-direction: row
	}
}

.footer__left {
	gap: calc(var(--spacing)*5);
	padding-inline: calc(var(--spacing)*5);
	padding-top: calc(var(--spacing)*5);
	padding-bottom: calc(var(--spacing)*5);
	background-color: #16191E;
	border-radius: 1.5rem;
	flex-direction: column;
	flex-shrink: 0;
	display: flex
}

@media not all and (min-width:1000px) {
	.footer__left {
		padding-bottom: calc(var(--spacing)*2)
	}
}

@media (min-width:1001px) {
	.footer__left {
		width: 80%
	}
}

.footer__top {
	justify-content: space-between;
	gap: calc(var(--spacing)*3);
	flex-direction: column;
	display: flex
}

@media (min-width:561px) {
	.footer__top {
		flex-direction: row;
		align-items: flex-end
	}
}

@media (min-width:1001px) {
	.footer__top {
		align-items: center;
		gap: calc(var(--spacing)*0)
	}
}

.footer__top-left {
	align-items: center;
	gap: calc(var(--spacing)*3);
	flex-wrap: wrap;
	display: flex
}

.footer__top-left .header__nav {
	flex-wrap: wrap
}

.footer__top-right {
	align-items: center;
	gap: calc(var(--spacing)*4);
	flex-shrink: 0;
	display: flex
}

.footer__top-right .cases__select-game {
	padding: calc(var(--spacing)*0);
	background-color: #0000
}

.footer__top-right .cases__select-game .cases__select-game-btn {
	width: calc(var(--spacing)*11);
	height: calc(var(--spacing)*11);
	font-size: var(--text-lg);
	line-height: var(--tw-leading, var(--text-lg--line-height));
	background-color: #1E2229
}

@media (hover:hover) {
	.footer__top-right .cases__select-game .cases__select-game-btn:hover {
		background-color: #2A2E38
	}
}

.footer__bottom {
	align-items: stretch;
	gap: calc(var(--spacing)*2);
	flex-direction: column;
	display: flex
}

@media (min-width:1001px) {
	.footer__bottom {
		align-items: center;
		gap: calc(var(--spacing)*3);
		flex-direction: row
	}
}

.footer__stats {
	align-items: center;
	gap: calc(var(--spacing)*8);
	flex-shrink: 0;
	position: relative
}

@media not all and (min-width:1000px) {
	.footer__stats {
		border-radius: var(--radius-2xl);
		padding-inline: calc(var(--spacing)*4);
		padding-block: calc(var(--spacing)*4);
		background-color: #0c1224;
		justify-content: space-between
	}
}

@media not all and (min-width:544px) {
	.footer__stats {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		display: grid
	}
}

@media (min-width:545px) {
	.footer__stats {
		display: flex
	}
}

@media (min-width:1001px) {
	.footer__stats {
		padding-top: calc(var(--spacing)*5);
		padding-right: calc(var(--spacing)*5);
		padding-bottom: calc(var(--spacing)*5)
	}
}

.footer__stats:before {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*-5);
	--tw-content: "";
	content: var(--tw-content);
	background-color: #0F1115;
	width: calc(100% + 1.25rem);
	height: 100%;
	position: absolute
}

@media not all and (min-width:1000px) {
	.footer__stats:before {
		display: none
	}
}

.footer__stats:after {
	--tw-content: "";
	content: var(--tw-content);
	background: #16191E;
	border-radius: 0 0 0 24px;
	width: 1.5rem;
	height: 1.5rem;
	position: absolute;
	top: -1.5rem;
	left: -1.25rem;
	box-shadow: -.5125rem .5rem 0 .5rem #0F1115
}

@media not all and (min-width:1000px) {
	.footer__stats:after {
		display: none
	}
}

.footer__stats-item {
	position: relative;
    margin-right: 5px;
    padding: 5px 8px;
    background: #16191E;
    border-radius: 1.2rem;
	display: flex;
	align-items: center;
    flex-direction: column;
	gap: 0.2rem;
	z-index: 2;
}

.footer__stats-item>.icon {
	font-size: var(--text-xl);
	line-height: var(--tw-leading, var(--text-xl--line-height));
	flex-shrink: 0
}

.footer__stats-item>.icon:before {
	background: var(--primary-gradient)
}

.footer__stats-item-info {
	gap: calc(var(--spacing)*1);
	flex-direction: column;
	display: flex
}

:is(.footer__stats-item-info>*) {
	--tw-leading: 100%;
	line-height: 100%
}

.footer__stats-item-info p {
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	--tw-font-weight: var(--font-weight-semibold);
	font-weight: var(--font-weight-semibold);
	color: var(--gray-light)
}

.footer__stats-item-info span {
	font-size: var(--text-lg);
	line-height: var(--tw-leading, var(--text-lg--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold)
}

.footer__stats-before {
	background: #0F1115;
	border-radius: 0 1.5rem 0 0;
	width: 2rem;
	height: 2rem;
	position: absolute;
	top: 0;
	right: 0;
	box-shadow: .5rem -.3125rem #16191E
}

@media not all and (min-width:1000px) {
	.footer__stats-before {
		display: none
	}
}

.footer__stats-after {
	background: #16191E;
	border-radius: 0 0 0 1.5rem;
	width: 2rem;
	height: 2rem;
	position: absolute;
	bottom: 0;
	right: -2rem;
	box-shadow: -.375rem .4375rem #0F1115
}

@media not all and (min-width:1000px) {
	.footer__stats-after {
		display: none
	}
}

.footer__age {
	padding-bottom: calc(var(--spacing)*2.5);
	position: relative
}

.footer__age-item {
	align-items: center;
	gap: calc(var(--spacing)*3);
	--tw-gradient-position: to bottom in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-from: oklab(66.5563% .199622 .0955348/.23);
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-to: oklab(50.3317% .180232 .100868/.23);
	padding-inline: calc(var(--spacing)*3);
	padding-block: calc(var(--spacing)*3.5);
	--tw-leading: 130%;
	--tw-font-weight: var(--font-weight-medium);
	font-size: .8125rem;
	line-height: 130%;
	font-weight: var(--font-weight-medium);
	border-radius: 1.25rem;
	display: flex
}

.footer__age-item .icon {
	font-size: var(--text-3xl);
	line-height: var(--tw-leading, var(--text-3xl--line-height));
	color: #ff4646;
	flex-shrink: 0
}

.footer__right {
	width: 100%;
	padding: calc(var(--spacing)*5);
	background: var(--primary-gradient);
	box-shadow: var(--shadow-primary);
	border-radius: 1.5rem;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	display: flex;
	position: relative;
	padding-left: 5.5rem
}

@media (min-width:1001px) {
	.footer__right {
		align-items: flex-end;
		padding-left: 0
	}
}

.footer__right:hover .footer__right-arrow {
	opacity: 1
}

.footer__right:hover .footer__right-image {
	--tw-scale-x: 105%;
	--tw-scale-y: 105%;
	--tw-scale-z: 105%;
	scale: var(--tw-scale-x)var(--tw-scale-y)
}

.footer__right-image {
	bottom: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	transform-origin: bottom;
	height: 7rem;
	transition-property: transform, translate, scale, rotate;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	position: absolute
}

@media not all and (min-width:1000px) {
	.footer__right-image {
		max-height: 5rem
	}
}

@media (min-width:1001px) {
	.footer__right-image {
		left: calc(var(--spacing)*-6)
	}
}

.footer__right-items {
	gap: calc(var(--spacing)*1);
	flex-direction: column;
	display: flex
}

.footer__right-item {
	align-items: center;
	gap: calc(var(--spacing)*2);
	font-size: var(--text-base);
	line-height: var(--tw-leading, var(--text-lg--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold);
	display: flex;
	white-space: nowrap;
	z-index: 1;
	filter: drop-shadow(2px 6px 20px black)
}

.footer__right-item .icon {
	font-size: var(--text-xl);
	line-height: var(--tw-leading, var(--text-2xl--line-height))
}

.footer__right-item .icon.energy:before {
	background: var(--coin)
}

.footer__right-item .icon.points:before {
	background: linear-gradient(#39dbff, #2aff7b)
}

.footer__right-arrow {
	top: calc(var(--spacing)*2);
	right: calc(var(--spacing)*2);
	font-size: var(--text-2xl);
	line-height: var(--tw-leading, var(--text-2xl--line-height));
	opacity: .4;
	transition-property: opacity;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	position: absolute
}

.footer__links {
	justify-content: space-between;
	align-items: center;
	gap: calc(var(--spacing)*4);
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	flex-direction: column;
	display: flex
}

@media (min-width:741px) {
	.footer__links {
		flex-direction: row
	}
}

.footer__links span {
	color: var(--gray)
}

@supports (color:color-mix(in lab, red, red)) {
	.footer__links span {
		color: color-mix(in oklab, var(--gray)50%, transparent)
	}
}

.footer__links a {
	color: var(--gray);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration))
}

@media (hover:hover) {
	.footer__links a:hover {
		color: var(--gray-light)
	}
}

.footer__links-left,
.footer__links-right {
	align-items: center;
	column-gap: calc(var(--spacing)*4);
	row-gap: calc(var(--spacing)*2);
	flex-wrap: wrap;
	display: flex
}

@media not all and (min-width:740px) {
	:is(.footer__links-left, .footer__links-right) {
		justify-content: center
	}
}

.socials {
	align-items: center;
	gap: calc(var(--spacing)*3);
	font-size: var(--text-xl);
	line-height: var(--tw-leading, var(--text-xl--line-height));
	display: flex
}

.socials a {
	color: var(--gray);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration))
}

@media (hover:hover) {
	.socials a:hover {
		color: var(--gray-light)
	}
}

.header__right .socials {
    flex-direction: column;
    gap: 0.4rem;
}

.gamesLeft {
	display: none;
}

/* .gamesLeft {
	top: 50%;
	left: calc(var(--spacing)*4);
	z-index: 11;
	--tw-translate-y: calc(calc(1/2*100%)*-1);
	width: 4.5rem;
	translate: var(--tw-translate-x)var(--tw-translate-y);
	gap: calc(var(--spacing)*4);
	padding: calc(var(--spacing)*3);
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #16191E;
	border-radius: 1.25rem;
	flex-direction: column;
	display: flex;
	position: fixed;
	z-index: 12
} */

/* @media not all and (min-width:1200px) {
	.gamesLeft {
		--tw-translate-x: -100%;
		translate: var(--tw-translate-x)var(--tw-translate-y);
		opacity: 0
	}
}

.gamesLeft__link {
	opacity: .3;
	--tw-saturate: saturate(.4);
	filter: var(--tw-blur, )var(--tw-brightness, )var(--tw-contrast, )var(--tw-grayscale, )var(--tw-hue-rotate, )var(--tw-invert, )var(--tw-saturate, )var(--tw-sepia, )var(--tw-drop-shadow, );
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration))
}

@media (hover:hover) {
	.gamesLeft__link:hover {
		opacity: 1;
		--tw-saturate: saturate(1);
		filter: var(--tw-blur, )var(--tw-brightness, )var(--tw-contrast, )var(--tw-grayscale, )var(--tw-hue-rotate, )var(--tw-invert, )var(--tw-saturate, )var(--tw-sepia, )var(--tw-drop-shadow, )
	}
}

.gamesLeft__link.active {
	opacity: 1;
	--tw-saturate: saturate(1);
	filter: var(--tw-blur, )var(--tw-brightness, )var(--tw-contrast, )var(--tw-grayscale, )var(--tw-hue-rotate, )var(--tw-invert, )var(--tw-saturate, )var(--tw-sepia, )var(--tw-drop-shadow, )
} */

.tippy-box {
	background: #34426a;
	border-radius: 1rem;
	padding: .25rem;
	font-weight: 500
}

.tippy-arrow {
	color: #34426a
}

.page {
	gap: calc(var(--spacing)*3);
	flex-direction: column;
	display: flex
}

.page__header {
	z-index: 5;
	justify-content: space-between;
	align-items: center;
	display: flex;
	position: relative
}

.page__header-left {
	align-items: center;
	gap: calc(var(--spacing)*3);
	flex: 1;
	display: flex
}

.page__header-back {
	width: calc(var(--spacing)*11);
	height: calc(var(--spacing)*11);
	border-radius: var(--radius-xl);
	font-size: var(--text-base);
	line-height: var(--tw-leading, var(--text-base--line-height));
	color: var(--gray);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #16191E;
	justify-content: center;
	align-items: center;
	display: flex
}

@media (hover:hover) {
	.page__header-back:hover {
		color: var(--gray-light);
		background-color: #1E2229
	}
}

.page__header-info {
	align-items: center;
	gap: calc(var(--spacing)*3);
	flex: 1;
	display: flex
}

.page__header-info-image {
	width: calc(var(--spacing)*10);
	height: calc(var(--spacing)*10);
	object-fit: contain
}

@media not all and (min-width:360px) {
	.page__header-info-image {
		display: none
	}
}

.page__header-info-inner {
	gap: calc(var(--spacing)*1.5);
	flex-direction: column;
	flex: 1;
	display: flex
}

:is(.page__header-info-inner>*) {
	--tw-leading: 100%;
	line-height: 100%
}

.page__header-info-inner p,
.page__header-info-inner h2 {
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray-light)
}

.page__header-info-inner span {
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold)
}

.page__header-info-inner>* {
	text-overflow: ellipsis;
	white-space: nowrap;
	flex: 1;
	width: 100%;
	overflow: hidden
}

.page__header-right {
	align-items: center;
	gap: calc(var(--spacing)*2);
	display: flex
}

.page__header-keyboard {
	height: calc(var(--spacing)*11);
	justify-content: center;
	align-items: center;
	gap: calc(var(--spacing)*2);
	border-radius: var(--radius-xl);
	padding-inline: calc(var(--spacing)*3);
	font-size: var(--text-base);
	line-height: var(--tw-leading, var(--text-base--line-height));
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #16191E;
	display: flex
}

@media (hover:hover) {
	.page__header-keyboard:hover {
		color: var(--gray-light);
		background-color: #1E2229
	}
}

.page__header-keyboard.active {
	background-color: #1E2229
}

.page__header-center {
	bottom: calc(var(--spacing)*-2);
	--tw-translate-x: calc(calc(1/2*100%)*-1);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	align-items: center;
	display: flex;
	position: absolute;
	left: 50%
}

:where(.page__header-center>:not(:last-child)) {
	--tw-space-x-reverse: 0;
	margin-inline-start: calc(calc(var(--spacing)*-4)*var(--tw-space-x-reverse));
	margin-inline-end: calc(calc(var(--spacing)*-4))calc(1 - var(--tw-space-x-reverse)))
}

.page__header-center img {
	max-width: 3rem
}

@media (min-width:476px) {
	.page__header-center img {
		max-width: 4rem
	}
}

@media not all and (min-width:600px) {
	.page .page__header-center {
		display: none
	}
}

.page__header-center-wrapp {
	align-items: center;
	gap: calc(var(--spacing)*2);
	display: flex
}

.page__header-center-wrapp .icon:before {
	background: linear-gradient(#0069F3, #38AFFF)
}

.page__header-center-wrapp .icon {
	font-size: var(--text-xl);
	line-height: var(--tw-leading, var(--text-xl--line-height))
}

.page__header-center-wrapp-inner {
	gap: calc(var(--spacing)*.5);
	flex-direction: column;
	display: flex
}

:is(.page__header-center-wrapp-inner>*) {
	--tw-leading: 100%;
	line-height: 100%
}

.page__header-center-wrapp-inner p {
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray-light)
}

.page__header-center-wrapp-inner span {
	font-size: var(--text-xl);
	line-height: var(--tw-leading, var(--text-xl--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold)
}

.page__body {
	gap: calc(var(--spacing)*5);
	border-radius: var(--radius-3xl);
	padding: calc(var(--spacing)*6);
	background-color: #16191E;
	flex-direction: column;
	display: flex
}

.page__controls {
	justify-content: center;
	align-items: center;
	gap: calc(var(--spacing)*3);
	display: flex
}

@media not all and (min-width:850px) {
	.page__controls {
		flex-wrap: wrap
	}
}

.page__controls-left {
	justify-content: flex-end;
	align-items: center;
	gap: calc(var(--spacing)*4);
	transition-property: opacity;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	display: flex
}

@media (min-width:851px) {
	.page__controls-left {
		flex: 1
	}
}

.page__controls-left-desc {
	text-align: end;
	flex-direction: column;
	align-items: flex-end;
	display: none
}

@media (min-width:631px) {
	.page__controls-left-desc {
		display: flex
	}
}

.page__controls-left-desc span {
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: #e8eeff;
	text-transform: uppercase
}

.page__controls-left-desc p {
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray)
}

.page__controls-left-inner {
	align-items: center;
	gap: calc(var(--spacing)*2);
	border-radius: var(--radius-3xl);
	height: 4.6875rem;
	padding-inline: calc(var(--spacing)*4);
	background-color: #1E2229;
	display: flex
}

.page__controls-button {
	width: calc(var(--spacing)*11);
	height: calc(var(--spacing)*11);
	--tw-font-weight: var(--font-weight-semibold);
	font-weight: var(--font-weight-semibold);
	color: var(--gray);
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #2A2E38;
	border-radius: 3.40282e38px;
	justify-content: center;
	align-items: center;
	display: flex
}

@media (hover:hover) {
	.page__controls-button:hover {
		color: var(--gray-light);
		background-color: #303541
	}
}

.page__controls-button.active {
	color: var(--color-white);
	background: var(--primary-gradient);
	box-shadow: var(--shadow-primary)
}

.page__controls-right {
	transition-property: opacity;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	justify-content: flex-start;
	display: flex
}

@media (min-width:851px) {
	.page__controls-right {
		flex: 1
	}
}

.page__controls-right-inner {
	align-items: center;
	gap: calc(var(--spacing)*5);
	border-radius: var(--radius-3xl);
	height: 4.6875rem;
	padding-inline: calc(var(--spacing)*4);
	background-color: #1E2229;
	display: flex
}

.page__controls-main-btn {
	width: 16rem
}

@media (min-width:851px) {
	.page__controls-main-btn {
		width: 100%
	}
}

.page__controls-center {
	flex-direction: column;
	flex-shrink: 0;
	justify-content: center;
	align-items: center;
	min-width: 16rem;
	display: flex
}

@media not all and (min-width:850px) {
	.page__controls-center {
		order: calc(1*-1);
		width: 100%
	}
}

.page__controls-center .sum {
	font-size: var(--text-base);
	line-height: var(--tw-leading, var(--text-base--line-height));
	margin-left: auto
}

.page__controls-center .page__header-center {
	bottom: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	--tw-translate-x: calc(var(--spacing)*0);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	--tw-translate-y: calc(var(--spacing)*0);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	display: flex;
	position: relative
}

@media (min-width:601px) {
	.page__controls-center .page__header-center {
		display: none
	}
}

.page__controls-right-text {
	align-items: center;
	gap: calc(var(--spacing)*2);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	display: flex
}

.page__controls-right-text .icon {
	font-size: var(--text-base);
	line-height: var(--tw-leading, var(--text-base--line-height))
}

.page__controls-right-text .icon:before {
	background: linear-gradient(#0069F3, #38AFFF)
}

.page__controls.disabled .page__controls-left,
.page__controls.disabled .page__controls-right {
	cursor: not-allowed;
	opacity: .3
}

:is(:is(.page__controls.disabled .page__controls-left, .page__controls.disabled .page__controls-right)>*) {
	pointer-events: none
}

.keyboard {
	align-items: center;
	gap: calc(var(--spacing)*5);
	display: flex
}

.keyboard__item {
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray-light);
	flex-direction: column;
	align-items: center;
	display: flex
}

.case__top {
	gap: calc(var(--spacing)*2);
	flex-direction: column;
	display: flex;
}

.case__overlay {
	border-radius: var(--radius-3xl);
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 15rem;
	display: flex;
	position: absolute;
	overflow: hidden;
	left: 0;
	top: 0
}

.case__overlay-img {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	object-fit: contain;
	object-position: left;
	width: 100%;
	height: 100%;
	position: absolute
}

.case__overlay-case {
	object-fit: contain;
	max-height: 90%;
}

.animate_on .case__overlay-case {
	animation: none
}

.case__controls-not-have {
	border-radius: var(--radius-3xl);
	border-style: var(--tw-border-style);
	/* background-color: oklab(77.853% -.00355354 -.0973303/.22); */
	background: linear-gradient(to right, #0055F3, #9cb5f638);
	border-width: 1px;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	height: 4.5rem;
	display: flex;
	border: none;
	transition: opacity 0.2s;
}
.case__controls-not-have:hover {
	opacity: 0.7;
}

@supports (color:color-mix(in lab, red, red)) {
	.case__controls-not-have {
		border-color: color-mix(in oklab, var(--color-white)10%, transparent)
	}
}

.case__controls-not-have-top {
	align-items: center;
	gap: calc(var(--spacing)*1.5);
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	display: flex
}

.case__controls-not-have-top p {
	color: #fff9
}

@supports (color:color-mix(in lab, red, red)) {
	.case__controls-not-have-top p {
		color: color-mix(in oklab, var(--color-white)60%, transparent)
	}
}

.case__controls-not-have-top .sum {
	align-items: center;
	gap: calc(var(--spacing)*1);
	font-size: var(--text-base);
	line-height: var(--tw-leading, var(--text-base--line-height))
}

.case__controls-not-have-top .sum .icon {
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height))
}

.case__controls-not-have-bottom {
	width: 100%;
	padding-inline: calc(var(--spacing)*4);
	/* font-size: var(--text-xs); */
	line-height: var(--tw-leading, var(--text-xs--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: #fff6;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: calc(var(--spacing)*1.5);
}
.case__controls-not-have-bottom *{
	cursor: pointer;
}
.case__controls-not-have-bottom p,
.case__controls-not-have-bottom span {
	color: #fff;
}
.case__controls-not-have-bottom .icon:before {
	background: var(--coin);
}

@supports (color:color-mix(in lab, red, red)) {
	.case__controls-not-have-bottom {
		color: color-mix(in oklab, var(--color-white)40%, transparent)
	}
}

.case__controls-not-have-bottom .sum {
	gap: calc(var(--spacing)*1);
	/* font-size: var(--text-xs); */
	line-height: var(--tw-leading, var(--text-xs--line-height))
}

.case__controls-not-have-bottom .sum .icon {
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height))
}

.case__slider {
	margin-top: calc(var(--spacing)*-2);
	flex-direction: column;
	display: flex;
	height: 15rem;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	z-index: 1
}

.case__slider-one {
	border-radius: var(--radius-3xl);
	width: 100%;
	height: 8.25rem;
	position: relative
}

@media (min-width:1441px) {
	.case__slider-one {
		height: 17rem
	}
}

.case__slider-wrapp {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	align-items: center;
	width: 100%;
	height: 100%;
	display: flex;
	position: absolute;
	overflow: hidden;
	mask-image: linear-gradient(to right, transparent, #fff, #fff, transparent)
}

.case__slider-outer {
	top: calc(var(--spacing)*0);
	--tw-translate-x: calc(calc(1/2*100%)*-1);
	width: 1920px;
	height: 100%;
	translate: var(--tw-translate-x)var(--tw-translate-y);
	align-items: center;
	display: flex;
	position: absolute;
	left: 50%
}

.case__slider-outer .item {
	pointer-events: none;
	flex-shrink: 0;
	width: 10rem;
	margin: 0 .25rem
}

.case__slider-cursor {
	z-index: 1;
	--tw-translate-x: calc(calc(1/2*100%)*-1);
	width: 4px;
	height: 100%;
	translate: var(--tw-translate-x)var(--tw-translate-y);
	--tw-gradient-position: to bottom in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-from: #ffd820;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-to: #d5ff20;
	position: absolute;
	left: 50%;
	box-shadow: 0 0 1rem #f9df20;
	transform: translateY(-50%);
	top: 50%
}

.case__slider-items {
	align-items: center;
	display: flex;
	will-change: transform;
	transform: translateZ(0)
}

.case__win-items {
	justify-content: center;
	gap: calc(var(--spacing)*4);
	padding-bottom: calc(var(--spacing)*2);
	flex-wrap: wrap;
	display: flex;
	align-items: center;
	position: relative;
	z-index: 2
}

.case__win-item {
	align-items: flex-start;
	gap: calc(var(--spacing)*2);
	flex-direction: column;
	max-width: 12rem;
	display: flex
}

.case__win-item-button {
	align-items: center;
	gap: calc(var(--spacing)*2);
	padding-inline: calc(var(--spacing)*3);
	padding-block: calc(var(--spacing)*2);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #172036;
	border-radius: 3.40282e38px;
	display: flex
}

@media (hover:hover) {
	.case__win-item-button:hover {
		background-color: #2A2E38
	}
}

.case__win-item-button>span {
	color: var(--gray-light)
}

.case__slider-multiple {
	border-radius: var(--radius-3xl);
	width: 100%;
	height: 10.5625rem;
	position: relative;
	overflow: hidden
}

@media (min-width:386px) {
	.case__slider-multiple {
		height: 11.375rem
	}
}

@media (max-width:1440px) and (min-width:476px) {

	.case__slider,
	.case__overlay {
		height: 182px
	}

	.case__top-inner {
		min-height: 182px !important
	}

	.case__slider-one {
		height: 182px
	}
}

@media (max-width:475px) {

	.case__slider,
	.case__overlay {
		height: 140px
	}

	.case__top-inner {
		min-height: 140px !important
	}

	.case__slider-one {
		height: 140px
	}

	.case__slider-item-el {
		height: 140px !important
	}
}

@media (min-width:1441px) {
	.case__slider-multiple {
		height: 15rem
	}
}

.case__slider-multiple-wrapp {
	align-items: stretch;
	height: 100%;
	display: flex;
	position: relative
}

.case__slider-item {
	flex: 1;
	height: 100%;
	position: relative
}

.case__slider-item.enter {
	animation: .25s caseEnter
}

.case__slider-item.leave {
	animation: .15s caseLeave
}

.case__slider-item:before {
	right: calc(var(--spacing)*-4);
	--tw-content: "";
	content: var(--tw-content);
	background: radial-gradient(#26314e, #0000 65%);
	width: .2rem;
	height: 100%;
	position: absolute;
	rotate: 10deg
}

@media not all and (min-width:780px) {
	.case__slider-item:before {
		display: none
	}
}

.case__slider-item:last-child:before {
	content: none
}

.case__slider-item-wrapp {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	width: 100%;
	height: 100%;
	position: absolute;
	mask-image: linear-gradient(to bottom, transparent, #fff, #fff, transparent);
}

.case__slider-item-list {
	top: calc(var(--spacing)*0);
	flex-direction: column;
	width: 100%;
	height: 1920px;
	display: flex;
	position: absolute
}

.case__slider-item-el {
	flex-shrink: 0;
	justify-content: center;
	align-items: center;
	height: 10.5625rem;
	display: flex;
	position: relative
}

@media (min-width:476px) {
	.case__slider-item-el {
		height: 11.375rem
	}
}

@media (min-width:1441px) {
	.case__slider-item-el {
		height: 15rem
	}
}

.case__slider-item-el .item__center {
	justify-content: center;
	width: 100%;
	display: flex
}

.case__slider-item-el .item__center .item__image {
	max-width: 100%;
	max-height: 12rem
}

@media (min-width:451px) {
	.case__slider-item-el .item__center .item__image {
		height: 14rem
	}
}

@media (min-width:781px) {
	.case__slider-item-el .item__center .item__image {
		width: 14rem
	}
}

.case__slider-item-el .item__rarity-img {
	--tw-translate-x: calc(calc(1/2*100%)*-1);
	width: fit-content;
	height: fit-content;
	translate: var(--tw-translate-x)var(--tw-translate-y);
	--tw-translate-y: calc(calc(1/2*100%)*-1);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	top: 50%;
	left: 50%
}

@media not all and (min-width:780px) {
	.case__slider-item-el .item__center-dolphin {
		font-size: var(--text-4xl);
		line-height: var(--tw-leading, var(--text-4xl--line-height))
	}

	.case__slider-item-el .item__rarity-img {
		width: calc(var(--spacing)*24);
		height: calc(var(--spacing)*24)
	}
}

.case__slider-cursor-multiple {
	top: 50%;
	left: calc(var(--spacing)*0);
	z-index: 2;
	--tw-translate-y: calc(calc(1/2*100%)*-1);
	width: 100%;
	height: .2rem;
	translate: var(--tw-translate-x)var(--tw-translate-y);
	background: radial-gradient(#ffd820, #0000 73%);
	position: absolute
}

.case__slider-item-case-preview .item__image {
	max-height: 100% !important
}

.case__slider-item-case-preview .item__center {
	height: 90%
}

.bonus__top {
	gap: calc(var(--spacing)*3);
	display: grid
}

@media (min-width:651px) {
	.bonus__top {
		grid-template-columns: repeat(2, minmax(0, 1fr))
	}
}

@media (min-width:991px) {
	.bonus__top {
		grid-template-columns: repeat(4, minmax(0, 1fr))
	}
}

.bonus__promocode {
	justify-content: space-between;
	gap: calc(var(--spacing)*4);
	padding: calc(var(--spacing)*6);
	background-color: #1E2229;
	border-radius: 1.5rem;
	flex-direction: column;
	display: flex;
	position: relative
}

.bonus__promocode .form-input__wrapp input {
	background-color: #16191E
}

@media (hover:hover) {
	.bonus__promocode .form-input__wrapp input:hover {
		background-color: #11192e
	}
}

.bonus__promocode .form-input__wrapp input:focus {
	background-color: #11192e
}

.bonus__tasks {
	gap: calc(var(--spacing)*4);
	flex-direction: column;
	display: flex
}

.bonus .page__body {
	gap: calc(var(--spacing)*6)
}

.bonus__tasks-top {
	justify-content: space-between;
	align-items: center;
	gap: calc(var(--spacing)*4);
	flex-wrap: wrap;
	display: flex
}

.bonus__tasks-top-left,
.bonus__top-right {
	align-items: center;
	gap: calc(var(--spacing)*2);
	display: flex
}

.bonus__tasks-count {
	padding-inline: calc(var(--spacing)*3);
	padding-block: calc(var(--spacing)*1);
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray-light);
	background-color: #1E2229;
	border-radius: 3.40282e38px
}

.bonus__tasks-count span {
	color: var(--gray)
}

.bonus__top-right-points {
	align-items: center;
	gap: calc(var(--spacing)*2);
	font-size: var(--text-lg);
	line-height: var(--tw-leading, var(--text-lg--line-height));
	--tw-font-weight: var(--font-weight-semibold);
	font-weight: var(--font-weight-semibold);
	color: var(--primary);
	display: flex
}

.bonus__top-right-points .icon:before {
	background: var(--coin)
}

.bonus__top-right {
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	color: var(--gray-light)
}

.bonus__tasks-list {
	align-items: center;
	gap: calc(var(--spacing)*3);
	grid-template-columns: repeat(3, minmax(0, 1fr));
	width: 100%
}

@media not all and (min-width:990px) {
	.bonus__tasks-list {
		align-items: stretch;
		display: flex;
		overflow: auto
	}
}

@media (min-width:991px) {
	.bonus__tasks-list {
		display: grid
	}
}

.bonus__tasks-list::-webkit-scrollbar {
	height: calc(var(--spacing)*0);
	width: calc(var(--spacing)*0)
}

.bonus__task {
	border-radius: var(--radius-3xl);
	height: 100%;
	padding: calc(var(--spacing)*5);
	background-color: #1E2229;
	padding-right: 9rem;
	display: flex;
	position: relative;
	overflow: hidden
}

@media not all and (min-width:990px) {
	.bonus__task {
		flex-shrink: 0;
		align-items: stretch;
		width: fit-content;
		height: auto
	}
}

.bonus__task-left {
	gap: calc(var(--spacing)*3);
	flex-direction: column;
	display: flex
}

@media not all and (min-width:990px) {
	.bonus__task-left {
		justify-content: center
	}
}

.bonus__task-title {
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray-light)
}

.bonus__task-image {
	top: calc(var(--spacing)*0);
	right: calc(var(--spacing)*3);
	width: 8rem;
	height: 100%;
	padding: calc(var(--spacing)*3);
	justify-content: center;
	align-items: flex-end;
	display: flex;
	position: absolute
}

.bonus__task-image img {
	top: calc(var(--spacing)*4);
	position: absolute
}

.bonus__task-bottom {
	align-items: center;
	gap: calc(var(--spacing)*2);
	flex-wrap: wrap;
	display: flex
}

.bonus__task-bottom .bonus__top-right-points {
	gap: calc(var(--spacing)*1.5);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height))
}

.bonus__task-bottom .bonus__top-right-points span {
	color: var(--color-white)
}

.bonus__task-button {
	border-radius: var(--radius-xl);
	padding-inline: calc(var(--spacing)*4);
	padding-block: calc(var(--spacing)*2);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-semibold);
	font-weight: var(--font-weight-semibold);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #2A2E38
}

@media (hover:hover) {
	.bonus__task-button:hover {
		background-color: #303541
	}
}

.bonus__task-progress {
	z-index: 2;
	padding-inline: calc(var(--spacing)*2);
	padding-block: calc(var(--spacing)*.5);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	background-color: #0091ff;
	border-radius: 3.40282e38px;
	display: flex;
	position: relative
}

.bonus__cases {
	gap: calc(var(--spacing)*3);
	flex-direction: column;
	display: flex
}

.bonus__cases .cases__cases {
	grid-template-columns: repeat(2, minmax(0, 1fr))
}

@media (min-width:441px) {
	.bonus__cases .cases__cases {
		grid-template-columns: repeat(3, minmax(0, 1fr))
	}
}

@media (min-width:561px) {
	.bonus__cases .cases__cases {
		grid-template-columns: repeat(4, minmax(0, 1fr))
	}
}

@media (min-width:661px) {
	.bonus__cases .cases__cases {
		grid-template-columns: repeat(5, minmax(0, 1fr))
	}
}

@media (min-width:741px) {
	.bonus__cases .cases__cases {
		grid-template-columns: repeat(6, minmax(0, 1fr))
	}
}

.bonus__cases .cases__case:disabled {
	pointer-events: none;
	opacity: .3
}

.bonus__cases .cases__case:disabled .bonus__sum.sum .icon:before {
	background: #7181ab !important
}

.bonus__cases-timer {
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray)
}

.bonus__sum.sum {
	background-color: #2A2E38
}

.bonus__sum.sum .icon:before {
	background: var(--primary-gradient)
}

.bonus__subscribe .bonus__task-image img {
	top: 50%;
	right: calc(var(--spacing)*0);
	bottom: ihnerit;
	--tw-translate-y: calc(calc(1/2*100%)*-1);
	max-width: 5rem;
	translate: var(--tw-translate-x)var(--tw-translate-y)
}

.bonus__subscribe .bonus__tasks-list {
	gap: calc(var(--spacing)*3);
	grid-template-columns: repeat(1, minmax(0, 1fr));
	display: grid
}

@media (min-width:601px) {
	.bonus__subscribe .bonus__tasks-list {
		grid-template-columns: repeat(2, minmax(0, 1fr))
	}
}

@media (min-width:951px) {
	.bonus__subscribe .bonus__tasks-list {
		grid-template-columns: repeat(3, minmax(0, 1fr))
	}
}

.bonus__subscribe .bonus__tasks-list .bonus__task {
	width: 100%
}

.bonus__subscribe .bonus__task {
	width: calc(var(--spacing)*0);
	padding-right: 5rem
}

.bonus__more {
	gap: calc(var(--spacing)*4);
	flex-direction: column;
	display: flex
}

.bonus__more .bonus__tasks-list {
	grid-template-columns: repeat(1, minmax(0, 1fr));
	display: grid
}

@media (min-width:731px) {
	.bonus__more .bonus__tasks-list {
		grid-template-columns: repeat(2, minmax(0, 1fr))
	}
}

.bonus__more-item {
	justify-content: space-between;
	align-items: flex-start;
	gap: calc(var(--spacing)*4);
	border-radius: var(--radius-3xl);
	height: 100%;
	padding: calc(var(--spacing)*6);
	background-color: #1E2229;
	flex-direction: column;
	display: flex
}

.bonus__more-item-desc {
	gap: calc(var(--spacing)*1);
	flex-direction: column;
	display: flex
}

:is(.bonus__more-item-desc>*) {
	--tw-leading: 100%;
	line-height: 100%
}

.bonus__more-item-desc span {
	font-size: var(--text-lg);
	line-height: var(--tw-leading, var(--text-lg--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold)
}

.bonus__more-item-desc p {
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray)
}

.bonus__more-avatars {
	justify-content: flex-start;
	width: fit-content;
	display: flex
}

:where(.bonus__more-avatars>:not(:last-child)) {
	--tw-space-x-reverse: 0;
	margin-inline-start: calc(calc(var(--spacing)*-4)*var(--tw-space-x-reverse));
	margin-inline-end: calc(calc(var(--spacing)*-4))calc(1 - var(--tw-space-x-reverse)))
}

.bonus__more-avatars img {
	width: calc(var(--spacing)*16);
	height: calc(var(--spacing)*16);
	border-radius: 3.40282e38px
}

.bonus__more-avatars a {
	border-style: var(--tw-border-style);
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	border-width: 3px;
	border-color: #1E2229;
	border-radius: 3.40282e38px
}

@media (hover:hover) {
	.bonus__more-avatars a:hover {
		z-index: 1;
		scale: 1.1
	}
}

.bonus__more-avatars a:hover {
	opacity: 1 !important
}

.bonus__more-avatars:hover a {
	opacity: .3
}

.bonus__nickname {
	align-items: center;
	gap: calc(var(--spacing)*3);
	--tw-font-weight: var(--font-weight-semibold);
	font-weight: var(--font-weight-semibold);
	display: flex
}

.bonus__nickname img {
	width: calc(var(--spacing)*16);
	height: calc(var(--spacing)*16);
	object-fit: cover;
	border-radius: 3.40282e38px
}

.bonus__nickname button {
	color: var(--gray);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration))
}

@media (hover:hover) {
	.bonus__nickname button:hover {
		color: var(--gray-hover)
	}
}

.event__top {
	justify-content: space-between;
	gap: calc(var(--spacing)*4);
	flex-direction: column;
	display: flex
}

@media (min-width:961px) {
	.event__top {
		flex-direction: row
	}
}

@media (min-width:1001px) {
	.event__top {
		align-items: stretch
	}
}

@media (min-width:961px) {
	.event__top .banners__event-image {
		width: 50%
	}
}

.event__top .banners__event-image .banners__event-overlay {
	position: relative
}

.event__top .banners__event-image .banners__event-image-bg {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	object-fit: cover;
	width: 100%;
	height: 100%;
	position: absolute
}

.event__top-info {
	justify-content: space-between;
	gap: calc(var(--spacing)*4);
	padding: calc(var(--spacing)*6);
	background-color: #1E2229;
	border-radius: 1.5rem;
	flex-direction: column;
	flex: 1;
	display: flex
}

@media (min-width:531px) {
	.event__top-info {
		flex-direction: row;
		align-items: center
	}
}

@media not all and (min-width:530px) {
	.event__top-info .btn {
		width: 100%
	}

	.event__top-info .btn .btn__inner {
		justify-content: space-between
	}
}

.event__energy {
	flex-direction: column;
	flex-shrink: 0;
	align-items: flex-start;
	display: flex
}

.event__energy-top {
	align-items: center;
	gap: calc(var(--spacing)*1);
	padding-bottom: calc(var(--spacing)*2);
	display: flex
}

.event__energy-top span {
	font-size: var(--text-3xl);
	line-height: var(--tw-leading, var(--text-3xl--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold)
}

.event__energy-top .icon.energy {
	font-size: var(--text-2xl);
	line-height: var(--tw-leading, var(--text-2xl--line-height))
}

.event__energy-top .icon.tooltip {
	font-size: var(--text-lg);
	line-height: var(--tw-leading, var(--text-lg--line-height));
	color: var(--gray);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration))
}

@media (hover:hover) {
	.event__energy-top .icon.tooltip:hover {
		color: var(--gray-hover)
	}
}

.event__progress {
	margin-bottom: calc(var(--spacing)*5);
	background-color: #232e4a;
	border-radius: 3.40282e38px;
	width: 100%;
	height: 8px;
	position: relative;
	overflow: hidden
}

.event__progress-inner {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	background: var(--primary-gradient);
	height: 100%;
	position: absolute
}

.event__progress-overlay {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	z-index: 1;
	justify-content: space-around;
	width: 100%;
	height: 100%;
	display: flex;
	position: absolute
}

.event__progress-overlay div {
	border-right-style: var(--tw-border-style);
	border-right-width: 3px;
	border-right-color: #1E2229;
	flex: 1
}

.event__progress-overlay div:last-child {
	border-right-style: var(--tw-border-style);
	border-right-width: 0
}

.event__course {
	justify-content: space-between;
	align-items: center;
	gap: calc(var(--spacing)*2);
	border-radius: var(--radius-3xl);
	border-style: var(--tw-border-style);
	--tw-border-style: dashed;
	height: 100%;
	padding: calc(var(--spacing)*5);
	border: 2px dashed #2d3653;
	flex: 1;
	display: flex
}

@media (min-width:531px) {
	.event__course {
		flex-direction: column;
		justify-content: center
	}
}

.event__course-your {
	flex-direction: column;
	display: flex
}

@media (min-width:531px) {
	.event__course-your {
		text-align: center;
		align-items: center
	}
}

.event__course-your>span {
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray-light)
}

.event__course-your .sum {
	font-size: var(--text-xl);
	line-height: var(--tw-leading, var(--text-xl--line-height))
}

.event__course-calc {
	align-items: center;
	gap: calc(var(--spacing)*1.5);
	padding-inline: calc(var(--spacing)*2);
	padding-block: calc(var(--spacing)*1);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	background-color: #2A2E38;
	border-radius: 3.40282e38px;
	display: flex
}

.event__course-calc .icon {
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height))
}

.event__case {
	align-items: center;
	gap: calc(var(--spacing)*1.5);
	width: 50%;
	padding-inline: calc(var(--spacing)*2);
	flex-direction: column;
	flex-shrink: 0;
	display: flex;
	position: relative
}

@media (min-width:481px) {
	.event__case {
		width: 33.3333%
	}
}

@media (min-width:661px) {
	.event__case {
		width: 25%
	}
}

@media (min-width:841px) {
	.event__case {
		width: 20%
	}
}

@media (min-width:961px) {
	.event__case {
		width: 16.6667%
	}
}

.event__case .cases__case {
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #1E2229;
	border-radius: 2rem
}

@media (hover:hover) {
	.event__case .cases__case:hover {
		background-color: #0000
	}
}

.event__case .cases__case:disabled {
	opacity: 1
}

.event__case>.sum,
.event__case>.sum .icon:before {
	color: var(--gray)
}

.event__case.active>.sum {
	color: var(--color-white)
}

.event__case.active>.sum .icon:before {
	background: var(--energy)
}

.event__case.active .event__case-ellipse {
	background-color: #ffa320
}

.event__case.active:before {
	top: calc(var(--spacing)*0);
	top: calc(var(--spacing)*1);
	left: calc(var(--spacing)*0);
	--tw-content: "";
	content: var(--tw-content);
	background-color: #ffa320;
	width: 100%;
	height: 3px;
	position: absolute
}

.event__case-ellipse {
	width: calc(var(--spacing)*3);
	height: calc(var(--spacing)*3);
	background-color: #212c46;
	border-radius: 3.40282e38px
}

.event__cases-line {
	margin-left: calc(var(--spacing)*-6);
	width: calc(100% + 3rem);
	position: relative
}

.event__cases-line .cases__cases {
	z-index: 1;
	gap: calc(var(--spacing)*0);
	padding-inline: calc(var(--spacing)*2);
	display: flex;
	position: relative;
	overflow: auto
}

.event__cases-line .cases__cases::-webkit-scrollbar {
	height: calc(var(--spacing)*0);
	width: calc(var(--spacing)*0)
}

.event__cases-progress {
	top: calc(var(--spacing)*1);
	left: calc(var(--spacing)*0);
	background-color: #1E2229;
	width: 100%;
	height: 3px;
	position: absolute
}

.event__cases-line-bg {
	margin-top: calc(var(--spacing)*-18);
	opacity: .7
}

.event__leaderboard {
	gap: calc(var(--spacing)*4);
	flex-direction: column;
	display: flex
}

@media (min-width:661px) {
	.event__leaderboard .title {
		margin-top: calc(var(--spacing)*-8)
	}
}

@media (min-width:991px) {
	.event__leaderboard .title {
		padding-top: calc(var(--spacing)*0)
	}
}

.event__leaderboard-top {
	justify-content: space-between;
	align-items: flex-end;
	gap: calc(var(--spacing)*2);
	width: 100%;
	display: flex
}

.event__leaderboard-item {
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #1E2229;
	border-radius: 1.5rem;
	flex: 1;
	position: relative;
	overflow: hidden
}

@media (hover:hover) {
	.event__leaderboard-item:hover {
		opacity: .8
	}
}

.event__leaderboard-item:nth-child(2) {
	background: linear-gradient(45deg, #e5be3c29, #0000);
	height: 13rem
}

.event__leaderboard-item:nth-child(2) .item__image {
	max-height: 5rem;
}

.animate_on .event__leaderboard-item:nth-child(2) .item__image {
	animation: none
}

@media (min-width:481px) {
	.event__leaderboard-item:nth-child(2) .item__image {
		max-height: 6rem
	}
}

@media (min-width:651px) {
	.event__leaderboard-item:nth-child(2) .item__image {
		max-height: 8rem
	}
}

.event__leaderboard-item:first-child {
	background: linear-gradient(-45deg, #242e4a, #0000)
}

.event__leaderboard-item:first-child .item__image {
	max-height: 4rem
}

@media (min-width:651px) {
	.event__leaderboard-item:first-child .item__image {
		max-height: 6rem
	}
}

.event__leaderboard-item:nth-child(3) {
	background: linear-gradient(45deg, #242e4a, #0000)
}

.event__leaderboard-item:nth-child(3) .item__image {
	max-height: 4rem
}

@media (min-width:651px) {
	.event__leaderboard-item:nth-child(3) .item__image {
		max-height: 6rem
	}
}

.event__leaderboard-item:not(:nth-child(2)) {
	height: 10rem
}

.event__leaderboard-item .item__center {
	justify-content: center;
	width: 100%;
	height: 100%;
	display: flex
}

.event__leaderboard-item .item__rarity-img {
	width: calc(var(--spacing)*36);
	height: calc(var(--spacing)*36);
	--tw-translate-x: calc(calc(1/2*100%)*-1);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	--tw-translate-y: calc(calc(1/2*100%)*-1);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	position: absolute;
	top: 50%;
	left: 50%
}

.event__leaderboard-overlay {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	width: 100%;
	height: 100%;
	padding: calc(var(--spacing)*3);
	flex-direction: column;
	justify-content: space-between;
	display: flex;
	position: absolute
}

.event__leaderboard-overlay-top {
	justify-content: space-between;
	align-items: center;
	display: flex
}

.event__leaderboard-overlay-top .event__leaderboard-user span {
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden
}

@media not all and (min-width:590px) {
	.event__leaderboard-overlay-top .event__leaderboard-user span {
		max-width: 3rem
	}
}

@media not all and (min-width:500px) {
	.event__leaderboard-overlay-top .event__leaderboard-user span {
		display: none
	}
}

.event__leaderboard-user {
	align-items: center;
	gap: calc(var(--spacing)*2);
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray-light);
	display: flex
}

.event__leaderboard-user img {
	width: calc(var(--spacing)*6);
	height: calc(var(--spacing)*6);
	object-fit: cover;
	border-radius: 3.40282e38px
}

.event__leaderboard-img {
	top: calc(var(--spacing)*0);
	z-index: 3;
	--tw-translate-x: calc(calc(1/2*100%)*-1);
	max-height: 4rem;
	translate: var(--tw-translate-x)var(--tw-translate-y);
	position: absolute;
	left: 50%
}

@media not all and (min-width:850px) {
	.event__leaderboard-img {
		display: none
	}
}

.event__leaderboard-table {
	overflow: auto
}

.event__leaderboard-table::-webkit-scrollbar {
	height: calc(var(--spacing)*0);
	width: calc(var(--spacing)*0)
}

.event__leaderboard-table .event__leaderboard-user {
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height))
}

.event__leaderboard-table .event__leaderboard-user img {
	width: calc(var(--spacing)*9);
	height: calc(var(--spacing)*9)
}

@media not all and (min-width:460px) {
	.event__leaderboard-table .event__leaderboard-user span {
		display: none
	}
}

.event__who-btn {
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray-light);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration))
}

@media (hover:hover) {
	.event__who-btn:hover {
		color: var(--primary)
	}
}

.items-small {
	justify-content: flex-end;
	align-items: center;
	gap: calc(var(--spacing)*2);
	width: 100%;
	display: flex
}

.items-small__wins-item {
	align-items: flex-start;
	gap: calc(var(--spacing)*.5);
	flex-direction: column;
	display: flex
}

.items-small__wins-item .item__center {
	height: fit-content;
	width: calc(var(--spacing)*16);
	border-radius: var(--radius-2xl);
	padding: calc(var(--spacing)*2);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #222c44
}

.items-small__wins-item .item__rarity-img {
	width: calc(var(--spacing)*12);
	height: calc(var(--spacing)*12);
	--tw-translate-x: calc(calc(1/2*100%)*-1);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	--tw-translate-y: calc(calc(1/2*100%)*-1);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	position: absolute;
	top: 50%;
	left: 50%
}

.items-small__wins-item .item__center-dolphin {
	font-size: var(--text-2xl);
	line-height: var(--tw-leading, var(--text-2xl--line-height))
}

.items-small__wins-item:hover .item__center {
	background-color: #2c3854
}

table {
	border-collapse: collapse;
	width: 100%
}

table thead tr td {
	padding-inline: calc(var(--spacing)*3);
	padding-block: calc(var(--spacing)*1);
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray-light)
}

table thead tr td:last-child {
	text-align: end
}

table tbody tr {
	position: relative
}

table tbody tr:last-child {
	border-bottom-style: var(--tw-border-style);
	border-bottom-width: 0
}

@media not all and (min-width:475px) {
	table tbody tr {
		border-bottom-style: var(--tw-border-style);
		border-bottom-width: 1px;
		border-bottom-color: #1a243e
	}
}

table tbody tr:after {
	top: 50%;
	left: calc(var(--spacing)*0);
	--tw-translate-y: calc(calc(1/2*100%)*-1);
	width: 100%;
	height: calc(100% - .75rem);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	border-radius: var(--radius-3xl);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #1E2229;
	position: absolute
}

@media (min-width:476px) {
	table tbody tr:after {
		--tw-content: "";
		content: var(--tw-content)
	}
}

table tbody tr td {
	z-index: 1;
	height: 5rem;
	padding-inline: calc(var(--spacing)*3);
	padding-block: calc(var(--spacing)*3.5);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	position: relative
}

table tbody tr td .event__leaderboard-user {
	width: fit-content;
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height))
}

table tbody tr td .event__leaderboard-user img {
	width: calc(var(--spacing)*9);
	height: calc(var(--spacing)*9)
}

table tbody tr td:last-child {
	text-align: end
}

table tbody tr td:last-child>* {
	width: fit-content;
	margin-left: auto
}

table tbody tr:hover:after {
	background-color: #2A2E38
}

.tabs {
	height: calc(var(--spacing)*12);
	background-color: #1E2229;
	border-radius: 3.40282e38px;
	align-items: stretch;
	width: fit-content;
	display: flex
}

@media not all and (min-width:475px) {
	.tabs {
		width: 100%;
		overflow: auto
	}
}

.tabs__button {
	justify-content: center;
	align-items: center;
	gap: calc(var(--spacing)*2);
	padding-inline: calc(var(--spacing)*4);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray-light);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	border-radius: 3.40282e38px;
	flex-shrink: 0;
	display: flex;
	position: relative
}

@media (hover:hover) {
	.tabs__button:hover {
		color: var(--color-white);
		background-color: #2A2E38
	}
}

.tabs__button.active {
	color: var(--color-white);
	background: var(--primary-gradient);
	box-shadow: var(--shadow-primary)
}

.tabs::-webkit-scrollbar {
	height: calc(var(--spacing)*0)
}

.title {
	padding-block: calc(var(--spacing)*4);
	font-size: var(--text-3xl);
	line-height: var(--tw-leading, var(--text-3xl--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold);
	justify-content: center;
	display: flex;
	position: relative;
	--tw-leading: 110%;
	line-height: 110%
}

.title span {
	z-index: 1;
	--tw-leading: 110%;
	line-height: 110%;
	position: relative
}

.title img {
	--tw-translate-x: calc(calc(1/2*100%)*-1);
	max-height: 7rem;
	translate: var(--tw-translate-x)var(--tw-translate-y);
	--tw-translate-y: calc(calc(1/2*100%)*-1);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	position: absolute;
	top: 50%;
	left: 50%
}

.refferal__wrapp {
	justify-content: space-between;
	align-items: flex-start;
	gap: calc(var(--spacing)*4);
	flex-direction: column;
	display: flex
}

@media (min-width:801px) {
	.refferal__wrapp {
		flex-direction: row
	}
}

.refferal__right {
	gap: calc(var(--spacing)*4);
	flex-direction: column;
	flex-shrink: 0;
	width: 100%;
	display: flex
}

@media (min-width:801px) {
	.refferal__right {
		width: 30%
	}
}

.refferal__levels {
	gap: calc(var(--spacing)*4);
	border-radius: var(--radius-3xl);
	padding: calc(var(--spacing)*6);
	background-color: #1E2229;
	flex-direction: column;
	display: flex
}

@media (min-width:1001px) {
	.refferal__levels {
		padding: calc(var(--spacing)*4)
	}
}

.refferal__levels-list {
	gap: calc(var(--spacing)*2);
	flex-direction: column;
	display: flex
}

.refferal__level-item {
	border-radius: var(--radius-2xl);
	padding: calc(var(--spacing)*2);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #2A2E38;
	justify-content: space-between;
	align-items: center;
	display: flex
}

:is(.refferal__level-item>*) {
	pointer-events: none
}

@media (hover:hover) {
	.refferal__level-item:hover {
		background-color: #303541
	}
}

.refferal__level-item:not(.active) {
	cursor: not-allowed;
	opacity: .4
}

.refferal__level-item-left {
	align-items: center;
	gap: calc(var(--spacing)*3);
	display: flex
}

.refferal__level-item-progress {
	width: calc(var(--spacing)*9);
	height: calc(var(--spacing)*9);
	position: relative
}

.refferal__level-item-number {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	width: 100%;
	height: 100%;
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-semibold);
	font-weight: var(--font-weight-semibold);
	justify-content: center;
	align-items: center;
	display: flex;
	position: absolute
}

.refferal__level-procent {
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray-light)
}

.refferal__body {
	gap: calc(var(--spacing)*4);
	flex-direction: column;
	flex: 1;
	width: 100%;
	display: flex
}

.refferal__main {
	border-radius: var(--radius-3xl);
	position: relative;
	overflow: hidden
}

.refferal__main-inner {
	z-index: 1;
	justify-content: center;
	align-items: center;
	gap: calc(var(--spacing)*2);
	width: 100%;
	padding: calc(var(--spacing)*8);
	flex-direction: column;
	display: flex;
	position: relative
}

.refferal__main-inner>span {
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-semibold);
	font-weight: var(--font-weight-semibold);
	--tw-drop-shadow-size: drop-shadow(0 0 1rem var(--tw-drop-shadow-color, #00000080));
	--tw-drop-shadow: var(--tw-drop-shadow-size);
	filter: var(--tw-blur, )var(--tw-brightness, )var(--tw-contrast, )var(--tw-grayscale, )var(--tw-hue-rotate, )var(--tw-invert, )var(--tw-saturate, )var(--tw-sepia, )var(--tw-drop-shadow, )
}

.refferal__main-img {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	object-fit: cover;
	object-position: center;
	width: 100%;
	height: 100%;
	position: absolute
}

.refferal__main-body {
	justify-content: center;
	align-items: center;
	gap: calc(var(--spacing)*4);
	--tw-gradient-position: to bottom in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-from: #2A2E38;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-to: #1E2229;
	height: 4rem;
	padding-right: calc(var(--spacing)*2);
	padding-left: calc(var(--spacing)*6);
	font-size: var(--text-xl);
	line-height: var(--tw-leading, var(--text-xl--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold);
	border-radius: 3.40282e38px;
	display: flex
}

.refferal__main-btn {
	width: calc(var(--spacing)*12);
	height: calc(var(--spacing)*12);
	font-size: var(--text-xl);
	line-height: var(--tw-leading, var(--text-xl--line-height));
	color: var(--color-white);
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background: var(--primary-gradient);
	box-shadow: var(--shadow-primary);
	border-radius: 3.40282e38px;
	justify-content: center;
	align-items: center;
	display: flex
}

@media (hover:hover) {
	.refferal__main-btn:hover {
		scale: 1.1
	}
}

.refferal__grid {
	gap: calc(var(--spacing)*4);
	grid-template-columns: repeat(1, minmax(0, 1fr));
	display: grid
}

@media (min-width:1001px) {
	.refferal__grid {
		grid-template-columns: repeat(3, minmax(0, 1fr))
	}
}

.refferal__grid .sum {
	font-size: var(--text-lg);
	line-height: var(--tw-leading, var(--text-lg--line-height))
}

@media (min-width:1001px) {
	.refferal__grid .fill {
		grid-column: span 2/span 2
	}
}

.refferal__grid .bonus__task-image {
	right: calc(var(--spacing)*0)
}

.refferal__grid .bonus__task {
	width: 100%
}

.refferal__refill {
	padding-right: calc(var(--spacing)*5);
	justify-content: space-between;
	align-items: center;
	display: flex
}

.refferal__banner {
	justify-content: center;
	gap: calc(var(--spacing)*5);
	border-radius: var(--radius-3xl);
	padding: calc(var(--spacing)*6);
	background-color: #1E2229;
	flex-direction: column;
	display: flex;
	position: relative
}

@media (min-width:1001px) {
	.refferal__banner {
		grid-row: 1/3;
		grid-column-start: 3
	}
}

.refferal__inputs {
	justify-content: space-between;
	align-items: stretch;
	gap: calc(var(--spacing)*4);
	flex-direction: column;
	display: flex
}

@media (min-width:651px) {
	.refferal__inputs {
		flex-direction: row
	}
}

.refferal__banner-desc {
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold);
	color: var(--gray-light);
	margin-left: auto
}

.withdraw__items {
	gap: calc(var(--spacing)*4);
	flex-direction: column;
	display: flex
}

.withdraw__items .cases__top {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	padding: calc(var(--spacing)*0);
	background-color: #0000;
	position: relative
}

.withdraw__item {
	border-style: var(--tw-border-style);
	border-width: 2px;
	border-color: #0000;
	cursor: pointer;
}

.withdraw__item.selected {
	border-color: #ffd632
}

.selectChangeItem.selected {
    border-color: #ffd632;
	border-width: 2px;
}

.withdraw__info {
	bottom: calc(var(--spacing)*4);
	left: calc(var(--spacing)*0);
	z-index: 4;
	border-radius: var(--radius-3xl);
	border-style: var(--tw-border-style);
	padding-block: calc(var(--spacing)*2);
	padding-right: calc(var(--spacing)*2);
	padding-left: calc(var(--spacing)*4);
	background-color: #2A2E38;
	border-width: 1px;
	border-color: #2e3c60;
	justify-content: space-between;
	align-items: center;
	display: flex;
	position: sticky
}

@media (min-width:416px) {
	.withdraw__info {
		padding-block: calc(var(--spacing)*3);
		padding-right: calc(var(--spacing)*3);
		padding-left: calc(var(--spacing)*6)
	}
}

.withdraw__info.disabled {
	gap: calc(var(--spacing)*4);
	padding-block: calc(var(--spacing)*5);
	background-color: #564112;
	border-color: #fdc705;
	flex-wrap: wrap
}

.withdraw__info.disabled .withdraw__disabled-info p {
	color: #ffffff80
}

@supports (color:color-mix(in lab, red, red)) {
	.withdraw__info.disabled .withdraw__disabled-info p {
		color: color-mix(in oklab, var(--color-white)50%, transparent)
	}
}

.withdraw__info-left {
	top: calc(var(--spacing)*.5);
	align-items: center;
	gap: calc(var(--spacing)*4);
	height: 100%;
	display: flex;
	position: relative
}

@media (min-width:416px) {
	.withdraw__info-left {
		gap: calc(var(--spacing)*6)
	}
}

.withdraw__info-item {
	gap: calc(var(--spacing)*.5);
	flex-direction: column;
	display: flex
}

.withdraw__info-item>span {
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	--tw-leading: 100%;
	--tw-font-weight: var(--font-weight-medium);
	line-height: 100%;
	font-weight: var(--font-weight-medium);
	color: var(--gray-light)
}

@media (min-width:416px) {
	.withdraw__info-item>span {
		font-size: var(--text-sm);
		line-height: var(--tw-leading, var(--text-sm--line-height))
	}
}

.withdraw__info-item-text {
	align-items: center;
	gap: calc(var(--spacing)*1);
	--tw-font-weight: var(--font-weight-semibold);
	font-weight: var(--font-weight-semibold);
	display: flex
}

@media (min-width:416px) {
	.withdraw__info-item-text {
		gap: calc(var(--spacing)*2);
		font-size: var(--text-lg);
		line-height: var(--tw-leading, var(--text-lg--line-height))
	}
}

.withdraw__info-right {
	align-items: center;
	gap: calc(var(--spacing)*2);
	border-radius: var(--radius-3xl);
	display: flex
}

.withdraw__empty {
	border-style: var(--tw-border-style);
	border-width: 1px;
	border-color: #2A2E38;
	border-radius: 1.5rem;
	min-height: 24rem
}

.withdraw__items-wrapp {
	gap: calc(var(--spacing)*4);
	flex-direction: column;
	display: flex
}

.withdraw__icons {
	top: calc(var(--spacing)*11);
	right: calc(var(--spacing)*3);
	z-index: 2;
	align-items: center;
	gap: calc(var(--spacing)*2);
	font-size: var(--text-base);
	line-height: var(--tw-leading, var(--text-base--line-height));
	color: var(--gray);
	display: flex;
	position: absolute
}

.withdraw__item-wrapp {
	position: relative
}

.withdraw__sort {
	justify-content: space-between;
	align-items: center;
	gap: calc(var(--spacing)*4);
	flex-wrap: wrap;
	display: flex
}

.withdraw__sort-item {
	align-items: center;
	gap: calc(var(--spacing)*2);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	display: flex
}

@media (hover:hover) {
	.withdraw__sort-item:hover {
		color: var(--primary)
	}
}

.withdraw__sort-item i {
	height: calc(var(--spacing)*1.5);
	width: calc(var(--spacing)*1.5);
	border-right-style: var(--tw-border-style);
	border-right-width: 2px;
	border-bottom-style: var(--tw-border-style);
	border-bottom-width: 2px;
	border-bottom-color: currentColor;
	border-right-color: currentColor;
	rotate: 45deg
}

.withdraw__sale {
	gap: calc(var(--spacing)*.5);
	border-radius: var(--radius-3xl);
	padding: calc(var(--spacing)*4);
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	color: var(--gray-light);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #303541;
	flex-direction: column;
	display: flex
}

@media (hover:hover) {
	.withdraw__sale:hover {
		background-color: #1E2229
	}
}

.withdraw__sale-sum {
	align-items: center;
	gap: calc(var(--spacing)*1);
	font-size: var(--text-base);
	line-height: var(--tw-leading, var(--text-base--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--color-white);
	display: flex
}

.withdraw__sort-left {
	align-items: center;
	gap: calc(var(--spacing)*8);
	display: flex
}

.withdraw__sort-sale-all {
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	color: var(--gray);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration))
}

@media (hover:hover) {
	.withdraw__sort-sale-all:hover {
		color: var(--primary)
	}
}

.withdraw__disabled {
	align-items: center;
	gap: calc(var(--spacing)*3);
	display: flex
}

.withdraw__disabled img {
	flex-shrink: 0;
	max-width: 2rem
}

.withdraw__disabled-info {
	gap: calc(var(--spacing)*1.5);
	flex-direction: column;
	display: flex
}

:is(.withdraw__disabled-info>*) {
	--tw-leading: 100%;
	line-height: 100%
}

.withdraw__disabled-info span {
	font-size: var(--text-base);
	line-height: var(--tw-leading, var(--text-base--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium)
}

.withdraw__disabled-info p {
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	color: var(--gray-light)
}

.deposit__top {
	justify-content: space-between;
	align-items: center;
	gap: calc(var(--spacing)*4);
	flex-wrap: wrap;
	display: flex
}

.deposit__body {
	justify-content: space-between;
	align-items: flex-start;
	gap: calc(var(--spacing)*3);
	flex-direction: column;
	display: flex;
	position: relative
}

@media (min-width:751px) {
	.deposit__body {
		flex-direction: row
	}
}

.deposit__body-wrapp {
	gap: calc(var(--spacing)*3);
	flex-direction: column;
	width: 100%;
	display: flex
}

@media (min-width:751px) {
	.deposit__body-wrapp {
		flex: 1
	}
}

.deposit__methods {
	gap: calc(var(--spacing)*3);
	display: grid
}

@media (min-width:0) {
	.deposit__methods {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		display: grid
	}
}

@media (min-width:941px) {
	.deposit__methods {
		grid-template-columns: repeat(4, minmax(0, 1fr))
	}
}

.deposit__methods::-webkit-scrollbar {
	height: calc(var(--spacing)*1)
}

.deposit__methods.crypto .deposit__method-image {
	width: calc(var(--spacing)*10);
	height: calc(var(--spacing)*10);
	max-width: fit-content;
	max-height: fit-content
}

@media (min-width:751px) {
	.deposit__methods.crypto .deposit__method-image {
		width: calc(var(--spacing)*14);
		height: calc(var(--spacing)*14)
	}
}

.deposit__methods.giftcards .deposit__method-image {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	object-fit: cover;
	object-position: center;
	width: 100%;
	max-width: 100%;
	height: 100%;
	max-height: 100%;
	position: absolute
}

.deposit__methods.giftcards .deposit__method {
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration))
}

@media (hover:hover) {
	.deposit__methods.giftcards .deposit__method:hover {
		--tw-scale-x: 105%;
		--tw-scale-y: 105%;
		--tw-scale-z: 105%;
		scale: var(--tw-scale-x)var(--tw-scale-y)
	}
}

.deposit__methods.giftcards .deposit__method:hover {
	opacity: 1 !important
}

.deposit__methods.giftcards:hover .deposit__method {
	opacity: .3
}

.deposit__method {
	justify-content: center;
	align-items: center;
	gap: calc(var(--spacing)*1.5);
	border-radius: var(--radius-3xl);
	height: 6rem;
	background-color: #1E2229;
	flex-direction: column-reverse;
	display: flex;
	position: relative;
	overflow: hidden
}

@media (hover:hover) {
	.deposit__method:hover {
		background-color: #2A2E38
	}
}

@media not all and (min-width:751px) {
	.deposit__method {
		flex-shrink: 0
	}
}

@media (min-width:476px) {
	.deposit__method {
		height: 9rem
	}
}

@media (min-width:821px) {
	.deposit__method {
		height: 10rem
	}
}

.deposit__method.active {
	background-color: #2A2E38
}

.deposit__method.active .deposit__method-bg {
	opacity: 1
}

.deposit__method-min {
	align-items: center;
	gap: calc(var(--spacing)*1);
	padding-inline: calc(var(--spacing)*2);
	padding-block: calc(var(--spacing)*1);
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	background-color: #2d3858;
	border-radius: 3.40282e38px;
	display: flex
}

@media (min-width:476px) {
	.deposit__method-min {
		top: calc(var(--spacing)*2.5);
		right: calc(var(--spacing)*2.5);
		font-size: var(--text-sm);
		line-height: var(--tw-leading, var(--text-sm--line-height));
		position: absolute
	}
}

.deposit__method-bg {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	border-radius: var(--radius-3xl);
	border-style: var(--tw-border-style);
	--tw-gradient-position: to bottom in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-from: oklab(0% 0 0/0);
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-to: oklab(68.1914% -.0554805 -.162518/.16);
	opacity: 0;
	width: 100%;
	height: 100%;
	transition-property: opacity;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	border-width: 2px;
	border-color: #359cfe;
	position: absolute
}

.deposit__method-image {
	max-width: 5rem;
	max-height: 2.5rem
}

@media (min-width:476px) {
	.deposit__method-image {
		max-width: 6rem;
		max-height: 4rem
	}
}

@media (min-width:821px) {
	.deposit__method-image {
		max-width: 8rem
	}
}

.deposit__form {
	top: calc(var(--spacing)*44);
	right: calc(var(--spacing)*0);
	gap: calc(var(--spacing)*3);
	flex-direction: column;
	flex-shrink: 0;
	width: 100%;
	display: flex;
	position: sticky
}

@media (min-width:751px) {
	.deposit__form {
		max-width: 25rem
	}
}

.deposit__form-card {
	gap: calc(var(--spacing)*4);
	border-radius: var(--radius-3xl);
	padding: calc(var(--spacing)*5);
	background-color: #1E2229;
	flex-direction: column;
	display: flex
}

.deposit__form-card .form-input .form-input__wrapp input {
	background-color: #2A2E38
}

@media (hover:hover) {
	.deposit__form-card .form-input .form-input__wrapp input:hover {
		background-color: #303541
	}
}

.deposit__form-card .form-input .form-input__wrapp input:focus {
	background-color: #303541
}

.deposit__form-card .form-input .page__header-back {
	color: var(--gray-light);
	background-color: #303541
}

@media (hover:hover) {
	.deposit__form-card .form-input .page__header-back:hover {
		color: var(--color-white);
		background-color: #1E2229
	}
}

.deposit__select-pay {
	justify-content: space-between;
	align-items: center;
	gap: calc(var(--spacing)*4);
	display: flex
}

.deposit__select-pay-info {
	gap: calc(var(--spacing)*2);
	flex-direction: column;
	display: flex
}

:is(.deposit__select-pay-info>*) {
	--tw-leading: 100%;
	line-height: 100%
}

.deposit__select-pay-info p {
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray-light)
}

.deposit__select-pay-info span {
	font-size: var(--text-lg);
	line-height: var(--tw-leading, var(--text-lg--line-height));
	--tw-font-weight: var(--font-weight-semibold);
	font-weight: var(--font-weight-semibold)
}

.deposit__select-pay-system {
	align-items: center;
	gap: calc(var(--spacing)*2);
	display: flex
}

.deposit__select-pay-system img {
	max-width: 4rem;
	max-height: 2rem
}

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

.deposit__qr img {
	border-radius: var(--radius-md)
}

.deposit__sum {
	align-items: center;
	gap: calc(var(--spacing)*2);
	display: flex
}

.deposit__sum-icon {
	bottom: calc(var(--spacing)*5);
	--tw-translate-x: calc(calc(1/2*100%)*-1);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	color: #455172;
	position: absolute;
	left: 50%
}

.empty {
	justify-content: center;
	align-items: center;
	gap: calc(var(--spacing)*2);
	width: 100%;
	padding-block: calc(var(--spacing)*12);
	text-align: center;
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray-light);
	flex-direction: column;
	display: flex
}

.empty .icon {
	font-size: var(--text-4xl);
	line-height: var(--tw-leading, var(--text-4xl--line-height));
	color: var(--gray)
}

.table-wrapp {
	width: 100%;
	position: relative;
	overflow: auto
}

.table-wrapp::-webkit-scrollbar {
	height: calc(var(--spacing)*0);
	width: calc(var(--spacing)*0)
}

@media not all and (min-width:769px) {
	.table-wrapp table {
		min-width: 768px
	}
}

.table-wrapp .system {
	align-items: center;
	gap: calc(var(--spacing)*2);
	display: flex
}

.table-wrapp .system img {
	max-width: 5rem;
	max-height: 2rem
}

.status {
	align-items: center;
	gap: calc(var(--spacing)*2);
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	display: flex
}

.status i {
	width: calc(var(--spacing)*1.5);
	height: calc(var(--spacing)*1.5);
	animation: var(--animate-pulse);
	background-color: var(--color-white);
	border-radius: 3.40282e38px
}

.animate_on .status i {
	animation: none
}

.status.success {
	color: #4ae2da
}

.status.success i {
	background-color: #4ae2da
}

.status.warning {
	color: #ffa924
}

.status.warning i {
	background-color: #ffa924
}

.status.error {
	color: #ff5454
}

.status.error i {
	background-color: #ff5454
}

.status.gray {
	color: var(--gray-light)
}

.status.gray i {
	background-color: var(--gray-light)
}

.status .help {
	margin-right: calc(var(--spacing)*.5);
	margin-left: calc(var(--spacing)*.5);
	font-size: var(--text-lg);
	line-height: var(--tw-leading, var(--text-lg--line-height));
	color: var(--gray);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration))
}

@media (hover:hover) {
	.status .help:hover {
		color: var(--gray-light)
	}
}

.pagination {
	justify-content: space-between;
	align-items: center;
	gap: calc(var(--spacing)*4);
	display: flex
}

.pagination__button {
	height: calc(var(--spacing)*12);
	align-items: center;
	gap: calc(var(--spacing)*3);
	padding-inline: calc(var(--spacing)*4);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #1E2229;
	border-radius: 3.40282e38px;
	display: flex
}

@media (hover:hover) {
	.pagination__button:hover {
		color: var(--gray-light);
		background-color: #2A2E38
	}
}

@media not all and (min-width:500px) {
	.pagination__button span {
		display: none
	}
}

.pagination__current {
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray)
}

.pagination__current span>span {
	color: var(--color-white)
}

.btn-border {
	height: calc(var(--spacing)*12);
	justify-content: center;
	align-items: center;
	gap: calc(var(--spacing)*4);
	border-style: var(--tw-border-style);
	padding-inline: calc(var(--spacing)*4);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	border-width: 1px;
	border-color: #1e2842;
	border-radius: 3.40282e38px;
	display: flex
}

@media (hover:hover) {
	.btn-border:hover {
		color: var(--gray-light);
		border-color: #212c48
	}
}

.title2 {
	justify-content: space-between;
	align-items: center;
	gap: calc(var(--spacing)*3);
	font-size: var(--text-2xl);
	line-height: var(--tw-leading, var(--text-2xl--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold);
	flex-wrap: wrap;
	display: flex
}

@keyframes case {
	0% {
		transform: scale(1)
	}

	to {
		transform: scale(1.1)
	}
}

@keyframes caseEnter {
	0% {
		opacity: 0;
		transform: translate(16px)rotate(5deg)
	}

	to {
		opacity: 1;
		transform: translate(0)
	}
}

@keyframes caseLeave {
	0% {
		opacity: 1;
		transform: translate(0)rotate(0)
	}

	to {
		opacity: 0;
		transform: translate(-16px)rotate(-5deg)
	}
}

.items {
	gap: calc(var(--spacing)*2);
	grid-template-columns: repeat(2, minmax(0, 1fr));
	display: grid
}

@media (min-width:451px) {
	.items {
		grid-template-columns: repeat(3, minmax(0, 1fr))
	}
}

@media (min-width:581px) {
	.items {
		grid-template-columns: repeat(4, minmax(0, 1fr))
	}
}

@media (min-width:721px) {
	.items {
		grid-template-columns: repeat(5, minmax(0, 1fr))
	}
}

@media (min-width:861px) {
	.items {
		grid-template-columns: repeat(6, minmax(0, 1fr))
	}
}

@media (min-width:981px) {
	.items {
		grid-template-columns: repeat(7, minmax(0, 1fr))
	}
}

.item {
	border-radius: var(--radius-2xl);
	width: 100%;
	max-width: 100%;
	transition: background-color .15s ease, color .15s ease;
	-webkit-user-select: none;
	user-select: none;
	background-color: #1E2229;
	flex-direction: column;
	display: flex;
	position: relative;
	overflow: hidden;
	padding: 1px
}

@media (hover:hover) {
	.item:hover {
		z-index: 1;
		/* --tw-shadow: 0 .5rem 1.5rem var(--tw-shadow-color, #0000001a);
		box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
		background-color: #243050; */
		/* transition: 0.2s; */
		scale: 1.05
	}
}

.item__inner {
	width: 100%;
	max-width: 100%;
	padding: calc(var(--spacing)*2.5);
	flex-direction: column;
	display: flex;
	position: relative;
	background: #1E2229;
	border-radius: var(--radius-2xl)
}

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

.item__top .sum {
	margin-left: auto;
}

.item__top .sum .icon:before {
	background: var(--coin)
}

.item__center {
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 4.5rem;
	display: flex;
	position: relative;
	z-index: 2
}

@media (min-width:576px) {
	.item__center {
		height: 7rem;
		padding: 10px 0
	}
}

.item__image {
	z-index: 1;
	max-width: 100%;
	max-height: 100%;
	transition-property: transform, translate, scale, rotate;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	position: relative;
	object-fit: contain
}

.item__rarity-img {
	top: calc(var(--spacing)*5);
	left: calc(var(--spacing)*0);
	object-fit: cover;
	object-position: center;
	width: 100%;
	height: 120%;
	position: absolute;
	z-index: 1
}

.item__bottom {
	gap: calc(var(--spacing)*1);
	max-width: 100%;
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	flex-direction: column;
	display: flex;
	position: relative;
	z-index: 2
}

:is(.item__bottom>*) {
	--tw-leading: 100%;
	line-height: 100%
}

.item__bottom>* {
	text-overflow: ellipsis;
	white-space: nowrap;
	width: 100%;
	overflow: hidden
}

.item__model {
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	color: var(--gray-light)
}

.item__quality {
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	color: var(--gray)
}

.item:hover .item__image {
	scale: 1.15
}

.item:hover .item__center-dolphin {
	scale: .95
}

.item__center-dolphin {
	--tw-translate-x: calc(calc(1/2*100%)*-1);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	--tw-translate-y: calc(calc(1/2*100%)*-1);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	font-size: var(--text-8xl);
	line-height: var(--tw-leading, var(--text-8xl--line-height));
	color: #ffffff08;
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	position: absolute;
	top: 50%;
	left: 50%
}

@supports (color:color-mix(in lab, red, red)) {
	.item__center-dolphin {
		color: color-mix(in oklab, var(--color-white)3%, transparent)
	}
}

.item__count {
	border-style: var(--tw-border-style);
	padding-inline: calc(var(--spacing)*2);
	padding-block: calc(var(--spacing)*.5);
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: #4ae2da;
	border-width: 1px;
	border-color: #4ae2da;
	border-radius: 3.40282e38px
}

.item.null .item__count {
	color: #ff5454;
	border-color: #ff5454
}

.item .status {
	font-size: .65rem;
	line-height: var(--tw-leading, var(--text-xs--line-height));
	text-transform: uppercase;
	font-weight: 600;
	gap: .25rem;
	white-space: nowrap
}

.profile__top {
	justify-content: space-between;
	align-items: stretch;
	gap: calc(var(--spacing)*3);
	flex-direction: column;
	display: flex
}

@media (min-width:1001px) {
	.profile__top {
		flex-direction: row
	}
}

.profile__left {
	gap: calc(var(--spacing)*3);
	flex-direction: column;
	display: flex
}

@media (min-width:1001px) {
	.profile__left {
		width: 50%
	}
}

.profile__left .bonus__task {
	background-color: #1E2229
}

.profile__left-top {
	justify-content: space-between;
	align-items: stretch;
	gap: calc(var(--spacing)*3);
	flex-direction: column;
	display: flex
}

@media (min-width:521px) {
	.profile__left-top {
		flex-direction: row
	}
}

.profile__card {
	gap: calc(var(--spacing)*4);
	border-radius: var(--radius-3xl);
	--tw-gradient-to-position: 80%;
	padding: calc(var(--spacing)*6);
	background-color: #1E2229;
	flex-direction: column;
	flex: 1;
	display: flex
}

.profile__card .btn-border {
	color: var(--gray);
	border-color: #435683
}

@media (hover:hover) {
	.profile__card .btn-border:hover {
		color: var(--gray-light);
		border-color: #576da1
	}
}

.profile__user {
	align-items: center;
	gap: calc(var(--spacing)*4);
	display: flex
}

.profile__user img {
	width: calc(var(--spacing)*20);
	height: calc(var(--spacing)*20);
	object-fit: cover;
	border-radius: 3.40282e38px
}

.profile__user-inner {
	gap: calc(var(--spacing)*2.5);
	flex-direction: column;
	display: flex
}

:is(.profile__user-inner>*) {
	--tw-leading: 100%;
	line-height: 100%
}

.profile__user-inner>span {
	font-size: var(--text-xl);
	line-height: var(--tw-leading, var(--text-xl--line-height));
	--tw-font-weight: var(--font-weight-semibold);
	font-weight: var(--font-weight-semibold)
}

.profile__user-id {
	align-items: center;
	gap: calc(var(--spacing)*1.5);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	color: var(--gray-light);
	display: flex
}

.profile__user-id button {
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration))
}

@media (hover:hover) {
	.profile__user-id button:hover {
		color: var(--primary)
	}
}

.profile__user-buttons {
	align-items: stretch;
	gap: calc(var(--spacing)*2);
	width: 100%;
	display: flex
}

.profile__user-buttons>* {
	flex: 1;
	width: 100%
}

.profile__user-deposit-btn {
	height: calc(var(--spacing)*12);
	justify-content: center;
	align-items: center;
	gap: calc(var(--spacing)*2);
	padding-inline: calc(var(--spacing)*6);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	background: var(--primary-gradient);
	box-shadow: var(--shadow-primary);
	border-radius: 3.40282e38px;
	display: flex
}

.profile__level {
	border-radius: var(--radius-3xl);
	padding: calc(var(--spacing)*6);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #1E2229;
	flex-direction: column;
	justify-content: space-between;
	display: flex;
	position: relative;
	overflow: hidden
}

@media (hover:hover) {
	.profile__level:hover {
		background-color: #2A2E38
	}
}

.profile__level:hover .profile__level-arrow {
	color: var(--primary)
}

.profile__level:hover .profile__level-image {
	--tw-scale-x: 110%;
	--tw-scale-y: 110%;
	--tw-scale-z: 110%;
	scale: var(--tw-scale-x)var(--tw-scale-y)
}

.profile__level-top {
	gap: calc(var(--spacing)*1);
	flex-direction: column;
	display: flex
}

.profile__level-name {
	align-items: center;
	gap: calc(var(--spacing)*2);
	font-size: var(--text-xl);
	line-height: var(--tw-leading, var(--text-xl--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	display: flex
}

.profile__level-next {
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	color: var(--gray-light)
}

.profile__level-next span {
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--color-white)
}

.profile__level-arrow {
	font-size: var(--text-2xl);
	line-height: var(--tw-leading, var(--text-2xl--line-height));
	color: var(--gray);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	display: none
}

@media (min-width:521px) {
	.profile__level-arrow {
		display: block
	}
}

.profile__level-image {
	max-height: 8rem;
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	position: absolute;
	bottom: -15%;
	right: -5%
}

@media (min-width:521px) {
	.profile__level-image {
		right: -15%
	}
}

.profile__left-grid {
	gap: calc(var(--spacing)*3);
	display: grid
}

@media (min-width:521px) {
	.profile__left-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr))
	}
}

.profile__left-grid .bonus__task {
	width: 100%
}

.profile__right {
	gap: calc(var(--spacing)*3);
	flex: 1;
	display: grid
}

@media (min-width:521px) {
	.profile__right {
		grid-template-columns: repeat(2, minmax(0, 1fr))
	}
}

.profile__refferal {
	justify-content: space-between;
	gap: calc(var(--spacing)*5);
	border-radius: var(--radius-3xl);
	padding: calc(var(--spacing)*5);
	background-color: #1E2229;
	flex-direction: column;
	display: flex
}

.profile__refferal .refferal__level-item-progress {
	width: calc(var(--spacing)*14);
	height: calc(var(--spacing)*14)
}

.profile__refferal .refferal__level-item-number {
	font-size: var(--text-2xl);
	line-height: var(--tw-leading, var(--text-2xl--line-height))
}

.profile__refferal .btn-border {
	color: var(--gray);
	border-color: #435683
}

@media (hover:hover) {
	.profile__refferal .btn-border:hover {
		color: var(--gray-light);
		border-color: #576da1
	}
}

.profile__grid-inner {
	gap: calc(var(--spacing)*2);
	grid-template-columns: repeat(2, minmax(0, 1fr));
	display: grid
}

.profile__grid-inner .bonus__task {
	gap: calc(var(--spacing)*2);
	width: 100%;
	padding: calc(var(--spacing)*4);
	background-color: #2A2E38
}

.profile__grid-inner .bonus__task .bonus__task-title {
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height))
}

.profile__grid-inner .bonus__task .bonus__task-left {
	gap: calc(var(--spacing)*.5)
}

.profile__inner {
	gap: calc(var(--spacing)*3);
	flex-direction: column;
	display: flex
}

.profile__refferal-progress {
	align-items: center;
	gap: calc(var(--spacing)*3);
	display: flex
}

.profile__refferal-progress .checkbox__button-desc p {
	color: var(--gray-light)
}

.profile__skins {
	gap: calc(var(--spacing)*3);
	flex-direction: row;
	display: flex
}

@media (min-width:521px) {
	.profile__skins {
		flex-direction: column
	}
}

.profile__skins-item {
	border-radius: var(--radius-3xl);
	width: 100%;
	height: 100%;
	padding: calc(var(--spacing)*3.5);
	flex-direction: column;
	display: flex
}

@media (min-width:521px) {
	.profile__skins-item {
		height: 50%
	}
}

.profile__skins-item.top {
	border-style: var(--tw-border-style);
	--tw-gradient-position: to bottom in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-from: oklab(78.6954% .0626115 .153395/.15);
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-to: oklab(78.6953% .0626115 .153395/.36);
	border-width: 1px;
	border-color: oklab(81.5535% .057657 .123963/.3)
}

.profile__skins-item.love {
	border-style: var(--tw-border-style);
	--tw-gradient-position: to bottom in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-from: oklab(77.5877% -.169224 .106211/.15);
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-to: oklab(77.5877% -.169224 .106211/.36);
	border-width: 1px;
	border-color: oklab(86.761% -.159713 .0468996/.3)
}


.animate_on .profile__skins-item.love .item__image {
	animation: none
}

.profile__skins-item>span {
	font-size: var(--text-lg);
	line-height: var(--tw-leading, var(--text-lg--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold)
}

@media (min-width:521px) {
	.profile__skins-item>span {
		font-size: var(--text-xl);
		line-height: var(--tw-leading, var(--text-xl--line-height))
	}
}

.profile__skins-item-skin-wrapp {
	justify-content: center;
	align-items: center;
	display: flex;
	position: relative
}

@media not all and (min-width:520px) {
	.profile__skins-item-skin-wrapp {
		height: 8rem
	}
}

@media (min-width:521px) {
	.profile__skins-item-skin-wrapp {
		flex: 1
	}
}

.profile__skins-item-skin-wrapp .item__image {
	max-width: 100%;
	max-height: 100%;
	overflow: visible;
	z-index: 2
}

.animate_on .profile__skins-item-skin-wrapp .item__image {
	animation: none
}

.profile__skins-item-skin-wrapp .item__center {
	justify-content: center;
	align-items: center;
	width: 100%;
	display: flex;
	overflow: visible
}

@media not all and (min-width:520px) {
	.profile__skins-item-skin-wrapp .item__center {
		height: 6rem
	}
}

.profile__skins-item-skin-wrapp .item__rarity-img {
	--tw-translate-x: calc(calc(1/2*100%)*-1);
	max-width: 4rem;
	translate: var(--tw-translate-x)var(--tw-translate-y);
	--tw-translate-y: calc(calc(1/2*100%)*-1);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	position: absolute;
	top: 50%;
	left: 50%
}

@media (min-width:521px) {
	.profile__skins-item-skin-wrapp .item__rarity-img {
		max-width: 8rem
	}
}

.profile__skins-item-skin-wrapp .item__bottom {
	bottom: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	position: absolute
}

.profile__skins-item-skin-wrapp .item__model {
	color: #fff9
}

@supports (color:color-mix(in lab, red, red)) {
	.profile__skins-item-skin-wrapp .item__model {
		color: color-mix(in oklab, var(--color-white)60%, transparent)
	}
}

.profile__skins-item-skin-wrapp .item__quality {
	color: #fff6
}

@supports (color:color-mix(in lab, red, red)) {
	.profile__skins-item-skin-wrapp .item__quality {
		color: color-mix(in oklab, var(--color-white)40%, transparent)
	}
}

.profile__skins-item-skin-wrapp .item__name {
	max-width: 7rem
}

.profile__skins-item-skin-wrapp .item__top {
	top: calc(var(--spacing)*0);
	right: calc(var(--spacing)*0);
	position: absolute
}

.profile a.profile__skins-item-skin-wrapp {
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration))
}

@media (hover:hover) {
	.profile a.profile__skins-item-skin-wrapp:hover {
		scale: 1.15
	}
}

.profile__wrapp {
	gap: calc(var(--spacing)*5);
	flex-direction: column;
	display: flex
}

.profile__trade-link {
	border-radius: var(--radius-3xl)
}

.profile__trade-link-inner {
	gap: calc(var(--spacing)*2);
	border-radius: var(--radius-3xl);
	flex-direction: column;
	width: 100%;
	height: 100%;
	display: flex
}

.profile__trade-link-inner .form-input input {
	background-color: #1E2229
}

.profile__trade-link-inner .form-input .page__header-back {
	color: var(--gray-light);
	background-color: #2A2E38
}

@media (hover:hover) {
	.profile__trade-link-inner .form-input .page__header-back:hover {
		color: var(--color-white);
		background-color: #303541
	}
}

.profile__trade-link-head {
	align-items: center;
	gap: calc(var(--spacing)*3);
	display: flex
}

.profile__trade-link-head span {
	font-size: var(--text-lg);
	line-height: var(--tw-leading, var(--text-lg--line-height));
	--tw-font-weight: var(--font-weight-semibold);
	font-weight: var(--font-weight-semibold)
}

.profile__trade-link-head a {
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	color: var(--primary);
	text-decoration-line: underline
}

@media (hover:hover) {
	.profile__trade-link-head a:hover {
		text-decoration-line: none
	}
}

.profile__settings {
	gap: calc(var(--spacing)*2);
	flex-direction: column;
	display: flex
}

.profile__settings .linked {
	cursor: not-allowed
}

:is(.profile__settings .linked>*) {
	pointer-events: none
}

.profile__settings .linked .bonus__task-button {
	background-color: var(--primary);
	color: var(--primary)
}

@supports (color:color-mix(in lab, red, red)) {
	.profile__settings .linked .bonus__task-button {
		background-color: color-mix(in oklab, var(--primary)15%, transparent)
	}
}

.profile__settings .bonus__task {
	background-color: #1E2229;
	width: 100%
}

.profile__settings-list {
	gap: calc(var(--spacing)*3);
	display: grid
}

@media (min-width:631px) {
	.profile__settings-list {
		grid-template-columns: repeat(2, minmax(0, 1fr))
	}
}

@media (min-width:901px) {
	.profile__settings-list {
		grid-template-columns: repeat(3, minmax(0, 1fr))
	}
}

.profile__inventory {
	gap: calc(var(--spacing)*4);
	flex-direction: column;
	display: flex
}

.profile__inventory .cases__top {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	padding: calc(var(--spacing)*0);
	background-color: #0000;
	position: relative !important
}

.profile__inventory .withdraw__items-wrapp .items {
	grid-template-columns: repeat(2, minmax(0, 1fr))
}

@media (min-width:541px) {
	.profile__inventory .withdraw__items-wrapp .items {
		grid-template-columns: repeat(3, minmax(0, 1fr))
	}
}

@media (min-width:685px) {
	.profile__inventory .withdraw__items-wrapp .items {
		grid-template-columns: repeat(4, minmax(0, 1fr))
	}
}

@media (min-width:861px) {
	.profile__inventory .withdraw__items-wrapp .items {
		grid-template-columns: repeat(5, minmax(0, 1fr))
	}
}

@media (min-width:1001px) {
	.profile__inventory .withdraw__items-wrapp .items {
		grid-template-columns: repeat(6, minmax(0, 1fr))
	}
}

@media not all and (min-width:570px) {
	.profile__inventory .withdraw__info {
		align-items: flex-start;
		gap: calc(var(--spacing)*2);
		padding: calc(var(--spacing)*2);
		flex-direction: column
	}
}

.profile__inventory .withdraw__info-left {
	padding-block: calc(var(--spacing)*1.5)
}

@media not all and (min-width:570px) {
	.profile__inventory .withdraw__info-left {
		width: 100%;
		padding-left: calc(var(--spacing)*2);
		justify-content: center
	}

	.profile__inventory .withdraw__info-right {
		width: 100%
	}
}

.profile__inventory .withdraw__info-right button {
	width: 100%
}

.profile__item {
	position: relative
}

.profile.user .profile__card {
	padding: calc(var(--spacing)*4)
}

.profile.user .profile__level {
	justify-content: center
}

.profile.user .profile__right {
	grid-template-columns: repeat(1, minmax(0, 1fr))
}

.profile.user .profile__skins {
	flex-direction: row
}

.profile.user .profile__skins .profile__skins-item {
	width: 100%;
	height: 100%
}

.mines__coeff {
	margin-left: calc(var(--spacing)*-6);
	align-items: center;
	gap: calc(var(--spacing)*3);
	-webkit-user-select: none;
	user-select: none;
	width: calc(100% + 3rem);
	display: flex;
	-webkit-mask-image: linear-gradient(90deg, #fff 80%, #0000);
	mask-image: linear-gradient(90deg, #fff 80%, #0000)
}

.mines__coeff .bonus__task {
	--tw-gradient-position: to right in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-from: #2A2E38;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-to: #263b6c;
	flex-shrink: 0;
	min-width: 13rem;
	padding-right: 6rem;
	position: relative
}

.mines__coeff .bonus__task.win {
	--tw-gradient-from: #172f3c;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-to: #147e60
}

.mines__coeff .bonus__task.win .bonus__task-button {
	background-color: #129974
}

.mines__coeff .bonus__task.win .bonus__task-image img {
	--tw-translate-y: calc(var(--spacing)*0);
	max-width: 7rem;
	translate: var(--tw-translate-x)var(--tw-translate-y);
	top: 15%
}

.mines__coeff .bonus__task.win .bonus__task-title {
	color: #fff9
}

@supports (color:color-mix(in lab, red, red)) {
	.mines__coeff .bonus__task.win .bonus__task-title {
		color: color-mix(in oklab, var(--color-white)60%, transparent)
	}
}

.mines__coeff .bonus__task.lose {
	--tw-gradient-from: #4e0c09;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-to: #f5193a
}

.mines__coeff .bonus__task.lose .bonus__task-button {
	background-color: #eb1f1f
}

.mines__coeff .bonus__task.lose .bonus__task-image img {
	--tw-translate-y: calc(var(--spacing)*0);
	max-width: 7rem;
	translate: var(--tw-translate-x)var(--tw-translate-y);
	top: 15%
}

.mines__coeff .bonus__task.lose .bonus__task-title {
	color: #fff9
}

@supports (color:color-mix(in lab, red, red)) {
	.mines__coeff .bonus__task.lose .bonus__task-title {
		color: color-mix(in oklab, var(--color-white)60%, transparent)
	}
}

.mines__coeff .bonus__task:before {
	visibility: hidden;
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	border-radius: var(--radius-3xl);
	border-style: var(--tw-border-style);
	opacity: 0;
	--tw-content: "";
	content: var(--tw-content);
	border-width: 2px;
	border-color: #3a5085;
	width: 100%;
	height: 100%;
	position: absolute
}

.mines__coeff .bonus__task.active:before {
	visibility: visible;
	opacity: 1
}

.mines__coeff .bonus__task-button {
	background-color: #324268
}

.mines__coeff .bonus__task-image {
	right: calc(var(--spacing)*0);
	width: 6rem
}

.mines__coeff .bonus__task-image img {
	--tw-translate-y: calc(calc(1/2*100%)*-1);
	max-width: 3rem;
	translate: var(--tw-translate-x)var(--tw-translate-y);
	top: 50%
}

.mines__coeff .bonus__task-left {
	gap: calc(var(--spacing)*2)
}

.mines__coeff-wrapp {
	align-items: center;
	gap: calc(var(--spacing)*3);
	padding-inline: calc(var(--spacing)*6);
	display: flex;
	overflow: auto
}

.mines__coeff-wrapp::-webkit-scrollbar {
	height: calc(var(--spacing)*0);
	width: calc(var(--spacing)*0)
}

.mines__wrapp {
	justify-content: space-between;
	align-items: stretch;
	gap: calc(var(--spacing)*4);
	flex-direction: column-reverse;
	display: flex
}

@media (min-width:741px) {
	.mines__wrapp {
		flex-direction: row
	}
}

.mines__left {
	gap: calc(var(--spacing)*5);
	flex-direction: column;
	width: 100%;
	display: flex
}

@media (min-width:741px) {
	.mines__left {
		max-width: 24rem
	}
}

.mines__left .form-input {
	gap: calc(var(--spacing)*3)
}

.mines__left .form-input .form-input__wrapp input {
	text-align: center;
	font-size: var(--text-3xl);
	line-height: var(--tw-leading, var(--text-3xl--line-height));
	background: #202d4c !important;
	border: 0 !important
}

.mines__left .form-input .form-input__wrapp .form-input__button~input {
	padding-left: 4.5rem
}

.mines__left .form-input .form-input__button.left {
	right: inherit;
	left: calc(var(--spacing)*0)
}

.mines__left .form-input .page__header-back {
	color: var(--gray-light);
	background-color: #2b3d66
}

@media (hover:hover) {
	.mines__left .form-input .page__header-back:hover {
		color: var(--color-white);
		background-color: #334876
	}
}

.mines__form {
	gap: calc(var(--spacing)*6);
	flex-direction: column;
	display: flex
}

.mines__tabs {
	z-index: 2;
	justify-content: center;
	width: 100%;
	display: flex;
	position: relative
}

.mines__tabs .tabs {
	width: 100%
}

.mines__tabs .tabs .tabs__button {
	flex: 1
}

.mines__inventory {
	align-items: flex-start;
	gap: calc(var(--spacing)*2);
	flex-direction: column;
	display: flex;
	position: relative
}

.mines__inventory .checkbox {
	z-index: 2;
	position: relative
}

.mines__inventory .withdraw__info-left {
	top: calc(var(--spacing)*0);
	margin-top: calc(var(--spacing)*2);
	height: fit-content
}

.mines__inventory-wrapp {
	margin-inline: calc(var(--spacing)*-2);
	flex-direction: column;
	width: calc(100% + 1rem);
	height: 32rem;
	margin-top: -2.8125rem;
	display: flex;
	position: relative;
	-webkit-mask-image: linear-gradient(#0000 5%, #fff 20%);
	mask-image: linear-gradient(#0000 5%, #fff 20%)
}

.mines__inventory-wrapp .withdraw__empty {
	height: 100%
}

.mines__inventory-scroll {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	width: 100%;
	height: 100%;
	padding: calc(var(--spacing)*2);
	padding-top: 2.5rem;
	position: absolute;
	overflow: auto;
	-webkit-mask-image: linear-gradient(#fff 85%, #0000);
	mask-image: linear-gradient(#fff 94%, #0000)
}

.mines__inventory-scroll::-webkit-scrollbar {
	height: calc(var(--spacing)*0);
	width: calc(var(--spacing)*0)
}

.mines__inventory-scroll .items {
	gap: calc(var(--spacing)*2);
	grid-template-columns: repeat(3, minmax(0, 1fr));
	display: grid
}

.mines__inventory-scroll .items .item__center {
	height: 5rem
}

.mines__body {
	flex-direction: column;
	flex: 1;
	justify-content: center;
	display: flex
}

.mines__cards {
	justify-content: space-between;
	align-items: center;
	gap: calc(var(--spacing)*4);
	flex-wrap: wrap;
	height: 100%;
	display: flex
}

@media not all and (min-width:950px) {
	.mines__cards {
		justify-content: center
	}
}

@media (min-width:741px) {
	.mines__cards {
		padding-inline: calc(var(--spacing)*4);
		background-color: #162038;
		border-radius: 1.5rem
	}
}

@media not all and (min-width:950px) {
	@media (min-width:741px) {
		.mines__cards {
			padding-block: calc(var(--spacing)*8)
		}
	}
}

@media (min-width:1001px) {
	.mines__cards {
		gap: calc(var(--spacing)*8);
		padding-inline: calc(var(--spacing)*8)
	}
}

.mines__cards-item {
	justify-content: center;
	align-items: center;
	gap: calc(var(--spacing)*2);
	-webkit-user-select: none;
	user-select: none;
	flex-direction: column;
	display: flex
}

.mines__cards-item img {
	max-width: 3rem
}

@media (min-width:476px) {
	.mines__cards-item img {
		max-width: 4rem
	}
}

@media (min-width:951px) {
	.mines__cards-item img {
		max-width: 5rem
	}
}

.mines__cards-item span {
	font-size: var(--text-lg);
	line-height: var(--tw-leading, var(--text-lg--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold)
}

@media (min-width:951px) {
	.mines__cards-item span {
		font-size: var(--text-2xl);
		line-height: var(--tw-leading, var(--text-2xl--line-height))
	}
}

.mines__cards-wrapp {
	gap: calc(var(--spacing)*2);
	grid-template-columns: repeat(5, minmax(0, 1fr));
	width: 100%;
	display: grid
}

@media (min-width:461px) {
	.mines__cards-wrapp {
		gap: calc(var(--spacing)*3);
		width: 80%
	}
}

@media (min-width:601px) {
	.mines__cards-wrapp {
		width: 60%
	}
}

@media (min-width:741px) {
	.mines__cards-wrapp {
		width: 100%
	}
}

@media (min-width:881px) {
	.mines__cards-wrapp {
		width: 70%
	}
}

@media (min-width:951px) {
	.mines__cards-wrapp {
		flex: 1;
		width: 100%
	}
}

.mines__cards-wrapp-item {
	border-radius: var(--radius-xl);
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #263454;
	display: grid;
	position: relative
}

.mines__cards-wrapp-item:before {
	content: var(--tw-content);
	padding-top: 100%
}

@media (hover:hover) {
	.mines__cards-wrapp-item:hover {
		--tw-scale-x: 110%;
		--tw-scale-y: 110%;
		--tw-scale-z: 110%;
		scale: var(--tw-scale-x)var(--tw-scale-y);
		background-color: #29385a
	}
}

@media (min-width:461px) {
	.mines__cards-wrapp-item {
		border-radius: var(--radius-2xl)
	}
}

@media (min-width:1001px) {
	.mines__cards-wrapp-item {
		border-radius: var(--radius-3xl)
	}
}

.mines__cards-wrapp-item img {
	--tw-translate-x: calc(calc(1/2*100%)*-1);
	max-width: 80%;
	translate: var(--tw-translate-x)var(--tw-translate-y);
	--tw-translate-y: calc(calc(1/2*100%)*-1);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	position: absolute;
	top: 50%;
	left: 50%
}

.mines__cards-wrapp-item.win {
	pointer-events: none;
	background-color: #1969f5
}

.mines__cards-wrapp-item.lose {
	pointer-events: none;
	background-color: #f5193a
}

.mines__center {
	align-items: center;
	gap: calc(var(--spacing)*5);
	flex-direction: column;
	width: 100%;
	display: flex
}

@media not all and (min-width:950px) {
	.mines__center {
		order: 1
	}
}

@media (min-width:951px) {
	.mines__center {
		flex: 1
	}
}

.mines__center .btn {
	width: 100%;
	margin-inline: auto
}

@media (min-width:476px) {
	.mines__center .btn {
		width: fit-content
	}
}

.upgrade__wrapp {
	margin-inline: calc(var(--spacing)*-6);
	justify-content: space-between;
	align-items: center;
	gap: calc(var(--spacing)*6);
	flex-wrap: wrap;
	width: calc(100% + 3rem);
	display: flex
}

@media (min-width:851px) {
	.upgrade__wrapp {
		flex-wrap: nowrap
	}
}

.upgrade__item {
	width: 47%;
	position: relative
}

@media (min-width:691px) {
	.upgrade__item {
		width: 45%
	}
}

@media (min-width:851px) {
	.upgrade__item {
		width: 35%
	}
}

@media (min-width:1801px) {
	.upgrade__item {
		width: fit-content
	}
}

@media not all and (min-width:690px) {
	.upgrade__item .empty {
		font-size: var(--text-xs);
		line-height: var(--tw-leading, var(--text-xs--line-height))
	}
}

.upgrade__item-overlay {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	display: flex;
	position: absolute
}

.upgrade__item-skin {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	-webkit-user-select: none;
	user-select: none;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	display: flex;
	position: absolute
}

.upgrade__item-skin .item__center {
	height: 60%
}

.upgrade__item-skin .item__rarity-img {
	--tw-translate-x: calc(calc(1/2*100%)*-1);
	max-width: 16rem;
	translate: var(--tw-translate-x)var(--tw-translate-y);
	--tw-translate-y: calc(calc(1/2*100%)*-1);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	object-fit: contain;
	position: absolute;
	top: 50%;
	left: 50%
}

.upgrade__item-skin .item__image {
	z-index: 2
}

.animate_on .upgrade__item-skin .item__image {
	animation: none
}

.upgrade__item-skin .item__bottom {
	bottom: calc(var(--spacing)*3);
	left: calc(var(--spacing)*8);
	position: absolute
}

@media (min-width:691px) {
	.upgrade__item-skin .item__bottom {
		bottom: calc(var(--spacing)*6);
		left: calc(var(--spacing)*14)
	}
}

@media not all and (min-width:690px) {
	.upgrade__item-skin .item__bottom .item__name {
		max-width: 6rem
	}
}

.upgrade__item-skin .item__top {
	top: calc(var(--spacing)*3);
	right: calc(var(--spacing)*3);
	position: absolute
}

@media (min-width:691px) {
	.upgrade__item-skin .item__top {
		top: calc(var(--spacing)*6);
		right: calc(var(--spacing)*6)
	}
}

.upgrade__center {
	padding-block: calc(var(--spacing)*4);
	justify-content: center;
	align-items: center;
	display: flex
}

@media not all and (min-width:850px) {
	.upgrade__center {
		margin-top: calc(var(--spacing)*-12);
		order: 1;
		width: 100%
	}
}

@media (min-width:851px) {
	.upgrade__center {
		flex: 1
	}
}

.upgrade__center-wrapp {
	border-radius: 3.40282e38px;
	width: 100%;
	max-width: 18rem;
	display: grid;
	position: relative;
	overflow: hidden
}

.upgrade__center-wrapp:before {
	content: var(--tw-content);
	padding-top: 100%
}

.upgrade__center-bg {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	object-fit: contain;
	opacity: .5;
	width: 100%;
	height: 100%;
	position: absolute
}

.upgrade .page__body {
	gap: calc(var(--spacing)*0);
	padding: calc(var(--spacing)*4);
	padding-bottom: calc(var(--spacing)*0)
}

.upgrade__center-start {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	display: flex;
	position: absolute
}

.upgrade__center-start .upgrade__center-bg {
	--tw-translate-x: calc(calc(1/2*100%)*-1);
	width: 76%;
	height: 76%;
	translate: var(--tw-translate-x)var(--tw-translate-y);
	--tw-translate-y: calc(calc(1/2*100%)*-1);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	opacity: 1;
	top: 50%;
	left: 50%
}

.animate_on .upgrade__center-start .upgrade__center-bg {
	animation: none
}

.upgrade__center-logo {
	z-index: 1;
	max-width: 10rem;
	position: relative
}

.upgrade__skins-wrapp {
	margin-top: calc(var(--spacing)*5);
	margin-left: calc(var(--spacing)*-4);
	justify-content: space-between;
	align-items: stretch;
	gap: calc(var(--spacing)*3);
	flex-direction: column;
	width: calc(100% + 2rem);
	display: flex
}

@media (min-width:461px) {
	.upgrade__skins-wrapp {
		flex-direction: row
	}
}

.upgrade__skins-wrapp-item {
	gap: calc(var(--spacing)*2);
	border-radius: var(--radius-3xl);
	padding: calc(var(--spacing)*3);
	background-color: #1E2229;
	flex-direction: column;
	display: flex
}

@media (min-width:461px) {
	.upgrade__skins-wrapp-item {
		gap: calc(var(--spacing)*5);
		width: 50%
	}
}

.upgrade__skins-wrapp-item .cases__top-right {
	gap: calc(var(--spacing)*2);
	padding-bottom: calc(var(--spacing)*2)
}

@media (min-width:461px) {
	.upgrade__skins-wrapp-item .cases__top-right {
		padding-bottom: calc(var(--spacing)*0)
	}
}

.upgrade__skins-wrapp-item .cases__top-right>.form-input {
	flex: 1
}

.upgrade__skins-wrapp-item .items {
	grid-template-columns: repeat(3, minmax(0, 1fr))
}

@media (min-width:461px) {
	.upgrade__skins-wrapp-item .items {
		grid-template-columns: repeat(2, minmax(0, 1fr))
	}
}

@media (min-width:731px) {
	.upgrade__skins-wrapp-item .items {
		grid-template-columns: repeat(3, minmax(0, 1fr))
	}
}

@media (min-width:951px) {
	.upgrade__skins-wrapp-item .items {
		grid-template-columns: repeat(4, minmax(0, 1fr))
	}
}

@media not all and (min-width:475px) {
	.upgrade__skins-wrapp-item .items .item__center {
		height: 4rem
	}
}

.upgrade__skins-wrapp-item .mines__inventory-wrapp {
	-webkit-mask-image: linear-gradient(#0000 5%, #fff 15%);
	mask-image: linear-gradient(#0000 5%, #fff 15%)
}

.upgrade__skins-wrapp-item .cases__top-right {
	z-index: 2;
	position: relative
}

.upgrade__skins-wrapp-item .item,
.upgrade__skins-wrapp-item .form-input__wrapp input,
.upgrade__skins-wrapp-item .cases__prices,
.upgrade__skins-wrapp-item .cases__prices input {
	background-color: #2A2E38
}

.upgrade__skins-wrapp-item .form-input__wrapp input:hover,
.upgrade__skins-wrapp-item .cases__prices:hover,
.upgrade__skins-wrapp-item .cases__prices input:hover {
	background: #2A2E38 !important
}

.upgrade__skins-wrapp-item .cases__prices {
	position: relative
}

@media not all and (min-width:860px) {
	.upgrade__skins-wrapp-item .cases__prices {
		display: none
	}
}

.upgrade__cases-price {
	justify-content: center;
	align-items: center;
	gap: calc(var(--spacing)*2);
	border-radius: var(--radius-3xl);
	height: 4.5rem;
	padding-inline: calc(var(--spacing)*4);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-semibold);
	font-weight: var(--font-weight-semibold);
	color: var(--gray-light);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #2A2E38;
	flex-shrink: 0;
	display: flex
}

@media (hover:hover) {
	.upgrade__cases-price:hover {
		color: var(--color-white);
		background-color: #2A2E38
	}
}

.upgrade__cases-price.active {
	background-color: var(--primary);
	color: var(--primary)
}

@supports (color:color-mix(in lab, red, red)) {
	.upgrade__cases-price.active {
		background-color: color-mix(in oklab, var(--primary)15%, transparent)
	}
}

.upgrade__cases-price.active .icon {
	color: var(--primary);
	rotate: 180deg
}

.upgrade__skins-wrapp-title {
	font-size: var(--text-2xl);
	line-height: var(--tw-leading, var(--text-2xl--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold)
}

@media (min-width:461px) {
	.upgrade__skins-wrapp-title {
		display: none
	}
}

.upgrade__center-progress {
	--tw-translate-x: calc(calc(1/2*100%)*-1);
	width: 76%;
	height: 76%;
	translate: var(--tw-translate-x)var(--tw-translate-y);
	--tw-translate-y: calc(calc(1/2*100%)*-1);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	border-radius: 3.40282e38px;
	position: absolute;
	top: 50%;
	left: 50%
}

.upgrade__center-progress svg path {
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	--tw-duration: .3s;
	transition-duration: .3s
}

.upgrade__cursor {
	top: calc(var(--spacing)*0);
	z-index: 2;
	--tw-translate-x: calc(calc(1/2*100%)*-1);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	position: absolute;
	left: 50%
}

.upgrade__sphere {
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	--tw-duration: .3s;
	transition-duration: .3s
}

.upgrade.win .upgrade__sphere,
.upgrade.win #progress svg path:last-child {
	filter: hue-rotate(-50deg)
}

.upgrade.lose .upgrade__sphere,
.upgrade.lose #progress svg path:last-child {
	filter: hue-rotate(-220deg)
}

@media not all and (min-width:1880px) {
	@media (min-width:851px) {
		.upgrade .page__controls {
			padding-top: calc(var(--spacing)*4)
		}
	}
}

.upgrade__center-chances {
	font-size: var(--text-4xl);
	line-height: var(--tw-leading, var(--text-4xl--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold)
}

.casebattle__top {
	justify-content: space-between;
	gap: calc(var(--spacing)*4);
	flex-direction: column-reverse;
	display: flex
}

@media (min-width:731px) {
	.casebattle__top {
		flex-direction: row;
		align-items: center
	}
}

.casebattle__top .tabs {
	border-radius: 1.5rem;
	height: 4rem
}

.casebattle__top .tabs .tabs__button {
	padding-inline: calc(var(--spacing)*5);
	border-radius: 1.5rem
}

.casebattle__top .btn {
	height: 4rem;
	padding-inline: calc(var(--spacing)*6)
}

@media not all and (min-width:730px) {
	.casebattle__top .btn .btn__inner {
		text-align: center;
		justify-content: center
	}
}

.casebattle__top-left {
	align-items: center;
	gap: calc(var(--spacing)*5);
	flex-wrap: wrap;
	display: flex
}

.casebattle__top-left .btn-border {
	gap: calc(var(--spacing)*2);
	border-style: var(--tw-border-style);
	height: fit-content;
	padding-inline: calc(var(--spacing)*0);
	border-width: 0
}

.casebattle__list {
	gap: calc(var(--spacing)*3);
	flex-direction: column;
	display: flex
}

.casebattle__list-item {
	border-radius: var(--radius-3xl);
	background-color: #1E2229;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: stretch;
	display: flex
}

@media (min-width:731px) {
	.casebattle__list-item {
		flex-wrap: nowrap
	}
}

.casebattle__list-item.active .casebattle__cases-item.end :not(.casebattle__cases-arrow) {
	opacity: .4
}

.casebattle__list-item.active .casebattle__cases-item.active .casebattle__cases-arrow {
	opacity: 1
}

.casebattle__list-item.end .casebattle__avatars .casebattle__avatar:not(.win) {
	opacity: .3
}

.casebattle__list-item.end .casebattle__cases-item {
	opacity: .4
}

.casebattle__status {
	align-items: center;
	gap: calc(var(--spacing)*2);
	min-width: 7.5rem;
	padding: calc(var(--spacing)*4);
	flex-direction: column;
	display: flex;
	justify-content: center
}

.casebattle__status span {
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold)
}

.casebattle__status p {
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray-light)
}

.casebattle__progress {
	width: calc(var(--spacing)*14);
	height: calc(var(--spacing)*14);
	font-size: var(--text-lg);
	line-height: var(--tw-leading, var(--text-lg--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold);
	position: relative;
	border: solid 1px #2b3550;
	border-radius: 50%
}

.casebattle__round {
	--tw-translate-x: calc(calc(1/2*100%)*-1);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	--tw-translate-y: calc(calc(1/2*100%)*-1);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	position: absolute;
	top: 50%;
	left: 50%
}

.casebattle__cases {
	border-radius: var(--radius-3xl);
	background-color: #2A2E38;
	position: relative
}

@media not all and (min-width:730px) {
	.casebattle__cases {
		height: 9.125rem
	}
}

@media not all and (min-width:355px) {
	.casebattle__cases {
		width: 60%
	}
}

@media not all and (min-width:490px) {
	@media (min-width:356px) {
		.casebattle__cases {
			width: 66%
		}
	}
}

@media not all and (min-width:655px) {
	@media (min-width:491px) {
		.casebattle__cases {
			width: 75%
		}
	}
}

@media not all and (min-width:730px) {
	@media (min-width:656px) {
		.casebattle__cases {
			width: 82%
		}
	}
}

@media (min-width:731px) {
	.casebattle__cases {
		flex: 1
	}
}

.casebattle__cases-wrapp {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	align-items: center;
	width: 100%;
	height: 100%;
	display: flex;
	position: absolute;
	overflow: auto
}

.casebattle__cases-wrapp::-webkit-scrollbar {
	height: calc(var(--spacing)*0);
	width: calc(var(--spacing)*0)
}

.casebattle__cases-item {
	justify-content: center;
	align-items: center;
	gap: calc(var(--spacing)*2);
	width: 10rem;
	height: 100%;
	padding-inline: calc(var(--spacing)*4);
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray-light);
	flex-direction: column;
	flex-shrink: 0;
	display: flex;
	position: relative
}

.casebattle__cases-item span {
	text-overflow: ellipsis;
	white-space: nowrap;
	flex-shrink: 0;
	max-width: 100%;
	overflow: hidden
}

.casebattle__cases-item:hover img {
	--tw-scale-x: 110%;
	--tw-scale-y: 110%;
	--tw-scale-z: 110%;
	scale: var(--tw-scale-x)var(--tw-scale-y)
}

.casebattle__cases-item:before {
	right: calc(var(--spacing)*0);
	--tw-content: "";
	content: var(--tw-content);
	background-color: #334060;
	width: 1px;
	height: 80%;
	position: absolute;
	rotate: 10deg
}

.casebattle__cases-item-image {
	justify-content: center;
	align-items: center;
	width: 100%;
	height: calc(100% - 3rem);
	display: flex
}

.casebattle__cases-item-image img {
	object-fit: contain;
	max-height: 100%;
	transition-property: transform, translate, scale, rotate;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration))
}

.casebattle__cases-arrow {
	top: calc(var(--spacing)*-1);
	left: calc(var(--spacing)*0);
	width: 10rem;
	font-size: var(--text-lg);
	line-height: var(--tw-leading, var(--text-lg--line-height));
	color: var(--primary);
	opacity: 0;
	transition-property: opacity;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	justify-content: center;
	display: flex;
	position: absolute
}

.casebattle__panels {
	justify-content: center;
	min-width: 15.3125rem;
	padding-inline: calc(var(--spacing)*4);
	padding-block: calc(var(--spacing)*4);
	flex-direction: column;
	flex-shrink: 0;
	display: flex;
	max-width: 15.3125rem
}

@media not all and (min-width:730px) {
	.casebattle__panels {
		width: 100%
	}
}

.casebattle__panels-top {
	justify-content: space-between;
	align-items: center;
	gap: calc(var(--spacing)*5);
	display: flex;
	margin-bottom: .5rem
}

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

:where(.casebattle__avatars>:not(:last-child)) {
	--tw-space-x-reverse: 0;
	margin-inline-start: calc(calc(var(--spacing)*-3)*var(--tw-space-x-reverse));
	margin-inline-end: calc(calc(var(--spacing)*-3))calc(1 - var(--tw-space-x-reverse)))
}

.casebattle__avatar {
	width: calc(var(--spacing)*9);
	height: calc(var(--spacing)*9);
	border-style: var(--tw-border-style);
	transition-property: opacity;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #344062;
	border-width: 2px;
	border-color: #1E2229;
	border-radius: 3.40282e38px;
	position: relative;
	overflow: hidden
}

.casebattle__avatar img {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	object-fit: cover;
	width: 100%;
	height: 100%;
	position: absolute
}

.casebattle__avatar.win {
	border-color: #fcdc2a
}

.casebattle__panels-bottom {
	align-items: center;
	gap: calc(var(--spacing)*3);
	display: flex
}

.casebattle__panels-bottom .btn {
	border-radius: 3.40282e38px;
	flex: 1;
	height: 3rem !important;
	 !importan;
	 !importa;
	 !import;
	 !impor;
	 !impo;
	 !imp;
	 !im;
	 !i;
	 !;
	overflow: hidden
}

.casebattle__view {
	font-size: var(--text-2xl);
	line-height: var(--tw-leading, var(--text-2xl--line-height));
	color: var(--gray);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration))
}

@media (hover:hover) {
	.casebattle__view:hover {
		color: var(--gray-light)
	}
}

.casebattle__cases-item-more {
	padding-inline: calc(var(--spacing)*4);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray-light);
	flex-shrink: 0
}

.casebattle .btn--gray:before {
	background: linear-gradient(90deg, #232f4d, #3b4665)
}

.casebattle .btn--gray:after {
	background: linear-gradient(90deg, #2b395c, #4a5678)
}

.casebattle__create {
	margin-inline: calc(var(--spacing)*-6);
	gap: calc(var(--spacing)*4);
	flex-direction: column;
	width: calc(100% + 3rem);
	display: flex
}

.casebattle__create-cases {
	height: 16rem;
	position: relative
}

.casebattle__create-cases-wrapp {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	align-items: center;
	gap: calc(var(--spacing)*3);
	width: 100%;
	height: 100%;
	padding-inline: calc(var(--spacing)*6);
	display: flex;
	position: absolute;
	overflow: auto
}

.casebattle__create-cases-wrapp::-webkit-scrollbar {
	height: calc(var(--spacing)*0);
	width: calc(var(--spacing)*0)
}

.casebattle__create-case-item {
	border-radius: var(--radius-3xl);
	background-color: #1E2229;
	flex-direction: column;
	flex-shrink: 0;
	justify-content: center;
	align-items: center;
	width: 12rem;
	height: 100%;
	display: flex
}

.casebattle__create-case-item .empty .icon {
	font-size: var(--text-8xl);
	line-height: var(--tw-leading, var(--text-8xl--line-height))
}

.casebattle__create-case-item .empty span {
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium)
}

.casebattle__create-settings {
	justify-content: space-between;
	gap: calc(var(--spacing)*4);
	padding-inline: calc(var(--spacing)*6);
	flex-flow: column wrap;
	display: flex
}

@media (min-width:761px) {
	.casebattle__create-settings {
		flex-direction: row;
		align-items: center
	}
}

.casebattle__create-players {
	align-items: flex-start;
	gap: calc(var(--spacing)*2);
	flex-direction: column;
	flex-shrink: 0;
	width: 100%;
	display: flex
}

@media (min-width:931px) {
	.casebattle__create-players {
		width: fit-content
	}
}

.casebattle__create-players-buttons {
	align-items: center;
	gap: calc(var(--spacing)*2);
	display: flex
}

.casebattle__create-players-buttons button {
	height: calc(var(--spacing)*15);
	border-radius: var(--radius-2xl);
	--tw-font-weight: var(--font-weight-bold);
	width: 3rem;
	font-weight: var(--font-weight-bold);
	color: var(--gray-light);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #1E2229;
	justify-content: center;
	align-items: center;
	display: flex
}

@media (hover:hover) {
	.casebattle__create-players-buttons button:hover {
		color: var(--color-white);
		background-color: #2A2E38
	}
}

.casebattle__create-players-buttons button.active {
	color: var(--color-white);
	background: var(--primary-gradient);
	box-shadow: var(--shadow-primary)
}

.casebattle__create-modifications {
	gap: calc(var(--spacing)*2);
	flex-direction: column;
	flex: 1;
	display: flex
}

.casebattle__create-modifications-list {
	gap: calc(var(--spacing)*2);
	grid-template-columns: repeat(1, minmax(0, 1fr));
	display: grid
}

@media (min-width:531px) {
	.casebattle__create-modifications-list {
		grid-template-columns: repeat(2, minmax(0, 1fr))
	}
}

.casebattle__create-modify {
	height: calc(var(--spacing)*15);
	align-items: center;
	gap: calc(var(--spacing)*2);
	border-radius: var(--radius-2xl);
	padding-inline: calc(var(--spacing)*4);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #1E2229;
	display: flex
}

@media (hover:hover) {
	.casebattle__create-modify:hover {
		background-color: #2A2E38
	}
}

.casebattle__create-modify .icon {
	font-size: var(--text-xl);
	line-height: var(--tw-leading, var(--text-xl--line-height))
}

.casebattle__create-modify .icon.help {
	color: var(--gray);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration))
}

@media (hover:hover) {
	.casebattle__create-modify .icon.help:hover {
		color: var(--gray-light)
	}
}

.casebattle__create-modify .checkbox {
	margin-left: auto
}

.casebattle__create-modify .checkbox .checkbox__button-el {
	background-color: #16191E
}

.casebattle__create-modify .checkbox:hover .checkbox__button-el {
	background-color: #0e1528
}

.casebattle__create-btn {
	width: 100%;
	height: 5.5rem
}

@media (min-width:761px) {
	.casebattle__create-btn {
		width: fit-content
	}
}

.casebattle__create-btn .btn {
	width: 100% !important;
	height: 100% !important
}

@media (min-width:761px) {
	.casebattle__create-btn .btn {
		width: fit-content
	}
}

.casebattle__create-btn .btn .btn__inner {
	justify-content: space-between
}

@media (min-width:761px) {
	.casebattle__create-btn .btn .btn__inner {
		justify-content: flex-start
	}
}

.casebattle__create-case-inner {
	width: 100%;
	height: 100%;
	padding: calc(var(--spacing)*5);
	flex-direction: column;
	display: flex
}

.casebattle__create-case-img {
	flex: 1;
	justify-content: center;
	align-items: center;
	display: flex
}

.casebattle__create-case-img img {
	max-width: 100%
}

.casebattle__create-case-name {
	text-align: center;
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-leading: 100%;
	color: var(--gray-light);
	line-height: 100%
}

.casebattle__cases-list {
	gap: calc(var(--spacing)*2);
	flex-direction: column;
	display: flex
}

.casebattle__cases-list .cases__case.selected .cases__sum {
	--tw-translate-y: calc(var(--spacing)*4);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	opacity: 0
}

.casebattle__cases-list .cases__case.selected .cases__view {
	bottom: calc(var(--spacing)*5);
	--tw-translate-y: calc(var(--spacing)*0);
	translate: var(--tw-translate-x)var(--tw-translate-y);
	opacity: 1
}

.casebattle__cases-list .cases__top {
	top: calc(var(--spacing)*0);
	padding: calc(var(--spacing)*0);
	background-color: #0000;
	position: relative
}

.casebattle__top-info {
	justify-content: space-between;
	align-items: center;
	gap: calc(var(--spacing)*4);
	-webkit-user-select: none;
	user-select: none;
	display: flex
}

.casebattle__top-info-left {
	align-items: center;
	gap: calc(var(--spacing)*3);
	--tw-font-weight: var(--font-weight-semibold);
	font-weight: var(--font-weight-semibold);
	color: var(--gray-light);
	display: flex
}

.casebattle__top-info-left .casebattle__progress {
	color: var(--color-white)
}

.casebattle__top-info-cases {
	flex: 1;
	height: 55px;
	display: flex;
	position: relative;
	overflow: hidden
}

.casebattle__top-info-cases-wrapp {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	flex-direction: column;
	width: 100%;
	height: 100%;
	display: flex;
	position: absolute
}

.casebattle__top-info-case {
	--tw-scale-x: 95%;
	--tw-scale-y: 95%;
	--tw-scale-z: 95%;
	height: 55px;
	scale: var(--tw-scale-x)var(--tw-scale-y);
	justify-content: center;
	align-items: center;
	gap: calc(var(--spacing)*2);
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold);
	opacity: .3;
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	--tw-duration: .3s;
	flex-shrink: 0;
	transition-duration: .3s;
	display: flex
}

.casebattle__top-info-case.active {
	--tw-scale-x: 100%;
	--tw-scale-y: 100%;
	--tw-scale-z: 100%;
	scale: var(--tw-scale-x)var(--tw-scale-y);
	opacity: 1
}

.casebattle__top-info-case img {
	max-height: 100%
}

@media not all and (min-width:470px) {
	.casebattle__top-info-case span {
		display: none
	}
}

.casebattle__top-info-case-slider {
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	--tw-duration: .3s;
	flex-direction: column;
	transition-duration: .3s;
	display: flex
}

.casebattle__users {
	justify-content: space-between;
	align-items: stretch;
	gap: calc(var(--spacing)*3);
	flex: 1
}

@media not all and (min-width:1000px) {
	.casebattle__users {
		display: grid
	}
}

@media (min-width:1001px) {
	.casebattle__users {
		display: flex
	}
}

.casebattle__user {
	flex-direction: column;
	width: 100%;
	display: flex
}

@media (min-width:481px) {
	.casebattle__user {
		flex: 1
	}
}

.casebattle__user-wrapp {
	border-radius: var(--radius-3xl);
	background-color: #1E2229;
	flex-direction: column;
	display: flex;
	position: relative;
	min-height: 260px
}

.casebattle__user-top {
	align-items: center;
	gap: calc(var(--spacing)*2);
	height: 3rem;
	padding-inline: calc(var(--spacing)*4);
	padding-top: calc(var(--spacing)*4);
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	--tw-font-weight: var(--font-weight-semibold);
	font-weight: var(--font-weight-semibold);
	display: flex
}

.casebattle__user-top span {
	text-overflow: ellipsis;
	white-space: nowrap;
	color: var(--gray-light);
	flex: 1;
	display: none;
	overflow: hidden
}

@media (min-width:481px) {
	.casebattle__user-top span {
		display: block
	}
}

.casebattle__user-top img {
	width: calc(var(--spacing)*8);
	height: calc(var(--spacing)*8);
	object-fit: cover;
	border-radius: 3.40282e38px
}

.casebattle__user-top .sum {
	margin-left: auto
}

.casebattle__slider {
	-webkit-user-select: none;
	user-select: none;
	height: 220px;
	margin-top: -3rem;
	position: relative;
	overflow: hidden
}

@media (min-width:481px) {
	.casebattle__slider {
		height: 260px
	}
}

.casebattle__slider-wrapp {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	width: 100%;
	height: 100%;
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	flex-direction: column;
	display: flex;
	position: absolute;
	-webkit-mask-image: linear-gradient(#0000000a 17%, #fff 40%);
	mask-image: linear-gradient(#0000000a 17%, #fff 40%)
}

.casebattle__slider-el {
	flex-direction: column;
	display: flex
}

.casebattle__slider-el-item {
	height: 220px
}

@media (min-width:481px) {
	.casebattle__slider-el-item {
		height: 260px
	}
}

.casebattle__slider-el-item .item__center {
	height: 7rem;
	position: relative;
	top: 1rem
}

@media (min-width:481px) {
	.casebattle__slider-el-item .item__center {
		height: 9rem
	}
}

.casebattle__slider-el-item .item__center .item__image {
	object-fit: contain;
	max-height: 100%
}

.casebattle__slider-el-item .item__rarity-img {
	object-fit: contain
}

.casebattle__slider-el-item .item__bottom {
	bottom: calc(var(--spacing)*4);
	left: calc(var(--spacing)*4);
	opacity: 0;
	transition-property: opacity;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	position: absolute
}

.casebattle__slider-el-item .item__bottom .item__name {
	width: 66.6667%;
	max-width: 100%
}

.item__bottom.inventory {
    display: flex;
    justify-content: space-between;
    align-items: center;
	flex-direction: row;
    gap: 7px;
}

.item__bottom.inventory > * {
    width: auto !important;
}

.item__bottom.inventory > .item_change {
    width: auto !important;
    overflow: visible !important;
}

.item__info {
    flex: 1;
    min-width: 0;
}

.item__info > div {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.item_change {
    flex-shrink: 0;
	z-index: 5;
}

.changeItemMarket {
    cursor: pointer;
}

.changeItemMarket svg {
	fill: #FFF;
}

@media (min-width:481px) {
	.casebattle__slider-el-item .item__bottom .item__name {
		width: 100%
	}
}

.casebattle__slider-el-item .item__top {
	top: calc(var(--spacing)*16);
	right: calc(var(--spacing)*4);
	opacity: 0;
	transition-property: opacity;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	position: absolute
}

@media (min-width:481px) {
	.casebattle__slider-el-item .item__top {
		top: calc(var(--spacing)*14)
	}
}

.casebattle__slider-el-item.active .item__bottom,
.casebattle__slider-el-item.active .item__top {
	opacity: 1
}

.casebattle__user-items {
	margin-top: calc(var(--spacing)*2);
	border-radius: var(--radius-3xl);
	border-style: var(--tw-border-style);
	height: 12rem;
	padding: calc(var(--spacing)*4);
	border-width: 2px;
	border-color: #17213a;
	overflow: auto
}

@media (min-width:481px) {
	.casebattle__user-items {
		height: 21.875rem
	}
}

.casebattle__user-items::-webkit-scrollbar {
	height: calc(var(--spacing)*0);
	width: calc(var(--spacing)*0)
}

.casebattle__user-items .empty {
	height: 100%;
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height))
}

.casebattle__user-items .items .item__center {
	height: 4rem
}

.casebattle__user-items .items .item__model,
.casebattle__user-items .items .item__quality {
	font-size: .6rem
}

.casebattle__user-items .items .item__name {
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height))
}

.casebattle__user-overlay {
	visibility: hidden;
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	z-index: 2;
	justify-content: center;
	align-items: center;
	gap: calc(var(--spacing)*2);
	border-radius: var(--radius-3xl);
	--tw-gradient-position: to bottom in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-from: #232f50;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-to: #2d3c64;
	opacity: 0;
	width: 100%;
	height: 100%;
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	flex-direction: column;
	display: flex;
	position: absolute
}

.casebattle__user-overlay>span {
	font-size: var(--text-base);
	line-height: var(--tw-leading, var(--text-base--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold)
}

.casebattle .casebattle__top-info[data-users="4"]~.casebattle__users .items {
	grid-template-columns: repeat(1, minmax(0, 1fr))
}

@media (min-width:481px) {
	.casebattle .casebattle__top-info[data-users="4"]~.casebattle__users .items {
		grid-template-columns: repeat(2, minmax(0, 1fr))
	}
}

.casebattle .casebattle__top-info[data-users="3"]~.casebattle__users .items {
	grid-template-columns: repeat(1, minmax(0, 1fr))
}

@media (min-width:481px) {
	.casebattle .casebattle__top-info[data-users="3"]~.casebattle__users .items {
		grid-template-columns: repeat(2, minmax(0, 1fr))
	}
}

@media (min-width:691px) {
	.casebattle .casebattle__top-info[data-users="3"]~.casebattle__users .items {
		grid-template-columns: repeat(3, minmax(0, 1fr))
	}
}

.casebattle .casebattle__top-info[data-users="2"]~.casebattle__users .items {
	grid-template-columns: repeat(1, minmax(0, 1fr))
}

@media (min-width:481px) {
	.casebattle .casebattle__top-info[data-users="2"]~.casebattle__users .items {
		grid-template-columns: repeat(2, minmax(0, 1fr))
	}
}

@media (min-width:821px) {
	.casebattle .casebattle__top-info[data-users="2"]~.casebattle__users .items {
		grid-template-columns: repeat(3, minmax(0, 1fr))
	}
}

@media (min-width:931px) {
	.casebattle .casebattle__top-info[data-users="2"]~.casebattle__users .items {
		grid-template-columns: repeat(4, minmax(0, 1fr))
	}
}

.casebattle .casebattle__top-info[data-users="4"]~.casebattle__users {
	grid-template-columns: repeat(2, minmax(0, 1fr))
}

@media not all and (min-width:1000px) {
	.casebattle .casebattle__top-info[data-users="4"]~.casebattle__users {
		display: grid
	}
}

.casebattle .casebattle__top-info[data-users="2"]~.casebattle__users {
	grid-template-columns: repeat(2, minmax(0, 1fr))
}

@media not all and (min-width:1000px) {

	.casebattle .casebattle__top-info[data-users="2"]~.casebattle__users,
	.casebattle .casebattle__top-info[data-users="3"]~.casebattle__users {
		display: grid
	}
}

@media (min-width:691px) {
	.casebattle .casebattle__top-info[data-users="3"]~.casebattle__users {
		grid-template-columns: repeat(2, minmax(0, 1fr))
	}
}

.casebattle .casebattle__top-info[data-users="3"]~.casebattle__users .casebattle__user:last-child {
	grid-column: span 2/span 2
}

.casebattle__user.win .casebattle__slider-wrapp {
	visibility: hidden;
	opacity: 0
}

.casebattle__user.win .casebattle__overlay-win,
.casebattle__user.wait .casebattle__user-overlay {
	visibility: visible;
	opacity: 1
}

.casebattle__overlay-win {
	pointer-events: none;
	visibility: hidden;
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	z-index: 2;
	border-radius: var(--radius-3xl);
	--tw-gradient-position: to bottom in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-from: transparent;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-from-position: 20%;
	--tw-gradient-to: #835f32;
	width: 100%;
	height: 100%;
	font-size: var(--text-xl);
	line-height: var(--tw-leading, var(--text-xl--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold);
	opacity: 0;
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	flex-direction: column;
	justify-content: center;
	align-items: center;
	display: flex;
	position: absolute
}

.casebattle__overlay-win img {
	--tw-translate-x: calc(calc(1/2*100%)*-1);
	max-width: 10rem;
	translate: var(--tw-translate-x)var(--tw-translate-y);
	position: absolute;
	bottom: -15%;
	left: 50%
}

.casebattle__users.end .casebattle__user:not(.win) {
	opacity: .5
}

.loading {
	width: calc(var(--spacing)*7);
	height: calc(var(--spacing)*7)
}

.loading svg {
	animation: var(--animate-spin);
	color: var(--primary)
}

@media (min-width:571px) {
	.vip-club .profile__level.fill {
		grid-column: span 2/span 2
	}
}

.vip-club .profile__level.fill .profile__level-image {
	right: -5%
}

@media not all and (min-width:570px) {
	.vip-club .profile__left-grid {
		grid-template-columns: repeat(1, minmax(0, 1fr))
	}
}

.vip-club .profile__left-grid .bonus__task-left {
	gap: calc(var(--spacing)*1)
}

.vip-club .profile__right {
	border-radius: var(--radius-3xl);
	width: 100%;
	padding-inline: calc(var(--spacing)*6);
	padding-top: calc(var(--spacing)*6);
	text-align: center;
	background-color: #1E2229;
	flex-direction: column;
	align-items: center;
	display: flex;
	position: relative
}

@media (min-width:571px) {
	.vip-club .profile__right {
		padding: calc(var(--spacing)*6);
		text-align: left;
		align-items: flex-start
	}
}

.vip-club__desc {
	width: 100%;
	color: var(--gray-light);
	font-size: .8125rem
}

@media (min-width:571px) {
	.vip-club__desc {
		width: 65%
	}
}

.vip-club__image {
	bottom: calc(var(--spacing)*0);
	max-width: 12rem
}

@media (min-width:571px) {
	.vip-club__image {
		right: calc(var(--spacing)*0);
		position: absolute
	}
}

.vip-club__tabs {
	flex-direction: column;
	display: flex;
	position: relative
}

.vip-club__tabs.first .vip-club__tabs-body {
	border-radius: 1.5rem
}

.vip-club__tabs.last .vip-club__tabs-body {
	border-radius: 1.5rem 0 1.5rem 1.5rem
}

.vip-club__tabs.last button:before {
	opacity: 0 !important
}

.vip-club__tabs-list {
	align-items: stretch;
	display: flex
}

.vip-club__tabs-list button {
	z-index: 2;
	align-items: center;
	gap: calc(var(--spacing)*1);
	padding-block: calc(var(--spacing)*3);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-semibold);
	font-weight: var(--font-weight-semibold);
	color: var(--gray);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	border-radius: 1.5rem 1.5rem 0 0;
	flex-direction: column;
	flex: 1;
	display: flex;
	position: relative
}

@media (hover:hover) {
	.vip-club__tabs-list button:hover {
		color: var(--gray-light)
	}
}

.vip-club__tabs-list button img {
	width: calc(var(--spacing)*10);
	height: calc(var(--spacing)*10);
	object-fit: contain
}

@media not all and (min-width:575px) {
	.vip-club__tabs-list button span {
		display: none
	}
}

.vip-club__tabs-list button.active {
	color: var(--color-white);
	background-color: #1E2229
}

.vip-club__tabs-list button.active:before,
.vip-club__tabs-list button:not(:first-child).active:after {
	opacity: 1
}

@media (min-width:576px) {
	.vip-club__tabs-list button:before {
		--tw-content: "";
		content: var(--tw-content);
		opacity: 0;
		background: #16191E;
		border-radius: 0 0 0 1.5rem;
		width: 32px;
		height: 32px;
		transition: all .2s;
		position: absolute;
		bottom: 0;
		right: -32px;
		box-shadow: -4px 7px 0 2px #1E2229
	}

	.vip-club__tabs-list button:after {
		--tw-content: "";
		content: var(--tw-content);
		opacity: 0;
		background: #16191E;
		border-radius: 0 0 1.5rem;
		width: 32px;
		height: 32px;
		transition: all .2s;
		position: absolute;
		bottom: 0;
		left: -32px;
		box-shadow: 4px 7px 0 2px #1E2229
	}
}

.vip-club__tabs-body {
	padding: calc(var(--spacing)*5);
	transition-property: all;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #1E2229;
	border-radius: 0 1.5rem 1.5rem;
	flex-direction: column;
	display: flex
}

.vip-club__tabs-stages {
	gap: calc(var(--spacing)*3);
	grid-template-columns: repeat(1, minmax(0, 1fr));
	display: grid
}

@media (min-width:671px) {
	.vip-club__tabs-stages {
		grid-template-columns: repeat(2, minmax(0, 1fr))
	}
}

.vip-club__tabs-stages .bonus__task {
	background-color: #2A2E38;
	width: 100%
}

.vip-club__tabs-stages .bonus__task-button {
	background-color: #303541
}

@media (hover:hover) {
	.vip-club__tabs-stages .bonus__task-button:hover {
		background-color: #1E2229
	}
}

.vip-club__open {
	color: #5de75d
}

.vip-club__tabs-body-inner {
	gap: calc(var(--spacing)*3);
	flex-direction: column;
	display: flex
}

.vip-club__tabs-body-inner h2 {
	font-size: var(--text-2xl);
	line-height: var(--tw-leading, var(--text-2xl--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold)
}

@media (min-width:576px) {
	.vip-club__tabs-body-inner h2 {
		display: none
	}
}

.vip-club__list {
	gap: calc(var(--spacing)*2);
	flex-direction: column;
	display: flex
}

.vip-club__list>span {
	font-size: var(--text-2xl);
	line-height: var(--tw-leading, var(--text-2xl--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold)
}

.vip-club__list-grid {
	gap: calc(var(--spacing)*3);
	grid-template-columns: repeat(1, minmax(0, 1fr));
	display: grid
}

@media (min-width:671px) {
	.vip-club__list-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr))
	}
}

.vip-club__list-grid-item {
	align-items: flex-start;
	gap: calc(var(--spacing)*2);
	border-radius: var(--radius-2xl);
	padding-inline: calc(var(--spacing)*4);
	padding-block: calc(var(--spacing)*4);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-semibold);
	font-weight: var(--font-weight-semibold);
	color: var(--gray-light);
	opacity: .4;
	background-color: #2A2E38;
	display: flex
}

.vip-club__list-grid-item.active {
	color: var(--color-white);
	opacity: 1
}

.vip-club__list-grid-item.active .vip-club__open {
	display: block
}

.vip-club__list-grid-item.active .vip-club__closed,
.vip-club__list-grid-item .vip-club__open {
	display: none
}

.vip-club__list-grid-item .vip-club__closed {
	color: #9fadd3
}

.vip-club__list-grid-item .vip-club__closed,
.vip-club__list-grid-item .vip-club__open {
	top: calc(var(--spacing)*.5);
	position: relative
}

.giveaway__wrapp {
	gap: calc(var(--spacing)*3);
	grid-template-columns: repeat(1, minmax(0, 1fr));
	display: grid
}

@media (min-width:591px) {
	.giveaway__wrapp {
		grid-template-columns: repeat(2, minmax(0, 1fr))
	}
}

@media (min-width:851px) {
	.giveaway__wrapp {
		grid-template-columns: repeat(3, minmax(0, 1fr))
	}
}

@media (min-width:1100px) {
	.giveaway__wrapp {
		grid-template-columns: repeat(4, minmax(0, 1fr))
	}
}

.giveaway__wrapp-item {
	gap: calc(var(--spacing)*5);
	flex-direction: column;
	display: flex
}

.giveaway__wrapp-item .item__rarity-img {
	object-fit: contain
}

.giveaway__wrapp-item .item__center {
	height: 10rem
}


.giveaway__wrapp-item-top {
	z-index: 1;
	border-radius: var(--radius-3xl);
	background-color: #1f2b4a;
	flex-direction: column;
	width: 100%;
	display: flex;
	position: relative
}

.giveaway__sum-from {
	justify-content: center;
	align-items: center;
	gap: calc(var(--spacing)*2);
	gap: calc(var(--spacing)*3);
	width: 100%;
	padding: calc(var(--spacing)*4);
	text-align: center;
	font-size: var(--text-2xl);
	line-height: var(--tw-leading, var(--text-2xl--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold);
	display: flex
}

.giveaway__wrapp-item-skin {
	border-radius: var(--radius-3xl);
	--tw-gradient-position: to bottom in oklab;
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-from: #2A2E38;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-to: #1E2229;
	width: 100%;
	padding: calc(var(--spacing)*5);
	padding-top: 67px;
	flex-direction: column;
	display: flex
}

.giveaway__wrapp-item-top-left {
	position: absolute;
	top: 0;
	left: 0;
	padding: calc(var(--spacing)*5);
	width: 100%;
	justify-content: space-between;
	align-items: flex-start;
	gap: calc(var(--spacing)*4);
	display: flex;
}

.giveaway__wrapp-item-skin-left {
	gap: calc(var(--spacing)*1.5);
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	flex-direction: column;
	display: flex
}

:is(.giveaway__wrapp-item-skin-left>*) {
	--tw-leading: 110%;
	line-height: 110%
}

.giveaway__wrapp-item-skin-left p {
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray-light)
}

.giveaway__wrapp-item-skin-left span {
	--tw-font-weight: var(--font-weight-semibold);
	font-weight: var(--font-weight-semibold)
}

.giveaway__wrapp-users {
	align-items: center;
	gap: calc(var(--spacing)*2);
	display: flex
}

.giveaway__wrapp-users-info {
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height))
}

:is(.giveaway__wrapp-users-info>*) {
	--tw-leading: 100%;
	line-height: 100%
}

.giveaway__wrapp-users-info p {
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray-light)
}

.giveaway .banners__event-timer {
	margin-bottom: calc(var(--spacing)*2);
	justify-content: center;
	display: flex
}

.giveaway .banners__event-timer .banners__event-timer-item {
	--tw-gradient-from: #303541;
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position));
	--tw-gradient-to: #2A2E38;
	flex: 1;
	width: 100%
}

.giveaway .banners__event-timer .banners__event-timer-item span {
	color: var(--color-white)
}

.giveaway .btn-border {
	color: #ffffff80;
	border-color: #ffffff26
}

@supports (color:color-mix(in lab, red, red)) {
	.giveaway .btn-border {
		border-color: color-mix(in oklab, var(--color-white)15%, transparent);
		color: color-mix(in oklab, var(--color-white)50%, transparent)
	}
}

@media (hover:hover) {
	.giveaway .btn-border:hover {
		border-color: #ffffff4d
	}

	@supports (color:color-mix(in lab, red, red)) {
		.giveaway .btn-border:hover {
			border-color: color-mix(in oklab, var(--color-white)30%, transparent)
		}
	}

	.giveaway .btn-border:hover {
		color: #ffffffb3
	}

	@supports (color:color-mix(in lab, red, red)) {
		.giveaway .btn-border:hover {
			color: color-mix(in oklab, var(--color-white)70%, transparent)
		}
	}
}

.giveaway__usl {
	margin-top: calc(var(--spacing)*3);
	justify-content: center;
	align-items: center;
	gap: calc(var(--spacing)*1.5);
	text-align: center;
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray-light);
	display: flex
}

.giveaway__wrapp-users-list {
	margin-top: calc(var(--spacing)*-6);
	height: 20rem;
	position: relative;
	-webkit-mask-image: linear-gradient(red 80%, #0000);
	mask-image: linear-gradient(red 80%, #0000)
}

.giveaway__wrapp-users-list-wrapp {
	top: calc(var(--spacing)*0);
	left: calc(var(--spacing)*0);
	gap: calc(var(--spacing)*2);
	gap: calc(var(--spacing)*3);
	width: 100%;
	height: 100%;
	padding-top: calc(var(--spacing)*5);
	flex-direction: column;
	display: flex;
	position: absolute;
	overflow: auto;
	-webkit-mask-image: linear-gradient(#0000, red 20%);
	mask-image: linear-gradient(#0000, red 20%)
}

.giveaway__wrapp-users-list-wrapp::-webkit-scrollbar {
	height: calc(var(--spacing)*0);
	width: calc(var(--spacing)*0)
}

.giveaway__wrapp-users-list-user {
	gap: calc(var(--spacing)*2);
	grid-template-columns: repeat(2, minmax(0, 1fr));
	display: grid
}

.giveaway__wrapp-users-list-user .crash__user {
	border-radius: var(--radius-2xl);
	padding-inline: calc(var(--spacing)*2);
	padding-block: calc(var(--spacing)*2);
	background-color: #16203a
}

.giveaway__wrapp-users-list-user .crash__user span {
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	display: block
}

.giveaway__wrapp-users-list-user .crash__user img {
	width: calc(var(--spacing)*6);
	height: calc(var(--spacing)*6)
}

.giveaway .empty {
	height: 100%;
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height))
}

.giveaway .empty .icon {
	font-size: var(--text-2xl);
	line-height: var(--tw-leading, var(--text-2xl--line-height))
}

.giveaway__wrapp-last-winners {
	gap: calc(var(--spacing)*3);
	flex-direction: column;
	display: flex
}

.giveaway__wrapp-last-winners>span {
	font-size: var(--text-xl);
	line-height: var(--tw-leading, var(--text-xl--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold)
}

.giveaway__wrapp-winner-item {
	border-radius: var(--radius-2xl);
	padding: calc(var(--spacing)*3);
	background-color: #1E2229;
	justify-content: space-between;
	align-items: center;
	display: flex
}

.giveaway__wrapp-winner-item-user {
	align-items: center;
	gap: calc(var(--spacing)*3);
	flex: 1;
	width: 100%;
	display: flex
}

.giveaway__wrapp-winner-item-user img {
	width: calc(var(--spacing)*10);
	height: calc(var(--spacing)*10);
	object-fit: cover;
	transition-property: opacity;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	border-radius: 3.40282e38px;
	flex-shrink: 0
}

.giveaway__wrapp-winner-item-user:hover img {
	opacity: .6
}

.giveaway__wrapp-winner-user {
	gap: calc(var(--spacing)*1.5);
	width: 100%;
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	flex-direction: column;
	display: flex
}

:is(.giveaway__wrapp-winner-user>*) {
	--tw-leading: 100%;
	line-height: 100%
}

.giveaway__wrapp-winner-user>span {
	--tw-font-weight: var(--font-weight-semibold);
	max-width: 4rem;
	font-weight: var(--font-weight-semibold);
	text-overflow: ellipsis;
	white-space: nowrap;
	color: var(--gray-light);
	overflow: hidden
}

.giveaway__wrapp-winner-user .sum .icon {
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height))
}

.giveaway__wrapp-winner-item-image {
	flex-shrink: 0;
	width: 100%;
	max-width: 4rem
}

.giveaway__wrapp-winner-item-date {
	width: 100%;
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	flex: 1
}

.giveaway__wrapp-winner-item-date>p {
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	--tw-font-weight: var(--font-weight-semibold);
	font-weight: var(--font-weight-semibold);
	color: var(--gray-light)
}

.giveaway__wrapp-winner-item-date span {
	text-overflow: ellipsis;
	white-space: nowrap;
	width: 100%;
	max-width: 7rem;
	display: block;
	overflow: hidden
}

@keyframes progressUpgrade {
	0% {
		transform: rotate(0)
	}

	to {
		transform: rotate(1turn)
	}
}

.tippy-content {
	flex-direction: column;
	font-weight: 500;
	display: flex
}

.tippy-content * {
	line-height: 120%
}

.tippy-content p,
.tippy-content span {
	font-size: .75rem
}

.tippy-content p {
	color: #ffaf40
}

.tippy-content span {
	color: var(--gray-light)
}

.gpu-boost {
	will-change: transform;
	transform: translate(0)
}

.who-event {
	width: 30rem
}

.typical {
	gap: calc(var(--spacing)*4);
	flex-direction: column;
	display: flex
}

.typical p {
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	color: var(--gray-light)
}

.typical h3 {
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium)
}

.badge {
	align-items: center;
	gap: calc(var(--spacing)*1.5);
	padding-inline: calc(var(--spacing)*3);
	padding-block: calc(var(--spacing)*2);
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray-light);
	-webkit-user-select: none;
	user-select: none;
	background-color: #2c3c62;
	border-radius: 3.40282e38px;
	display: flex
}

.badge.warning {
	color: #ffa220;
	background-color: oklab(78.8149% .0637719 .153645/.15)
}

@property --tw-rotate-x {
	syntax: "*";
	inherits: false
}

@property --tw-rotate-y {
	syntax: "*";
	inherits: false
}

@property --tw-rotate-z {
	syntax: "*";
	inherits: false
}

@property --tw-skew-x {
	syntax: "*";
	inherits: false
}

@property --tw-skew-y {
	syntax: "*";
	inherits: false
}

@property --tw-border-style {
	syntax: "*";
	inherits: false;
	initial-value: solid
}

@property --tw-blur {
	syntax: "*";
	inherits: false
}

@property --tw-brightness {
	syntax: "*";
	inherits: false
}

@property --tw-contrast {
	syntax: "*";
	inherits: false
}

@property --tw-grayscale {
	syntax: "*";
	inherits: false
}

@property --tw-hue-rotate {
	syntax: "*";
	inherits: false
}

@property --tw-invert {
	syntax: "*";
	inherits: false
}

@property --tw-opacity {
	syntax: "*";
	inherits: false
}

@property --tw-saturate {
	syntax: "*";
	inherits: false
}

@property --tw-sepia {
	syntax: "*";
	inherits: false
}

@property --tw-drop-shadow {
	syntax: "*";
	inherits: false
}

@property --tw-drop-shadow-color {
	syntax: "*";
	inherits: false
}

@property --tw-drop-shadow-alpha {
	syntax: "<percentage>";
	inherits: false;
	initial-value: 100%
}

@property --tw-drop-shadow-size {
	syntax: "*";
	inherits: false
}

@property --tw-shadow {
	syntax: "*";
	inherits: false;
	initial-value: 0 0 #0000
}

@property --tw-shadow-color {
	syntax: "*";
	inherits: false
}

@property --tw-shadow-alpha {
	syntax: "<percentage>";
	inherits: false;
	initial-value: 100%
}

@property --tw-inset-shadow {
	syntax: "*";
	inherits: false;
	initial-value: 0 0 #0000
}

@property --tw-inset-shadow-color {
	syntax: "*";
	inherits: false
}

@property --tw-inset-shadow-alpha {
	syntax: "<percentage>";
	inherits: false;
	initial-value: 100%
}

@property --tw-ring-color {
	syntax: "*";
	inherits: false
}

@property --tw-ring-shadow {
	syntax: "*";
	inherits: false;
	initial-value: 0 0 #0000
}

@property --tw-inset-ring-color {
	syntax: "*";
	inherits: false
}

@property --tw-inset-ring-shadow {
	syntax: "*";
	inherits: false;
	initial-value: 0 0 #0000
}

@property --tw-ring-inset {
	syntax: "*";
	inherits: false
}

@property --tw-ring-offset-width {
	syntax: "<length>";
	inherits: false;
	initial-value: 0
}

@property --tw-ring-offset-color {
	syntax: "*";
	inherits: false;
	initial-value: #fff
}

@property --tw-ring-offset-shadow {
	syntax: "*";
	inherits: false;
	initial-value: 0 0 #0000
}

@property --tw-outline-style {
	syntax: "*";
	inherits: false;
	initial-value: solid
}

.footer__top-right .cases__select-game {
	height: auto
}

@property --tw-duration {
	syntax: "*";
	inherits: false
}

@property --tw-translate-x {
	syntax: "*";
	inherits: false;
	initial-value: 0
}

@property --tw-translate-y {
	syntax: "*";
	inherits: false;
	initial-value: 0
}

@property --tw-translate-z {
	syntax: "*";
	inherits: false;
	initial-value: 0
}

@property --tw-ease {
	syntax: "*";
	inherits: false
}

@property --tw-font-weight {
	syntax: "*";
	inherits: false
}

@property --tw-leading {
	syntax: "*";
	inherits: false
}

@property --tw-gradient-position {
	syntax: "*";
	inherits: false
}

@property --tw-gradient-from {
	syntax: "<color>";
	inherits: false;
	initial-value: #0000
}

@property --tw-gradient-via {
	syntax: "<color>";
	inherits: false;
	initial-value: #0000
}

@property --tw-gradient-to {
	syntax: "<color>";
	inherits: false;
	initial-value: #0000
}

@property --tw-gradient-stops {
	syntax: "*";
	inherits: false
}

@property --tw-gradient-via-stops {
	syntax: "*";
	inherits: false
}

@property --tw-gradient-from-position {
	syntax: "<length-percentage>";
	inherits: false;
	initial-value: 0%
}

@property --tw-gradient-via-position {
	syntax: "<length-percentage>";
	inherits: false;
	initial-value: 50%
}

@property --tw-gradient-to-position {
	syntax: "<length-percentage>";
	inherits: false;
	initial-value: 100%
}

@property --tw-content {
	syntax: "*";
	inherits: false;
	initial-value: ""
}

@property --tw-backdrop-blur {
	syntax: "*";
	inherits: false
}

@property --tw-backdrop-brightness {
	syntax: "*";
	inherits: false
}

@property --tw-backdrop-contrast {
	syntax: "*";
	inherits: false
}

@property --tw-backdrop-grayscale {
	syntax: "*";
	inherits: false
}

@property --tw-backdrop-hue-rotate {
	syntax: "*";
	inherits: false
}

@property --tw-backdrop-invert {
	syntax: "*";
	inherits: false
}

@property --tw-backdrop-opacity {
	syntax: "*";
	inherits: false
}

@property --tw-backdrop-saturate {
	syntax: "*";
	inherits: false
}

@property --tw-backdrop-sepia {
	syntax: "*";
	inherits: false
}

@property --tw-scale-x {
	syntax: "*";
	inherits: false;
	initial-value: 1
}

@property --tw-scale-y {
	syntax: "*";
	inherits: false;
	initial-value: 1
}

@property --tw-scale-z {
	syntax: "*";
	inherits: false;
	initial-value: 1
}

@property --tw-space-x-reverse {
	syntax: "*";
	inherits: false;
	initial-value: 0
}

@keyframes spin {
	to {
		transform: rotate(360deg)
	}
}

@keyframes pulse {
	50% {
		opacity: .5
	}
}

.bonus-roll__drops {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	width: 100%
}

.bonus-roll__drops-item {
	height: 2.25rem;
	display: flex;
	background: #16337D;
	border-radius: .75rem;
	align-items: center;
	padding: 0 .5rem;
	gap: .5rem;
	font-size: .875rem;
	font-weight: 500
}

.bonus-roll__drops-item .icon {
	color: #6D91E5
}

.bonus__more-item.bonus__more-item--full .bonus-roll__drops-item {
	background: #2A2E38;
	font-size: .75rem;
	color: #c7d5fd
}

.bonus-roll__list {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: .5rem
}

.bonus-roll__list .bonus-roll__drops {
	justify-content: center
}

.bonus-roll__list>span {
	font-size: .875rem;
	color: #92B6FF;
	font-weight: 400;
	font-weight: 500
}

.modal.bonus-roll {
	width: 27rem;
	background: linear-gradient(to bottom, #0050B8 20%, #0A215B 80%)
}

.modal.bonus-roll .auth__desc p {
	color: #92B6FF
}

.bonus-roll__wrapp {
	display: flex;
	flex-direction: column;
	margin: 0 -1.5rem;
	align-items: center
}

.bonus-roll__wrapp .btn {
	min-width: 16rem
}

.bonus-roll__wrapp-inner {
	position: relative;
	height: 16rem;
	overflow: hidden;
	width: 100%;
	mask-image: linear-gradient(to bottom, red 75%, transparent)
}

.bonus-roll__wrapp-ctx {
	position: absolute;
	left: 50%;
	top: 0;
	transform: translateX(-50%);
	width: 37.5rem;
	height: 37.5rem
}

.bonus-roll__wrapp-ctx img {
	width: 100%;
	height: 100%;
	object-fit: contain
}

.bonus-roll__cursor {
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	top: 45%;
	width: 8rem
}

.bonus-roll__dolphin {
	position: absolute;
	right: 0rem;
	top: 0rem;
	width: 11rem
}

.bonus-roll__wrapp-inner {
	z-index: 1
}

.bonus-roll__wrapp .btn {
	z-index: 1
}

.bonus-roll__timer {
	display: flex;
	flex-direction: column;
	gap: .5rem;
	font-size: .875rem;
	text-align: center;
	font-weight: 500;
	color: #92B6FF
}

.bonus-roll__timer .banners__event-timer-item {
	background: #091d4e
}

.bonus-roll__bottom {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	align-items: center;
	margin-top: -5rem;
	position: relative;
	z-index: 1
}

.bonus-roll__open {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 5;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: flex-end;
	opacity: 0;
	pointer-events: none;
	visibility: hidden;
	transition: 0.2s ease
}

.bonus-roll__open-wrapp {
	width: 100%;
	height: 60%;
	overflow: auto;
	background: #001840;
	z-index: 1;
	border-radius: 1rem 1rem 0 0;
	display: flex;
	flex-direction: column;
	transition: 0.2s ease;
	transform: translateY(100%)
}

.modal.bonus-roll {
	overflow: hidden
}

.bonus-roll__open-overlay {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: #012560cf
}

.bonus-roll__open-title {
	display: flex;
	align-items: stretch;
	gap: .75rem;
	padding: 1rem;
	position: sticky;
	background: #001840;
	left: 0;
	top: 0
}

.bonus-roll__open-title .auth__desc span {
	font-size: 1.2rem
}

.bonus-roll__open-title .auth__desc p {
	font-size: .875rem !important;
	color: #7e95bb !important
}

.bonus-roll__open-close {
	width: 2.25rem;
	display: flex;
	justify-content: center;
	align-items: center;
	height: auto;
	background: #082556;
	border-radius: .5rem;
	transition: 0.2s ease
}

.bonus-roll__open-close:hover {
	background: #0a2b64
}

.bonus-roll__open-wrapp-list {
	display: flex;
	flex-direction: column;
	gap: .5rem;
	padding: 0 1rem 1rem 1rem
}

.bonus-roll__open-wrapp-list-item {
	color: #b1ceff;
	font-size: .75rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: .5rem;
	background: #08224e;
	border-radius: .5rem;
	font-weight: 500
}

.bonus-roll__open-wrapp-list-item .icon {
	font-size: 1rem;
	color: #4f74b3
}

.modal.bonus-roll.open .bonus-roll__open {
	opacity: 1;
	visibility: visible;
	pointer-events: auto
}

.modal.bonus-roll.open .bonus-roll__open-wrapp {
	transform: translateY(0%)
}

button.bonus-roll__drops-item:hover {
	background: #1d3e91
}

button.bonus-roll__drops-item {
	transition: .2s ease
}

.games__item-top span {
	line-height: 90%
}

.games__item-top span br {
	line-height: 90%
}

.item__quality-top {
	border-style: var(--tw-border-style);
	padding-inline: calc(var(--spacing)* 1.5);
	padding-block: calc(var(--spacing)* .5);
	font-size: 10px;
	line-height: var(--tw-leading, var(--text-xs--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: #9ba3bf;
	border-width: 1px;
	border-color: #c4d1ff24;
	border-radius: 3.40282e38px
}

.item:before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(-45deg, #1E2229 60%, #384464);
	border-radius: var(--radius-2xl)
}

.item.covert:before {
	background: linear-gradient(-45deg, #1E2229 60%, #9f3b44)
}

.item.restricted:before {
	background: linear-gradient(-45deg, #1E2229 60%, #774bd1)
}

.item.milspec:before {
	background: linear-gradient(-45deg, #1E2229 60%, #2564dd)
}

.mines__inventory-scroll {
	display: flex;
	flex-direction: column;
	gap: 1rem
}

button.item {
	padding: 0
}

button.item:before {
	content: none !important
}

button.item .item__inner {
	background: none !important
}

.upgrade__item-skin .item__top {
	gap: .25rem
}

.checkbox__button-el {
	flex-shrink: 0
}

.checkbox__button-desc p a {
	color: var(--primary);
	text-decoration: underline;
	line-height: 140%;
	pointer-events: all
}

.checkbox__button-desc p a:hover {
	text-decoration: none
}

.auth .checkbox__button-el {
	background: #11182c
}

.auth__buttons.disabled {
	pointer-events: none;
	opacity: .5
}

.itemHorizontal__item:before {
	content: '';
	position: absolute;
	left: 50%;
	top: 0;
	transform: translateX(-50%);
	height: 2px;
	z-index: 1;
	width: 40%;
	opacity: 0.3;
}

.itemHorizontal__item.Industrial:before,
.itemHorizontal__item.industrial:before {
	background: #dcecff
}

.itemHorizontal__item.Mil-Spec:before,
.itemHorizontal__item.milspec:before {
	background: #7ab5ff
}

.itemHorizontal__item.Restricted:before,
.itemHorizontal__item.restricted:before {
	background: #a34aff
}

.itemHorizontal__item.Classified:before,
.itemHorizontal__item.classified:before {
	background: #f6f
}

.itemHorizontal__item.Covert:before,
.itemHorizontal__item.covert:before {
	background: #ff645d
}

.itemHorizontal__item.Rare:before,
.itemHorizontal__item.rare:before {
	background: #ffc072
}

.itemHorizontal__item.Immortal:before,
.itemHorizontal__item.immortal:before {
	background: #ff966c
}

.case__sale-all-wrapp {
	display: flex;
	justify-content: center;
	width: 100%;
	padding-bottom: 1rem
}

.upgrade .item__inner {
	padding: .5rem;
	border-radius: 1rem
}

.upgrade .item {
	border-radius: 1rem
}

.upgrade .sum.sum--xs.sum--bgWhite {
	white-space: nowrap;
	gap: .2rem;
	font-size: .7rem
}

.upgrade .item__quality-top {
	padding: .1rem .3rem;
	font-size: .7rem
}

.upgrade .sum.sum--xs.sum--bgWhite .icon {
	width: .65rem
}

.upgrade .item__model {
	font-size: .7rem
}

.upgrade .item__name {
	font-size: .75rem
}

.upgrade .item:hover .item__image {
	scale: 1.1
}

@media (max-width:550px) {
	.contract__skin {
		min-height: 4.5rem;
		border-radius: .5rem
	}

	.contract__skin-overlay img {
		max-height: 1.25rem
	}

	.contract__skins {
		gap: .4rem
	}
}

@media (max-width:650px) {
	.bonus .banners__list-item {
		height: auto
	}

	.bonus .banners__list-item .banners__list-item-image {
		height: 100%
	}
}

button.item.withdraw__item .item__top a {
	pointer-events: auto
}

.cases__case.freecase .cases__sum {
	background: #f6d78026 !important;
	color: #f6d780;
	border: solid 1px #f6d78042
}

.sound .icon.off {
	display: none
}

.sound.off .icon.off {
	display: block
}

.sound.off .icon:not(.off) {
	display: none
}

.sound {
	background: linear-gradient(to right bottom, #064724, #0f7f43);
	color: #4dffa6 !important
}

.sound.off {
	background: linear-gradient(to right bottom, #650e0e, #b32626);
	color: #ff5b5b !important
}

.historyWallet .tabs {
	width: fit-content
}

.itemHorizontal__user {
	overflow: hidden
}

.streamer_on .profile.user .profile__user,
.streamer_on .itemHorizontal__user img,
.streamer_on .itemHorizontal__user span,
.streamer_on .header__user-avatar,
.streamer_on .profile .profile__user,
.streamer_on .casebattle__avatar,
.streamer_on .casebattle__user-top img,
.streamer_on .casebattle__user-top span {
	filter: blur(6px);
	pointer-events: none
}

body.animate_on *:not(.case__slider-items):not(.case__slider-item-list):not(.upgrade__center-progress svg):not(.casebattle__slider-el) {
	transition: none !important;
	transition-duration: 0ms !important
}

.animate_on .games__item:before {
	transition: none !important
}

.alert {
	font-size: .775rem;
	text-align: center;
	padding: .75rem;
	border-radius: 1rem;
	border: solid 1px #3a4362;
	color: #aebff3
}

.alert.warning {
	border-color: #ffb46e33;
	color: #ffb46e
}

.alert span {
	color: #ffc120
}

.casebattle__player-ready {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	font-size: .875rem;
	color: #fff;
	gap: .75rem;
	text-align: center;
	font-weight: 500
}

.casebattle__user.lose .casebattle__overlay--lose {
	opacity: 1;
	visibility: visible
}

.casebattle__overlay--lose {
	background-image: linear-gradient(var(--tw-gradient-stops));
	--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), #b94040 var(--tw-gradient-to-position))
}

.casebattle__user.lose .casebattle__overlay--lose img {
	filter: hue-rotate(325deg)
}

.casebattle__panels-mode {
	display: flex;
	flex-wrap: wrap;
	gap: .3rem;
	margin-bottom: 1rem
}

.casebattle__panels-mode-item {
	display: flex;
	align-items: center;
	gap: .25rem;
	font-size: .675rem;
	padding: .25rem;
	background: #2A2E38;
	border-radius: .5rem;
	font-weight: 500
}

.casebattle__panels-mode.casebattle__panels-mode--page {
	margin: 0;
	justify-content: flex-end
}

.case__top-inner {
	position: relative;
	min-height: 15rem
}

.free-case__promo .cases__case-img {
	display: flex;
	justify-content: center
}


.free-case__promo .item {
	width: 9rem;
	margin: 0rem auto
}

.withdraw__info.disabled .badge {
	flex-shrink: 0;
	order: -1
}

.withdraw__info.disabled .withdraw__sale {
	background: #ffffff1c
}

.withdraw__info.disabled .withdraw__sale:hover {
	background: #ffffff26
}

.withdraw__info.disabled .withdraw__sale span {
	color: #fffffff7
}

.withdraw__info.disabled {
	position: relative;
	margin-top: 1rem
}

.event__case.wait>.sum {
	color: #fff
}

.event__case.wait .bonus__sum {
	background: #63d5482e;
	color: #37ff76
}

.event__case.wait .cases__case {
	background: linear-gradient(to bottom, #1f2840, #233a35)
}

.event__case.wait .cases__case:hover .cases__case-bg {
	opacity: 0
}

.event__case.wait .cases__case:hover {
	background: linear-gradient(to bottom, #1f2840, #38724a)
}

.event__case.wait .event__case-ellipse {
	background: #4fcf77
}

.vipPage_accordeons h2 {
	font-size: var(--text-2xl);
    line-height: var(--tw-leading, var(--text-lg--line-height));
    font-weight: var(--font-weight-semibold);
}

.accordeons {
	display: flex;
	flex-direction: column;
	gap: .5rem
}

.accordeon__item {
	display: flex;
	flex-direction: column;
	background: #1E2229;
	border-radius: 1rem;
	overflow: hidden;
	transition: .2s;
	cursor: pointer
}

.accordeon__item-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 1rem 1rem;
	font-size: .875rem;
	font-weight: 500
}

.accordeon__item-head * {
	pointer-events: none
}

.accordeon__item-head .icon {
	color: var(--gray)
}

.accordeon__item.active .accordeon__item-head .icon {
	color: var(--primary);
	transform: rotate(180deg)
}

.accordeon__item.active {
	background: #1E2229
}

.accordeon__item-body {
	position: relative;
	display: none
}

.accordeon__item-body .typical {
	padding: 0rem 1rem 1.25rem 1rem;
	font-size: .875rem;
	color: #c4d1f5
}

.typical ol {
	counter-reset: multi-counters;
	display: flex;
	flex-direction: column;
	gap: 1rem
}

.typical ol li:before {
	counter-increment: multi-counters;
	content: counters(multi-counters, ".") "."" " !important;
	color: var(--primary)
}

.accordeon__item:not(.active):hover {
	background: #1E2229
}

.accordeon__item.active .accordeon__item-body {
	display: block
}

.typical ol,
.typical ul {
	color: var(--gray-light)
}

.typical>ol>li>span:first-child {
	color: var(--primary)
}

.typical ol li ol,
.typical ol li ul {
	margin-top: 1rem;
	font-size: .875rem;
	gap: 1rem;
	display: flex;
	flex-direction: column
}

.typical a {
	color: var(--primary);
	text-decoration: underline
}

.typical a:hover {
	text-decoration: none
}

.deposit__promocodes-btn {
	padding: .5rem .75rem;
	background: #15487a70;
	border-radius: 1rem;
	font-size: .875rem;
	border: solid 1px #298cfc;
	transition: 0.2s ease;
	position: relative
}

.deposit__promocodes-btn span {
	font-weight: 700
}

.deposit__promocodes-btn p {
	color: #a8ccf9;
	font-size: .75rem
}

.deposit__promocodes-btn:hover {
	background: #15487abf
}

.deposit__promocodes-btn .icon {
	position: absolute;
	right: 1rem;
	top: 50%;
	transform: translateY(-50%);
	font-size: 1.25rem;
	color: var(--primary)
}

@media (min-width:476px) {
	.promocodes {
		width: 32rem
	}
}

@media (max-width:475px) {
	.promocodes {
		width: 100%
	}
}

.promocodes h3 {
	font-size: 1.5rem;
	line-height: 100%
}

.promocodes__items {
	display: flex;
	flex-direction: column;
	gap: .5rem
}

.promocodes__item {
	padding: .75rem 1rem;
	background: #2A2E38;
	border-radius: 1rem;
	position: relative;
	border: dashed 1px #455585;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-right: .5rem
}

.promocodes__item-inner {
	display: flex;
	flex-direction: column;
	position: relative;
	z-index: 1;
	padding-left: 1rem
}

.promocodes__item-inner span {
	font-weight: 500;
	font-size: 1.125rem
}

.promocodes__item-inner p {
	font-weight: 400;
	font-size: .775rem !important
}

.promocodes__item:before {
	content: '';
	position: absolute;
	left: -1.12rem;
	top: 50%;
	width: 2.25rem;
	height: 2.25rem;
	border-radius: 50%;
	background: #1E2229;
	transform: translateY(-50%);
	border-right: dashed 1px #455585
}

.promocodes__item>.icon {
	position: absolute;
	left: -.5rem;
	font-size: 1.25rem;
	color: #7b93db
}

.form-input__desc {
	font-size: .775rem;
	color: #daeaff
}

.deposit__promo-activate {
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-radius: .75rem;
	font-size: .875rem;
	color: #a5b5df
}

.deposit__promo-activate span {
	padding: .25rem .5rem;
	background: #3aff4b3d;
	border-radius: 2rem;
	color: #3aff4b
}

.auth__desc p a {
	color: var(--primary);
	text-decoration: underline
}

.auth__desc p a:hover {
	text-decoration: none
}

.vip-club__cashback {
	padding-right: 1rem;
	display: flex;
	justify-content: space-between
}

@media (min-width:571px) {
	.vip-club__cashback {
		grid-column: 1 / 3
	}
}

.auth__button.fill.telegram {
	background: #54a9eb;
	padding: .1rem 0;
	transition: .2s ease
}

.auth__button.fill.telegram iframe {
	transform: scale(.95)
}

.auth__button.fill.telegram:hover {
	opacity: .65
}

.bonus__task-title a {
	color: var(--primary);
	text-decoration: underline
}

.bonus__task-title a:hover {
	text-decoration: none
}

.upgrade .waitUpgrade {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%)
}

.upgrade__buttons {
	min-height: 72px;
	position: relative
}

.cases__select-game.transparent {
	background: transparent;
	height: fit-content
}

@media (max-width:575px) {
	.page__controls-left-inner .page__controls-button:nth-child(5) {
		display: none
	}
}

.upgrade .cases__select-game {
	margin-bottom: 16px
}

input,
textarea,
button,
select,
a {
	-webkit-tap-highlight-color: transparent
}

.form-input__label-right {
	font-size: .765rem;
	color: #68779f
}

.form-input__label-right span {
	color: #9faccf
}

.form-input__helper {
	display: flex;
	align-items: stretch;
	justify-content: space-between;
	height: 2rem;
	background: #2A2E38;
	border-radius: .75rem;
	font-size: .775rem;
	font-weight: 500;
	color: #a7b1cd;
	overflow: hidden
}

.form-input__helper button {
	display: flex;
	flex: auto;
	align-items: center;
	justify-content: center;
	border-right: solid 1px #323d5a;
	transition: 0.2s ease
}

.form-input__helper button:last-child {
	border: 0
}

.form-input__helper button:hover {
	background: #303541;
	color: #fff
}

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

.deposit__you-earn-text {
	display: flex;
	font-size: .775rem;
	color: #aab7d9;
	align-items: center;
	gap: .5rem;
	flex-direction: row-reverse
}

.deposit__you-earn-text .sum {
	color: #fff;
	font-size: 1rem
}

.deposit__you-earn-promo {
	display: flex;
	padding: .5rem .75rem;
	font-size: .775rem;
	background: #56ef5517;
	border-radius: .75rem;
	color: #56ef55
}

.form-input__wrapp.success input {
	border-color: #59f758;
	background-color: #59f7580f !important
}

.form-input__wrapp.success .form-input__icon {
	color: #59f758
}

@media (min-width:1101px) {
	.footer__right-item {
		font-size: var(--text-lg)
	}

	.footer__right-item .icon {
		font-size: var(--text-2xl)
	}
}

#jcont {
	pointer-events: none
}

/* .header.active .itemHorizontal__weapon {
	max-height: 3rem
} */

@media (max-width:992px) {
	.cases__head .title {
		font-size: var(--text-2xl)
	}
}

.mobile-menu {
	position: fixed;
	z-index: 9998;
	width: 100%;
	left: 50%;
	bottom: 0;
	transform: translateX(-50%);
	pointer-events: none
}

.mobile-menu__body {
	display: flex;
	align-items: stretch;
	height: 4.25rem;
	background: #2A2E38;
	border-radius: 0;
	overflow: hidden;
	z-index: 1;
	pointer-events: auto;
	border-top: solid 1px #3a425e
}

.mobile__menu-button {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	justify-content: center;
	flex: auto;
	font-size: .775rem;
	color: #8893b7;
	font-weight: 600;
	gap: .1rem
}

.mobile__menu-button:active,
.mobile__menu-button.active {
	color: #fff
}

.mobile__menu-button:active img,
.mobile__menu-button.active img {
	filter: saturate(1);
	opacity: 1
}

.mobile__menu-button img {
	width: 2.25rem;
	height: 2.25rem;
	filter: saturate(1);
	opacity: .4
}

.mobile__menu-button svg {
	width: 1.5rem;
	height: 1.5rem;
	margin-bottom: .65rem;
	position: relative;
	top: 4px
}

.mobile-menu__more {
	position: absolute;
	left: 0;
	bottom: 4.25rem;
	height: fit-content;
	overflow: auto;
	width: 100%;
	background: #2A2E38;
	border-radius: 1rem 1rem 0 0;
	display: flex;
	flex-direction: column;
	padding: 1.25rem;
	box-sizing: border-box;
	opacity: 0;
	visibility: hidden;
	transition: .2s ease
}

.mobile-menu.open .mobile-menu__more {
	opacity: 1;
	visibility: visible;
	pointer-events: auto
}

.mobile-menu__more .header__nav a {
	background: transparent !important;
	padding: 0;
	border-radius: 0;
	color: #7e89af;
	height: fit-content
}

.mobile-menu__more .header__nav {
	flex-direction: column;
	align-items: flex-start;
	gap: 1.25rem
}

.mobile-menu__more .header__nav a:active {
	color: #fff
}

@media (min-width:1051px) {
	.mobile-menu {
		display: none
	}
}

@media (max-width:960px) {
	.games {
		display: none
	}

	footer {
		padding-bottom: 4.25rem
	}

	.withdraw__info {
		bottom: calc(var(--spacing) * 20)
	}
}

@media (max-width:960px) {

	.footer__top-left .header__nav,
	.footer__top-right .cases__select-game {
		display: none
	}

	.footer__top {
		flex-direction: row;
		align-items: center
	}
}

.banners__list-item-top span {
	font-size: var(--text-2xl);
	line-height: var(--tw-leading, var(--text-2xl--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold);
	line-height: 100%
}

.banners__list-item-top p {
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-leading: 130%;
	color: #ffffffbf;
	line-height: 130%
}

@media (max-width:960px) {
	#jcont.notranslate {
		bottom: 4.25rem !important
	}
}

jdiv>jdiv>jdiv[class^='wrap_']:has(jdiv[class^='iconWrap_']) {
	transition: bottom .2s;
	z-index: 9999 !important
}

jdiv>jdiv>jdiv[class^='wrap_'].end:has(jdiv[class^='iconWrap_']) {
	bottom: 156px;
	z-index: 9999 !important
}

@media(max-width:1370px) {
	jdiv>jdiv>jdiv[class^='wrap_'].end:has(jdiv[class^='iconWrap_']) {
		bottom: 134px
	}
}

@media(max-width:1100px) {
	jdiv>jdiv>jdiv[class^='wrap_'].end:has(jdiv[class^='iconWrap_']) {
		bottom: 194px
	}
}

@media(max-width:1024px) {
	jdiv>jdiv>jdiv[class^='wrap_'].end:has(jdiv[class^='iconWrap_']) {
		bottom: 216px
	}
}

@media(max-width:820px) {

	jdiv>jdiv>jdiv[class^='wrap_']:has(jdiv[class^='iconWrap_']),
	jdiv>jdiv>jdiv[class^='wrap_'].end:has(jdiv[class^='iconWrap_']) {
		bottom: 60px;
		z-index: 9999 !important
	}
}

..mobile-menu__body {
	position: fixed;
	bottom: 20px;
	left: 50%;
	transform: translateX(-50%);
	width: calc(100% - 32px);
	border-radius: 16px;
	background: #131a2a;
	box-shadow: 0 4px 20px rgba(0, 0, 0, .4);
	overflow: hidden;
	z-index: 1000
}

.mobile-menu__body [x-show],
.mobile-menu__body .submenu,
.mobile-menu__body .more-menu {
	bottom: calc(20px + 70px);
	position: fixed;
	left: 50%;
	transform: translateX(-50%);
	width: calc(100% - 32px);
	border-radius: 16px;
	overflow: hidden
}

.mobile__menu-button {
	border-radius: 10px
}

.mobile-menu__body {
  position: fixed !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  transform: none !important;
  width: 100% !important;
  border-radius: 10px 10px 0 0 !important;
  overflow: hidden !important;
  z-index: 1000 !important;
}



.mobile-menu__more {
  position: fixed !important;
  left: 0 !important;
  right: 0 !important;
  transform: none !important;
  bottom: 60px !important;
  width: 100% !important;
  border-radius: 10px 10px 10px 10px !important;
  overflow: hidden !important;
  z-index: 1001 !important
}


.sitemap__nav {
	align-items: center;
	gap: calc(var(--spacing) * 2);
	display: flex;
	flex-direction: column;
	max-width: 250px;
	margin: 0 auto
}

.sitemap__nav li {
	width: 100%
}

.sitemap__nav a {
	width: 100%;
	height: calc(var(--spacing) * 11);
	align-items: center;
	gap: calc(var(--spacing) * 2);
	padding-inline: calc(var(--spacing) * 3);
	font-size: var(--text-base);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--gray);
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	background-color: #1E2229;
	border-radius: 3.40282e38px;
	display: flex
}

.sitemap__nav a:hover {
	color: var(--color-white);
	background-color: #2A2E38
}

.freecase-info {
	margin: 15px auto;
	padding: 15px;
	background: #1E2229;
	border: 1px solid #435683;
	border-radius: 10px;
	max-width: 400px
}

.freecase-text {
	margin: 0;
	font-size: 14px;
	font-weight: 500;
	line-height: 1.5;
	text-align: center
}

.freecase-required {
	color: #007bff;
	font-weight: 600
}

.freecase-user {
	text-align: center;
	margin-top: 6px;
	font-size: 13px;
	line-height: 1.4
}

.blog-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 20px
}

.blog-card {
	background: #1E2229;
	border: 1px solid #435683;
	border-radius: 12px;
	overflow: hidden;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
	display: flex;
	flex-direction: column
}

.blog-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 4px 15px rgba(0, 0, 0, .4)
}

.blog-card img {
	width: 100%;
	height: 180px;
	object-fit: cover
}

.blog-content {
	padding: 15px;
	display: flex;
	flex-direction: column;
	flex-grow: 1
}

.blog-title {
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 10px;
	line-height: 1.3
}

.blog-date {
	margin-top: auto;
	font-size: 14px;
	color: #9aa9cc
}

.blog-page {
	max-width: 100%;
	margin: 20px 0;
	padding: 0 20px;
	color: #d8e0ff;
	line-height: 1.7
}

.blog-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px
}

.blog-title {
	font-size: 32px;
	font-weight: 800;
	color: #fff;
	margin: 0
}

.blog-image {
	margin: 25px 0
}

.blog-image img {
	width: 100%;
	border-radius: 14px;
	border: 1px solid #435683;
	object-fit: cover
}

.blog-content {
	background: #1E2229;
	border: 1px solid #435683;
	border-radius: 12px;
	padding: 25px
}

.blog-content h2,
.blog-content h3 {
	color: #fff;
	margin-top: 15px;
	margin-bottom: 10px;
	font-weight: 700
}

.blog-content p {
	margin-bottom: 15px;
	color: #d8e0ff
}

.blog-content a {
	color: #6ca8ff;
	text-decoration: underline
}

.blog-content ul,
.blog-content ol {
	margin: 15px 0 15px 25px
}

.blog-content li {
	margin-bottom: 6px
}

.blog-content code {
	background: #10162b;
	border: 1px solid #435683;
	padding: 2px 6px;
	border-radius: 4px;
	color: #89b4ff;
	font-family: monospace
}

.blog-content pre {
	background: #10162b;
	border: 1px solid #435683;
	border-radius: 8px;
	padding: 10px 14px;
	overflow-x: auto;
	color: #89b4ff;
	margin-bottom: 20px
}

@media (max-width:768px) {
	.blog-title {
		font-size: 24px
	}

	.blog-content {
		padding: 18px
	}
}

@media (max-width:768px) {
	.blog-card img {
		height: 160px
	}

	.blog-title {
		font-size: 16px
	}
}

@media (max-width:480px) {
	body {
		padding: 10px
	}

	.blog-grid {
		gap: 15px
	}

	.blog-card img {
		height: 140px
	}
}

.fancybox__content {
	max-width: 840px
}

.modal.settings.chances-modal {
	width: 42rem;
	max-width: 760px
}

.modal.settings.chances-modal .modal__body {
	max-width: 100%;
	width: 100%;
	border-radius: 24px
}

.case-chances {
	margin-top: 16px;
	max-height: 75vh;
	overflow-y: auto
}

.case-chances__head,
.case-chances__row {
	display: flex;
	align-items: center;
	padding: 0 18px
}

.case-chances__head {
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: .06em;
	opacity: .65;
	margin-bottom: 8px
}

.case-chances__col--item,
.case-chances__item {
	flex: 1 1 auto;
	min-width: 0
}

.case-chances__col--price,
.case-chances__price {
	flex: 0 0 auto;
	margin-left: 24px;
	text-align: right;
	min-width: 100px
}

.case-chances__col--chance,
.case-chances__chance {
	flex: 0 0 auto;
	margin-left: 32px;
	text-align: right;
	min-width: 90px
}

.case-chances__row {
	background: rgba(255, 255, 255, .04);
	border-radius: 16px;
	padding-top: 14px;
	padding-bottom: 14px;
	margin-bottom: 10px;
	transition: background 0.2s ease
}

.case-chances__row:hover {
	background: rgba(255, 255, 255, .07)
}

.case-chances__item {
	display: flex;
	align-items: center;
	gap: 14px
}

.case-chances__item img {
	width: 64px;
	height: 64px;
	object-fit: contain;
	border-radius: 10px;
	background: rgba(0, 0, 0, .35);
	flex-shrink: 0
}

.case-chances__item-text {
	display: flex;
	flex-direction: column
}

.case-chances__item-name {
	font-size: 15px;
	font-weight: 600;
	color: #fff;
	line-height: 1.3;
	margin-top: 2px
}

.case-chances__price .sum {
	display: inline-flex;
	align-items: center
}

.case-chances__price .sum span {
	white-space: nowrap
}

.case-chances__chance {
	font-size: 13px;
	color: #fff;
	opacity: .9;
	white-space: nowrap
}

.case-chances__item-type {
	font-size: 13px;
	color: rgba(255, 255, 255, .6);
	line-height: 1.2
}

@media (max-width:1024px) {
	.modal.settings.chances-modal {
		width: 82vw;
		max-width: 82vw
	}

	.case-chances__col--price,
	.case-chances__price {
		margin-left: 20px;
		min-width: 90px
	}

	.case-chances__col--chance,
	.case-chances__chance {
		margin-left: 26px;
		min-width: 80px
	}
}

@media (max-width:768px) {
	.modal.settings.chances-modal .modal__body {
		max-width: 100% !important;
		width: 100% !important;
		border-radius: 24px;
		overflow: hidden
	}

	.case-chances {
		max-height: calc(100vh - 220px);
		overflow-y: auto;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		padding-bottom: 32px
	}

	.case-chances__head,
	.case-chances__row {
		min-width: 420px;
		padding: 0 10px
	}

	.case-chances__item img {
		width: 48px;
		height: 48px
	}

	.case-chances__item-name {
		font-size: 13px
	}

	.case-chances__item-type {
		font-size: 11px
	}

	.case-chances__col--price,
	.case-chances__price {
		margin-left: 12px;
		min-width: 80px
	}

	.case-chances__col--chance,
	.case-chances__chance {
		margin-left: 16px;
		min-width: 80px
	}

	.case-chances__chance {
		font-size: 12px
	}
}

.page__header-chances {
	/* margin-left: 10px */
    position: absolute;
    /* right: 116px; */
    right: 0;
    color: var(--gray-light);
    background: #1E2229;
    border-radius: 3.40282e38px;
}

@media (max-width:360px) {
    .page__header-chances {
        display: none;
    }
}


.page__header-chances:hover {
    color: #ffffff;
    background: #2A2E38;
}

@media (max-width:768px) {

	.hotkeys-btn,
	.page__header-keyboard:not(.page__header-chances) {
		display: none !important
	}
}

.blog-nav {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	margin-top: 40px;
	padding-top: 24px;
	border-top: 1px solid rgba(255, 255, 255, .08)
}

.blog-nav__link {
	flex: 1;
	padding: 16px 20px;
	border-radius: 16px;
	background: rgba(255, 255, 255, .02);
	text-decoration: none;
	display: flex;
	flex-direction: column;
	transition: background 0.2s ease, transform 0.2s ease
}

.blog-nav__link:hover {
	background: rgba(255, 255, 255, .05);
	transform: translateY(-2px)
}

.blog-nav__label {
	font-size: 12px;
	opacity: .6;
	margin-bottom: 4px
}

.blog-nav__title {
	font-size: 15px;
	font-weight: 600
}

.blog-nav__link--prev {
	text-align: left
}

.blog-nav__link--next {
	text-align: right
}

.goTopButton {
	position: fixed;
	left: 16px;
	bottom: 20px;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	background: rgba(30, 34, 41, 0.3);
	border: 1px solid rgba(90, 150, 255, .25);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	z-index: 9999;
	transition: opacity .25s ease, transform .25s ease, box-shadow .25s ease, background .25s ease;
	box-shadow: 0 0 12px rgba(50, 120, 255, .25)
}

.goTopButton svg path {
	stroke: #bcd8ff
}

.goTopButton.hide {
	opacity: 0;
	transform: translateY(10px);
	pointer-events: none
}

.goTopButton:hover {
	background: #1E2229;
	transform: translateY(-2px);
	box-shadow: 0 0 20px rgba(80, 160, 255, .35)
}

.game-area {
    width: 100%;
    height: 300px;
    background: rgba(255,255,255,0.05);
    border-radius: 16px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    user-select: none;
    cursor: pointer;
}

.game-placeholder,
.game-result {
    text-align: center;
    padding: 1.5rem 1rem;
    font-size: var(--text-base);
    line-height: var(--text-base--line-height);
    color: var(--gray-light);
}

.game-result__line {
    margin-bottom: .5rem;
    font-weight: var(--font-weight-bold);
    color: var(--color-white);
}

.game-result__hint {
    margin-top: .75rem;
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
    color: var(--gray-light);
    opacity: .9;
}

.reaction-block {
    width: 100%;
    height: 100%;
    border-radius: 1.5rem;
    background-color: #202a50;
    cursor: pointer;
}

.aim-target {
    position: absolute;
    width: 26px;
    height: 26px;
    border-radius: 999px;
    background: #16a34a;
    box-shadow: 0 0 0 4px rgba(22, 163, 74, .35);
    cursor: pointer;
}

.game-placeholder {
    opacity: .5;
}

.aim-target {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #00ff00;
    position: absolute;
    cursor: pointer;
}

.contract__info-block {
    background: rgba(255, 255, 255, 0.05);
    padding: 24px 28px;
    border-radius: 20px;
    line-height: 1.55;
    font-size: 15px;
    color: #d7d7d9;
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.contract__info-block h3 {
    margin: 0 0 18px 0;
    font-size: 20px;
    font-weight: 600;
    color: #fff;
    position: relative;
    padding-left: 14px;
}

.contract__info-block h3::before {
    content: "";
    position: absolute;
    left: 0;
    top: 6px;
    width: 4px;
    height: 18px;
    border-radius: 4px;
    background: linear-gradient(135deg, #4ae19a, #33a86c);
}

.contract__info-block p {
    margin: 4px 0 8px 0;
}

.contract__info-block b {
    color: #ffffff;
    font-weight: 600;
}

@media (max-width: 600px) {
    .contract__info-block {
        padding: 20px 18px;
        font-size: 14px;
    }

    .contract__info-block h3 {
        font-size: 18px;
    }
}

@media (max-width:540px) {
	.goTopButton {
		bottom: 78px;
		left: 14px;
		width: 42px;
		height: 42px
	}
}

#home-faq .accordeon__item {
	background-color: #16191E
}

#home-faq .accordeon__item.active,
#home-faq .accordeon__item:not(.active):hover {
	background-color: #1E2229
}

#home-faq .accordeon__item-body {
	background: transparent;
	border-radius: 0;
	padding: 0
}

.header__nav ul {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    /* gap: calc(var(--spacing) * 2) !important; */
    gap: 16px;
    list-style: none !important;
    margin: 0 !important;
    /* padding: 0 !important; */
    padding: 8px 16px;
}

.header__nav ul > li {
    margin: 0 !important;
    padding: 0 !important;
}

.mobile-menu__more .header__nav ul {
    flex-direction: column !important;
    align-items: flex-start !important;
}

/* --- modals: validator fix (label without <p>) --- */
.checkbox__input{
	position:absolute;
	opacity:0;
	width:1px;
	height:1px;
	pointer-events:none;
}

.checkbox__button-desc .checkbox__button-sub{
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	--tw-font-weight: var(--font-weight-bold);
	font-weight: var(--font-weight-bold);
	color: var(--gray);
	text-transform: none; /* важно: чтобы не было UPPERCASE как у .checkbox__button-desc span */
}

/* ссылки как раньше было для .checkbox__button-desc p a */
.checkbox__button-desc .checkbox__button-sub a{
	/* color: var(--primary); */
	text-decoration: underline;
	line-height: 140%;
	pointer-events: all;
}
.checkbox__button-desc .checkbox__button-sub a:hover{
	text-decoration: none;
}

/* --- restore old .btn__inner-left p styles after replacing <p> with .btn__sub --- */
.btn__inner-left .btn__sub{
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	color: #ffffffa6;
}
@supports (color:color-mix(in lab, red, red)) {
	.btn__inner-left .btn__sub{
		color: color-mix(in oklab, var(--color-white)65%, transparent);
	}
}

/* restore subtitle style after replacing .btn__inner-left p -> .btn__sub */
.btn__inner-left .btn__sub{
	display:block;
	font-size: var(--text-sm);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	color: #ffffffa6;
}

@supports (color:color-mix(in lab, red, red)) {
	.btn__inner-left .btn__sub{
		color: color-mix(in oklab, var(--color-white)65%, transparent);
	}
}

/* FIX: второй ряд в checkbox__button-desc после замены <p> -> <span> */
.checkbox__button-desc span + span{
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    font-weight: var(--font-weight-bold);
    color: var(--gray);
    text-transform: none;
}
.checkbox__button-desc span + span a{
    color: var(--primary);
    text-decoration: underline;
    line-height: 140%;
    pointer-events: all;
}
.checkbox__button-desc span + span a:hover{
    text-decoration: none;
}

/* @media (max-width: 768px) {
	.footer__stats-item--online {
		display: none;
	}
} */

@media (max-width: 768px) {
	.header__logotype-text {
		display: none;
	}
}

.freecase-onebtn .btn{width:100%}
.freecase-onebtn .btn__inner-left p b{font-weight:900}

@media (min-width: 1000px) {
	.auth {
        width: 40rem;
		display: flex;
	}
    .auth__image {
        overflow: hidden;
        border-radius: 1.5rem;
    }
    .auth__image-overlay {
        height: 100%;
    }
}

@media (max-width: 1050px) {
    .header .wrapper {
        border-radius: 0 0 var(--radius-3xl) var(--radius-3xl);
    }
    .additionalPages {
        display: none;
    }
    .secondaryHeader {
        top: 5.5rem;
    }
    .header .socials, .header .header__settings-btn {
        display: none;
    }
}

.hRLog {
    gap: calc(var(--spacing)*3);
}

.hAL {
    /* margin-right: 1rem; */
    height: 3.5rem;
    background: linear-gradient(to right, #0055F3, #38A0FF);
    border-radius: 1.25rem;
    transition: opacity 0.2s;
}

.hAL:hover {
    opacity: 0.8;
}

@media (min-width: 1200px) {
    .cases__cases {
        grid-template-columns: repeat(5, minmax(0, 1fr))
    }
    .cases__case img {
        max-height: none;
    }
}

.banners__list .banners__event-timer {
	margin: 0;
	margin-top: auto;
}

/* .banners .banners__event {
	width: 29.1875rem;
} */

/* .banners__list .banners__list-item-info__name {
	max-width:220px;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
} */

.banners__list .banners__list-item span {
	font-size: 0.8rem;
}

.banners__list .banners__list-item-info {
	width: 100%;
	z-index: 3;
}

.banners__list .banners__list-item-info__name {
	padding-right: 30px;
}

.banners__list .banners__list-item-info__preName {
	display: none;
}

.banners__list .banners__event-timer-item {
	padding: 0.7rem 0;
	height: auto;
	/* background: #1E2229; */
	background: rgba(30, 34, 41, 0.6);
}

.banners__list .banners__event-timer-item p {
	font-size: 0.5rem;
	color: rgba(255, 255, 255, 0.5);
}

.banners__list .giveaway__wrapp-users {
	position: absolute;
	top: 15px;
	right: 10px;
}

.banners__list .giveaway__wrapp-users {
	margin: 0;
	gap: 0.4rem;
}

.banners__list .giveaway__wrapp-users .icon {
	font-size: 1rem;
	opacity: 0.8;
}

.banners__list .giveaway__wrapp-users-info p {
	display: none;
}

.banners__list .banners__list-item-image {
	overflow: visible;
}

.banners__list .banners__list-item-image .item__image {
	bottom: 0;
	z-index: 2;
}

.banners__list .banners__list-item-image .item__rarity-img {
	bottom: 0;
	scale: 2.7;
	/* z-index: 0; */
}

.banners .item__center {
	top:17px;
}

/* \resources\views\index.blade.php >>> */

/* Блок баннеров (тут же слайдер) */

/* .home-banners */
.home-banners {
	gap: 1rem;
}

.home-banners .two-banners {
	width: 540px;
	display: flex;
	flex-direction: column;
	gap: 1rem;
	flex: none;
}
.home-banners .two-banners__item {
	position: relative;
	padding: 20px;
	width: 100%;
	height: 100%;
	max-width: none;
	background: #16191E;
	border-radius: var(--radius-3xl);
	display: flex;
	flex-direction: column;
	gap: 6px;
	overflow: hidden;
	z-index: 0;
}

.home-banners .tbi-1 {
	background: linear-gradient(135deg, rgba(25, 90, 42, 0.15), rgba(63, 215, 101, 0.7));
}
.home-banners .tbi-2 {
	/* background: linear-gradient(45deg, rgba(94, 92, 230, 0.15), rgba(138, 92, 255, 0.36)); */
	background: linear-gradient(135deg, rgba(0, 40, 151, 0.15), rgba(39, 179, 255, 0.7));
}

.home-banners .two-banners__items-box {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.home-banners .two-banners__item-title,
.home-banners .two-banners__item-subtitle {
	max-width: 340px;
}

.home-banners .two-banners__item-title {
	font-size: var(--text-lg);
	font-weight: var(--font-weight-medium);
}

.home-banners .two-banners__item-subtitle {
	color: rgba(255, 255, 255, 0.7);
}

.home-banners .two-banners__item-but-box {
	margin-top: auto;
	display: flex;
	align-items: center;
	gap: 10px;
}

.home-banners .two-banners__item-but-box__item {
	padding: 0 1.5rem;
	height: 2.5rem;
	color: #0F1115;
	background: #fff;
	font-size: var(--text-base);
	font-weight: 700;
	border-radius: 999px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	cursor: pointer;
	transition: opacity 0.2s;
}
.home-banners .two-banners__item-but-box__item:hover {
	opacity: 0.7;
}

.home-banners .banners__event-timer {
	gap: 1px;
}

.home-banners .banners__event-timer-item {
	/* height: 2.5rem; */
	height: 3.125rem;
	background: rgba(255, 255, 255, 0.1);
}

.home-banners .banners__event-timer-item span{
	/* font-size: var(--text-2xl); */
	font-size: var(--text-base);
	color: #fff;
}

.home-banners .banners__event-timer-item p{
	color: rgba(255, 255, 255, 0.7);
}

.home-banners .banners__event-timer .banners__event-timer-item {
	border-radius: 0;
}
.home-banners .banners__event-timer .banners__event-timer-item:first-child {
	border-radius: 99px 0 0 99px;
}
.home-banners .banners__event-timer .banners__event-timer-item:last-child {
	border-radius: 0 99px 99px 0;
}

.home-banners .two-banners__item-img {
	position: absolute;
	top: 50%;
	right: -10px;
	transform: translateY(-50%);
	height: 120%;
	z-index: -1;
}



/* Блок раздачи скинов */

.home-skin-giveaways {
	display: flex;
	flex-direction: column;	
}

.home-skin-giveaways .title {
	padding-top: 0;
	justify-content: start;
}
	
.home-skin-giveaways .banners__list {
	margin-bottom: 14px;
	height: 186px;
	flex: none;
	display: grid;
	gap: .75rem;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	overflow-x: auto;
	-ms-overflow-style: none; /* IE и Edge */
	scrollbar-width: none; /* Firefox */
}
.home-skin-giveaways .banners__list::-webkit-scrollbar {
	display: none; /* Chrome, Safari и Opera */
}

.home-skin-giveaways .banners__list-item {
	height: 100%;
}
.home-skin-giveaways .banners__list-item:hover .banners__list-item-image img{
	scale: 1.1;
}

.home-skin-giveaways .banners__list-item-info {
	padding: .75rem;
}

.home-skin-giveaways .banners__list-item-info .banners__list-item-info__name {
	padding: 4px 0 0 4px;
	padding-right: 50px;
	font-size: var(--text-sm);
	font-weight: var(--font-weight-medium);
}

.home-skin-giveaways .banners__list-item-info .sum.sum--sm {
	padding-left: 4px;
	color: #FFB720;
}

.home-skin-giveaways .banners__list-item-info .icon {
	opacity: 1;
}

.home-skin-giveaways .banners__list-item-image img {
	right: initial;
}

.home-skin-giveaways .item__center {
	height: 7rem;
}

.home-skin-giveaways .giveaway__wrapp-users{
	top: 10px;
	right: 14px;
}

.home-skin-giveaways .giveaway__wrapp-users-info {
	font-size: var(--text-base);
}

.home-skin-giveaways .giveaway__wrapp-users-info span{
	color: #38A0FF;
	font-size: var(--text-sm);
}

.home-skin-giveaways .item__rarity-img {
	top: 0;
	height: 100%;
	scale: none;
}

.home-skin-giveaways .item__center-dolphin {
	color: rgba(255, 255, 255, 0.08);
}

.home-skin-giveaways .banners__event-timer {
	gap: 1px;
}

.home-skin-giveaways .banners__event-timer .banners__event-timer-item {
	padding: 0.625rem 0;
	flex-direction: row;
	border-radius: 0;
	background: rgba(22, 25, 30, 0.6);
}
.home-skin-giveaways .banners__event-timer .banners__event-timer-item:first-child {
	border-radius: 99px 0 0 99px;
}
.home-skin-giveaways .banners__event-timer .banners__event-timer-item:last-child {
	border-radius: 0 99px 99px 0;
}

.home-skin-giveaways .banners__event-timer .banners__event-timer-item span {
	font-size: var(--text-sm);
}

.home-skin-giveaways .banners__event-timer .banners__event-timer-item p {
	font-size: var(--text-xs);
	text-transform: none;
}

@media (max-width: 1000px) {
	.home-skin-giveaways .banners__list {
		grid-template-columns: repeat(4, minmax(290px, 1fr));
	}

	.home-skin-giveaways .banners__list {
		height: 164px;
	}

	.home-skin-giveaways .banners__list-item-image {
		bottom: 8px;
	}
}

@media (max-width: 992px) {
	.home-skin-giveaways .title {
		font-size: var(--text-2xl);
	}
}

/* СЛАЙДЕР */

/* Изоляция стилей: всё начинается с .dolphin-home-slider */
.dolphin-home-slider {
	position: relative;
	width: 100%;
	height: 24rem;
	border-radius: 16px;
	background: #16191E;
	overflow: hidden;
	/* aspect-ratio: 16 / 6;  */
	cursor: grab;
	touch-action: pan-y;
}
.dolphin-home-slider:active {
	cursor: grabbing;
}

/* @media (max-width: 768px) {
	.dolphin-home-slider { aspect-ratio: 16 / 10; }
} */

.dolphin-home-slider .slider-track {
	height: 100%;
	display: flex;
	/* Убираем transition здесь, будем управлять им через JS */
	will-change: transform;
}

.dolphin-home-slider .slide {
	position: relative;
	min-width: 100%;
	display: block;
	user-select: none;
	-webkit-user-drag: none;
}

.dolphin-home-slider .slide-bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: 1;
	pointer-events: none;
}

.dolphin-home-slider .slide-overlay {
	position: absolute;
	inset: 0;
	/* background: linear-gradient(90deg, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.5) 50%, rgba(0,0,0,0) 100%); */
	z-index: 2;
	pointer-events: none;
}

.dolphin-home-slider .slide-content {
	position: relative;
	padding-left: 70px;
	max-width: 55%;
	height: 100%;
	color: #fff;
	display: flex;
	flex-direction: column;
	justify-content: center;
	z-index: 3;
	pointer-events: none;
}

@media (max-width: 768px) {
	.dolphin-home-slider .slide-content {
		padding-left: 20px;
		padding-right: 20px;
		padding-bottom: 50px;
		max-width: 100%;
		/* background: linear-gradient(0deg, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0) 100%); */
		justify-content: flex-end;
	}
	.dolphin-home-slider .slide-overlay { display: none; }
}

.dolphin-home-slider .slide-content-new {
	padding: 4px 8px;
	margin-bottom: 8px;
	width: fit-content;
	background: #FF6467;
	font-size: var(--text-sm);
	font-weight: var(--font-weight-medium);
	border-radius: 999px;
}

.dolphin-home-slider h2 {
	margin: 0 0 12px 0;
	color: #fff;
	font-size: var(--text-3xl);
	font-weight: 800;
	line-height: 1.1;
}

.dolphin-home-slider p {
	margin: 0 0 24px 0;
	max-width: 500px;
	color: rgba(255, 255, 255, 0.7);
	font-size: 16px;
	line-height: 1.5;
}

.dolphin-home-slider .slide-btn {
	padding: 0 1.5rem;
	width: fit-content;
	height: 2.5rem;
	background: #fff;
	color: #0F1115;
	font-size: var(--text-base);
	font-weight: 700;
	border-radius: 999px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: transform 0.2s, background 0.2s;
	text-decoration: none;
	pointer-events: auto;
	cursor: pointer;
	transition: opacity 0.2s;
}
.dolphin-home-slider .slide-btn:hover {
	opacity: 0.7;
}
/* Блокируем перетаскивание самой кнопки браузером */
.dolphin-home-slider .slide-btn {
	-webkit-user-drag: none;
}

@media (max-width: 768px) {
	.dolphin-home-slider p, .dolphin-home-slider .arrow {
		display: none;
	}
}

.dolphin-home-slider .arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 44px;
	height: 44px;
	color: #fff;
	background: rgba(255, 255, 255, 0.1);
	/* border: 1px solid rgba(255,255,255,0.1); */
	font-size: 24px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 10;
	cursor: pointer;
	transition: 0.2s;
	user-select: none;
}
.dolphin-home-slider .arrow:hover {
	background: rgba(255, 255, 255, 0.3);
}
.dolphin-home-slider .arrow-prev {
	left: 20px;
}
.dolphin-home-slider .arrow-next {
	right: 20px;
}

.dolphin-home-slider .dots {
	position: absolute;
	bottom: 20px;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	gap: 8px;
	z-index: 10;
}
.dolphin-home-slider .dot {
	width: 8px;
	height: 8px;
	background: rgba(255, 255, 255, 0.3);
	border-radius: 50%;
	cursor: pointer;
	transition: 0.2s;
}
.dolphin-home-slider .dot.active {
	background: #fff;
	transform: scale(1.3);
}

@media (max-width: 1000px) {
	.dolphin-home-slider {
		height: 160px;
	}

	.dolphin-home-slider .arrow {
		display: none;
	}

	.dolphin-home-slider h2 {
		font-size: var(--text-lg);
		margin: 0 0 17px 0;
	}

	.home-banners .two-banners {
		width: 100%;
	}

	.home-banners .two-banners__item {
		padding: 14px 16px;
		justify-content: space-between;
		flex-direction: row;
	}

	.home-banners .two-banners__item-but-box {
		margin-top: 0;
	}
	
	.home-banners .banners__event-timer {
		display: none;
	}

	.home-banners .two-banners__item-img {
		display: none;
	}

	.home-banners .two-banners__items-box {
		gap: 0;
	}

	.home-banners .two-banners__item-subtitle {
		font-size: var(--text-sm);
	}
}

/* \resources\views\index.blade.php <<< */

/* \resources\views\bonus.blade.php >>> */


/* Блок стрик системы */

.bonus__streak {
	padding: calc(var(--spacing)*6);
	width: 100%;
	height: auto;
	background: #1E2229;
	border-radius: var(--radius-3xl);
	display: flex;
	flex-direction: column;
	gap: calc(var(--spacing)*4);
}

.bonus__streak__buttons-counters {
	width: 100%;
	display: flex;
	justify-content: space-between;
	gap: 10px;
	flex-wrap: wrap;
}

.bonus__streak__buttons {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
}

.bonus__streak__button {
	padding: 20px;
	height: 40px;
	background: #2A2E38;
	font-size: var(--text-sm);
	font-weight: var(--font-weight-semibold);
	border-radius: 16px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	transition: background 0.2s, opacity 0.2s;
}
.bonus__streak__button:hover {
	background: #303541;
}

.bonus__streak__button-take {
	background: var(--primary-gradient);
}
.bonus__streak__button-take:hover {
	background: var(--primary-gradient);
	opacity: 0.7;
}

.bonus__streak__button.hidden {
	display: none;
}

.modal__bonus__streak .auth__desc {
	gap: calc(var(--spacing)*4);
}
.modal__bonus__streak .auth__desc p {
	line-height: var(--text-base--line-height);
}

.bonus__streak__counters {
	display: flex;
	gap: 10px;
}

.bonus__streak__counter {
	padding: 20px;
	height: 40px;
	font-size: var(--text-sm);
	font-weight: var(--font-weight-semibold);
	border-radius: 16px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
}

.bonus__streak__counter-updated {
	color: #FFB900;
}
.bonus__streak__counter-combustion {
	color: #FF6467;
}

.bonus__streak__counter.hidden {
	display: none;
}

.bonus__streak__layer-items {
	position: relative;
}
.bonus__streak__layer-items::before,
.bonus__streak__layer-items::after {
	content: '';
	position: absolute;
	top: 0;
	width: 40px;
	height: 100%;
	pointer-events: none;
	z-index: 1;
}
.bonus__streak__layer-items::before {
	left: 0;
	background: linear-gradient(to right, #1E2229, transparent);
}
.bonus__streak__layer-items::after {
	right: 0;
	background: linear-gradient(to left, #1E2229, transparent);
}

.bonus__streak__items {
	position: relative;
	padding: 0 20px;
	width: 100%;
	display: flex;
	align-items: center;
	gap: 10px;
	overflow-x: scroll;
}

.bonus__streak__items::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
.bonus__streak__items::-webkit-scrollbar-track {
    background: #16191E; 
}
.bonus__streak__items::-webkit-scrollbar-thumb {
    background: #2A2E38;
}
.bonus__streak__items::-webkit-scrollbar-thumb:hover {
    background: #303541;
}

.bonus__streak__item {
	position: relative;
	flex-shrink: 0;
}

.bonus__streak__item-img {
	width: auto;
	height: 100px;
}

.bonus__streak__item-day {
	position: absolute;
    left: 50%;
	bottom: 0;
    transform: translate(-50%, 0);
	padding: 6px 10px;
	background: rgba(30, 34, 41, 0.8);
	font-size: var(--text-sm);
	font-weight: var(--font-weight-medium);
	border-radius: 999px;
	white-space: nowrap;
}

.bonus__streak__item-current-day .bonus__streak__item-img,
.bonus__streak__item-gold-day .bonus__streak__item-img {
	height: 110px;
}
.bonus__streak__item-current-day .bonus__streak__item-day {
	background: rgba(56, 160, 255, 0.8);
}
.bonus__streak__item-gold-day {
	filter: drop-shadow(0px 0px 40px #AA6F2C);
}
.bonus__streak__item-gold-day .bonus__streak__item-day {
	color: #FFA920;
	background: rgba(66, 45, 11, 0.8);
	border: 1px solid #FFA920;
}

@media (max-width: 1100px) {
	.bonus__streak__item-img {
		height: 70px;
	}
	.bonus__streak__item-current-day .bonus__streak__item-img,
	.bonus__streak__item-gold-day .bonus__streak__item-img {
		height: 80px;
	}
}

/* \resources\views\bonus.blade.php <<< */