.resize-observer[data-v-b329ee4c] {
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	width: 100%;
	height: 100%;
	border: none;
	background-color: transparent;
	pointer-events: none;
	display: block;
	overflow: hidden;
	opacity: 0
}

.resize-observer[data-v-b329ee4c] object {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	overflow: hidden;
	pointer-events: none;
	z-index: -1
}

.v-popper__popper {
	z-index: 10000;
	top: 0;
	left: 0;
	outline: none
}

.v-popper__popper.v-popper__popper--hidden {
	visibility: hidden;
	opacity: 0;
	transition: opacity .15s, visibility .15s;
	pointer-events: none
}

.v-popper__popper.v-popper__popper--shown {
	visibility: visible;
	opacity: 1;
	transition: opacity .15s
}

.v-popper__popper.v-popper__popper--skip-transition,
.v-popper__popper.v-popper__popper--skip-transition>.v-popper__wrapper {
	transition: none !important
}

.v-popper__backdrop {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: none
}

.v-popper__inner {
	position: relative;
	box-sizing: border-box;
	overflow-y: auto
}

.v-popper__inner>div {
	position: relative;
	z-index: 1;
	max-width: inherit;
	max-height: inherit
}

.v-popper__arrow-container {
	position: absolute;
	width: 10px;
	height: 10px
}

.v-popper__popper--arrow-overflow .v-popper__arrow-container,
.v-popper__popper--no-positioning .v-popper__arrow-container {
	display: none
}

.v-popper__arrow-inner,
.v-popper__arrow-outer {
	border-style: solid;
	position: absolute;
	top: 0;
	left: 0;
	width: 0;
	height: 0
}

.v-popper__arrow-inner {
	visibility: hidden;
	border-width: 7px
}

.v-popper__arrow-outer {
	border-width: 6px
}

.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-inner,
.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-inner {
	left: -2px
}

.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-outer,
.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-outer {
	left: -1px
}

.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-inner,
.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-outer {
	border-bottom-width: 0;
	border-left-color: transparent !important;
	border-right-color: transparent !important;
	border-bottom-color: transparent !important
}

.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-inner {
	top: -2px
}

.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-container {
	top: 0
}

.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-inner,
.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-outer {
	border-top-width: 0;
	border-left-color: transparent !important;
	border-right-color: transparent !important;
	border-top-color: transparent !important
}

.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-inner {
	top: -4px
}

.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-outer {
	top: -6px
}

.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-inner,
.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-inner {
	top: -2px
}

.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-outer,
.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-outer {
	top: -1px
}

.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-inner,
.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-outer {
	border-left-width: 0;
	border-left-color: transparent !important;
	border-top-color: transparent !important;
	border-bottom-color: transparent !important
}

.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-inner {
	left: -4px
}

.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-outer {
	left: -6px
}

.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-container {
	right: -10px
}

.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-inner,
.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-outer {
	border-right-width: 0;
	border-top-color: transparent !important;
	border-right-color: transparent !important;
	border-bottom-color: transparent !important
}

.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-inner {
	left: -2px
}

.v-popper--theme-tooltip .v-popper__inner {
	background: #000c;
	color: #fff;
	border-radius: 6px;
	padding: 7px 12px 6px
}

.v-popper--theme-tooltip .v-popper__arrow-outer {
	border-color: #000c
}

.v-popper--theme-dropdown .v-popper__inner {
	background: #fff;
	color: #000;
	border-radius: 6px;
	border: 1px solid #ddd;
	box-shadow: 0 6px 30px #0000001a
}

.v-popper--theme-dropdown .v-popper__arrow-inner {
	visibility: visible;
	border-color: #fff
}

.v-popper--theme-dropdown .v-popper__arrow-outer {
	border-color: #ddd
}

:root {
	--container-padding-inline: 10px;
	--general-player-height: 56px;
	--bottom-menu-height: 88px
}

@media (min-width: 568px) {
	:root {
		/*--container-padding-inline: 40px;*/
		--general-player-height: 104px
	}
}

@font-face {
	font-family: Galano Grotesque;
	src: url(../../assets/Galano-Grotesque-Regular-BjrHsQh2.woff) format("woff");
	font-weight: 400;
	font-style: normal;
	font-display: swap
}

@font-face {
	font-family: Galano Grotesque;
	src: url(../../assets/Galano-Grotesque-SemiBold-CWRAs9VL.woff) format("woff");
	font-weight: 500;
	font-style: normal;
	font-display: swap
}

@font-face {
	font-family: Galano Grotesque;
	src: url(../../assets/Galano-Grotesque-Bold-Bud6eMxC.woff) format("woff");
	font-weight: 700;
	font-style: normal;
	font-display: swap
}

@font-face {
	font-family: Montserrat;
	src: url(../../assets/Montserrat-Regular-DRoh7jzm.woff) format("woff");
	font-weight: 400;
	font-style: normal;
	font-display: swap
}

@font-face {
	font-family: Montserrat;
	src: url(../../assets/Montserrat-SemiBold-BiEyYWGd.woff) format("woff");
	font-weight: 500;
	font-style: normal;
	font-display: swap
}

@font-face {
	font-family: Montserrat;
	src: url(../../assets/Montserrat-Bold-cWG6a6a7.woff) format("woff");
	font-weight: 700;
	font-style: normal;
	font-display: swap
}

* {
	box-sizing: border-box;
	margin: 0;
	padding: 0
}

html {
	height: 100%
}

body {
	min-height: calc(100vh + 110px);
	background-color: #000;
	font-family: Galano Grotesque, Montserrat, sans-serif;
	font-size: 16px;
	line-height: 120%;
	color: #fff
}

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

.prevent-scroll {
	overflow: hidden
}

.image-frame {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	max-height: 100%;
	flex-shrink: 0;
	overflow: hidden;
	background-color: #151719
}

.image-frame img {
	min-width: 100%;
	min-height: 100%;
	opacity: 0;
	transition: opacity .1s ease-in;
	border-radius: inherit
}

.image-frame img.is-loaded {
	opacity: 1
}

::-webkit-scrollbar {
	width: var(--scrollbar-size, 8px);
	height: var(--scrollbar-size, 8px)
}

::-webkit-scrollbar-track {
	background-color: #40404099;
	border-radius: 4px
}

::-webkit-scrollbar-thumb {
	background-color: #807a77cc;
	border-radius: 4px
}

.container {
	margin: 0 auto;
	padding: 0;
	max-width: 1440px;
	width: 100%
}

.row {
	display: flex;
	flex-wrap: wrap;
	margin-left: calc(var(--bs-gutter-x) * -.5);
	margin-right: calc(var(--bs-gutter-x) * -.5)
}

.row>* {
	flex-shrink: 0;
	max-width: 100%;
	/*padding-left: calc(var(--bs-gutter-x) * .5);
	padding-right: calc(var(--bs-gutter-x) * .5);*/
	width: 100%
}

.column {
	flex: 1 0 0%
}

.column-auto,
.row-columns-auto>* {
	flex: 0 0 auto;
	width: auto
}

.column-1 {
	flex: 0 0 auto;
	width: 4.1666666667%
}

.column-2 {
	flex: 0 0 auto;
	width: 8.3333333333%
}

.column-3 {
	flex: 0 0 auto;
	width: 12.5%
}

.column-4 {
	flex: 0 0 auto;
	width: 16.6666666667%
}

.column-5 {
	flex: 0 0 auto;
	width: 20.8333333333%
}

.column-6 {
	flex: 0 0 auto;
	width: 25%
}

.column-7 {
	flex: 0 0 auto;
	width: 29.1666666667%
}

.column-8 {
	flex: 0 0 auto;
	width: 33.3333333333%
}

.column-9 {
	flex: 0 0 auto;
	width: 37.5%
}

.column-10 {
	flex: 0 0 auto;
	width: 41.6666666667%
}

.column-11 {
	flex: 0 0 auto;
	width: 45.8333333333%
}

.column-12 {
	flex: 0 0 auto;
	width: 50%
}

.column-13 {
	flex: 0 0 auto;
	width: 54.1666666667%
}

.column-14 {
	flex: 0 0 auto;
	width: 58.3333333333%
}

.column-15 {
	flex: 0 0 auto;
	width: 62.5%
}

.column-16 {
	flex: 0 0 auto;
	width: 66.6666666667%
}

.column-17 {
	flex: 0 0 auto;
	width: 70.8333333333%
}

.column-18 {
	flex: 0 0 auto;
	width: 75%
}

.column-19 {
	flex: 0 0 auto;
	width: 79.1666666667%
}

.column-20 {
	flex: 0 0 auto;
	width: 83.3333333333%
}

.column-21 {
	flex: 0 0 auto;
	width: 87.5%
}

.column-22 {
	flex: 0 0 auto;
	width: 91.6666666667%
}

.column-23 {
	flex: 0 0 auto;
	width: 95.8333333333%
}

.column-24 {
	flex: 0 0 auto;
	width: 100%
}

@media only screen and (min-width: 1775px) {
	.column-xl-1 {
		flex: 0 0 auto;
		width: 4.1666666667%
	}

	.column-xl-2 {
		flex: 0 0 auto;
		width: 8.3333333333%
	}

	.column-xl-3 {
		flex: 0 0 auto;
		width: 12.5%
	}

	.column-xl-4 {
		flex: 0 0 auto;
		width: 16.6666666667%
	}

	.column-xl-5 {
		flex: 0 0 auto;
		width: 20.8333333333%
	}

	.column-xl-6 {
		flex: 0 0 auto;
		width: 25%
	}

	.column-xl-7 {
		flex: 0 0 auto;
		width: 29.1666666667%
	}

	.column-xl-8 {
		flex: 0 0 auto;
		width: 33.3333333333%
	}

	.column-xl-9 {
		flex: 0 0 auto;
		width: 37.5%
	}

	.column-xl-10 {
		flex: 0 0 auto;
		width: 41.6666666667%
	}

	.column-xl-11 {
		flex: 0 0 auto;
		width: 45.8333333333%
	}

	.column-xl-12 {
		flex: 0 0 auto;
		width: 50%
	}

	.column-xl-13 {
		flex: 0 0 auto;
		width: 54.1666666667%
	}

	.column-xl-14 {
		flex: 0 0 auto;
		width: 58.3333333333%
	}

	.column-xl-15 {
		flex: 0 0 auto;
		width: 62.5%
	}

	.column-xl-16 {
		flex: 0 0 auto;
		width: 66.6666666667%
	}

	.column-xl-17 {
		flex: 0 0 auto;
		width: 70.8333333333%
	}

	.column-xl-18 {
		flex: 0 0 auto;
		width: 75%
	}

	.column-xl-19 {
		flex: 0 0 auto;
		width: 79.1666666667%
	}

	.column-xl-20 {
		flex: 0 0 auto;
		width: 83.3333333333%
	}

	.column-xl-21 {
		flex: 0 0 auto;
		width: 87.5%
	}

	.column-xl-22 {
		flex: 0 0 auto;
		width: 91.6666666667%
	}

	.column-xl-23 {
		flex: 0 0 auto;
		width: 95.8333333333%
	}

	.column-xl-24 {
		flex: 0 0 auto;
		width: 100%
	}
}

@media screen and (min-width: 568px) {
	.container {
		padding-left: calc(var(--bs-gutter-x) * .5);
		padding-right: calc(var(--bs-gutter-x) * .5)
	}
}

button {
	padding: 0;
	margin: 0;
	border: none;
	outline: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background-color: transparent;
	color: inherit;
	touch-action: manipulation;
	display: block;
	cursor: pointer;
	font-family: Galano Grotesque, Montserrat, sans-serif
}

.button {
	--button-height: 36px;
	--button-font-size: 16px;
	--button-line-height: 20px;
	--button-border-width: 1px;
	--button-padding-inline: 26px;
	--button-padding-block: calc(((var(--button-height) - var(--button-line-height)) / 2) - var(--button-border-width));
	font-size: var(--button-font-size);
	line-height: var(--button-line-height);
	letter-spacing: .01em;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: steps(1);
	position: relative;
	min-height: var(--button-height);
	width: -moz-fit-content;
	width: fit-content;
	padding: var(--button-padding-block) var(--button-padding-inline);
	background-color: #eb1a26;
	color: #fff;
	border: var(--button-border-width) solid #EB1A26;
	border-radius: 8px;
	cursor: pointer;
	font-family: Galano Grotesque, Montserrat, sans-serif;
	font-weight: 500;
	text-decoration: none;
	transition: all .3s cubic-bezier(.68, -.1, .65, 1.03)
}

.button[disabled] {
	pointer-events: none;
	cursor: default;
	opacity: .3
}

.button:is(:hover, :focus) {
	background-color: #c1111b;
	border-color: #c1111b;
	text-decoration: none
}

.button:active {
	background-color: #920d14;
	border-color: #920d14
}

.button:focus-visible {
	outline: 2px solid dodgerblue;
	transition: outline-offset 145ms ease
}

.button:focus-visible:not(:active) {
	outline-offset: 2px
}

.button.small {
	--button-height: 26px;
	--button-font-size: 12px;
	--button-line-height: 18px;
	--button-padding-inline: 8px;
	border-radius: 4px
}

@media (min-width: 568px) {
	.button.small {
		--button-height: 38px;
		--button-font-size: 16px;
		--button-padding-inline: 16px
	}
}

.button.icon-only {
	padding: calc((var(--button-height) - var(--button-line-height)) / 2 - var(--button-border-width))
}

.button.secondary {
	background-color: transparent
}

.button.black {
	background-color: #191a1b;
	font-weight: unset;
	border: unset;
	-moz-column-gap: 16px;
	column-gap: 16px
}

.button.full-width {
	width: revert
}

.button svg {
	height: var(--button-line-height);
	width: auto
}

.range-slider {
	--slider-track-height: 2px;
	--slider-thumb-height: 24px;
	position: relative;
	padding-block: 16px;
	width: 100%
}

.range-slider:hover .thumb {
	transform: translate(-50%, -50%) scale(1)
}

.range-slider .track {
	position: absolute;
	width: 100%;
	height: var(--slider-track-height);
	background: #303030;
	cursor: pointer;
	transform: translateY(-50%)
}

.range-slider .track:before {
	content: "";
	position: absolute;
	width: 100%;
	height: var(--slider-thumb-height);
	top: 50%;
	transform: translateY(-50%)
}

.range-slider .filled-track {
	position: absolute;
	width: 100%;
	height: var(--slider-track-height);
	background: #eb1a26;
	pointer-events: none;
	transform: translateY(-50%)
}

.range-slider .thumb {
	position: absolute;
	width: 24px;
	height: 24px;
	background: #eb1a261a;
	border-radius: 50%;
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	transform: translate(-50%, -50%) scale(0);
	cursor: pointer;
	transition: transform .2s cubic-bezier(.68, -.1, .65, 1.03)
}

.range-slider .thumb:before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 3;
	width: calc(var(--slider-thumb-height) / 2);
	height: calc(var(--slider-thumb-height) / 2);
	margin: auto;
	background: #eb1a26;
	border-radius: 50%;
	outline: none;
	cursor: pointer;
	transition: transform .2s cubic-bezier(.68, -.1, .65, 1.03)
}

.range-slider .thumb:hover:before {
	transform: scale(1.3)
}

.form-field {
	--field-padding-inline: 16px;
	--field-outline-color: #9FA2A8;
	display: block;
	position: relative
}

.form-field.required label:after {
	content: "*";
	position: absolute;
	color: #d96244;
	top: -4px;
	right: -8px
}

.form-field .label {
	margin-bottom: 8px
}

.form-field label {
	position: relative;
	font-size: 16px;
	line-height: 18px;
	letter-spacing: .01em
}

.form-field .control {
	display: inline-flex;
	align-items: center;
	width: 100%;
	border-radius: 8px;
	box-shadow: 0 0 0 0 transparent;
	transition: box-shadow 145ms linear;
	background-color: #ffffff1a
}

.form-field .control:focus-within {
	box-shadow: 0 0 0 1px var(--field-outline-color)
}

.form-field .control-prefix {
	color: #807a77;
	display: flex;
	padding-inline-start: calc(var(--field-padding-inline) + 8px)
}

.form-field .control-suffix {
	padding-inline-end: var(--field-padding-inline)
}

.form-field.disabled {
	opacity: .5;
	pointer-events: none;
	cursor: not-allowed;
	color: #696969
}

.form-field select,
.form-field input,
.form-field textarea {
	min-width: 0;
	border: none;
	outline: none;
	background-color: transparent;
	font-size: 16px;
	line-height: 18px;
	letter-spacing: .01em;
	color: #fff;
	-webkit-appearance: none;
	border-radius: 0;
	flex: 1 1 auto;
	padding: 13px var(--field-padding-inline)
}

.form-field select::-moz-placeholder,
.form-field input::-moz-placeholder,
.form-field textarea::-moz-placeholder {
	color: #807a77;
	opacity: 1
}

.form-field select::placeholder,
.form-field input::placeholder,
.form-field textarea::placeholder {
	color: #807a77;
	opacity: 1
}

.form-field select::-ms-input-placeholder,
.form-field input::-ms-input-placeholder,
.form-field textarea::-ms-input-placeholder {
	color: #807a77
}

.form-field select:-webkit-autofill,
.form-field select:-webkit-autofill:focus,
.form-field input:-webkit-autofill,
.form-field input:-webkit-autofill:focus,
.form-field textarea:-webkit-autofill,
.form-field textarea:-webkit-autofill:focus {
	-webkit-transition: background-color 600000s 0s, color 600000s 0s;
	transition: background-color 600000s 0s, color 600000s 0s
}

.form-field select[data-autocompleted],
.form-field input[data-autocompleted],
.form-field textarea[data-autocompleted] {
	background-color: transparent !important
}

.form-field textarea {
	min-height: 280px;
	font-family: Galano Grotesque, Montserrat, sans-serif;
	resize: none
}

.form-field select {
	padding: 13px 40px 13px var(--field-padding-inline);
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap
}

.form-field select option {
	background: #000
}

.form-field select+.custom-arrow {
	position: absolute;
	right: 0;
	width: 40px;
	height: 30px;
	pointer-events: none;
	border-radius: 8px;
	background: transparent;
	display: flex;
	justify-content: center;
	align-items: center
}

.form-field[data-type=textarea] .control-prefix {
	align-self: flex-start;
	margin-top: 10px
}

.form-field .error-container {
	color: #d96244;
	font-size: 12px;
	line-height: 16px;
	letter-spacing: .01em;
	margin-top: 4px
}

.form-field .error-container:empty {
	display: none
}

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

a:hover {
	color: inherit
}

.link {
	transition: all .3s cubic-bezier(.68, -.1, .65, 1.03);
	display: inline-flex;
	align-items: center;
	gap: 16px;
	font-weight: 700;
	cursor: pointer
}

.link svg {
	transition: all .3s cubic-bezier(.68, -.1, .65, 1.03)
}

.link:hover {
	color: #eb1a26
}

.social-links {
	display: flex;
	gap: 24px
}

.social-links .social-link {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: #fff;
	display: flex;
	align-items: center;
	justify-content: center
}

.social-links .social-link svg {
	color: #eb1a26
}

ul,
ol {
	list-style: none;
	margin: 0;
	padding: 0
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
	margin: 0
}

h1 {
	font-size: 24px;
	line-height: 120%
}

@media (min-width: 568px) {
	h1 {
		font-size: 32px
	}
}

h2 {
	font-size: 18px;
	line-height: 120%
}

@media (min-width: 568px) {
	h2 {
		font-size: 24px
	}
}

h3 {
	font-size: 16px;
	line-height: 120%
}

.richtext {
	font-size: 16px;
	line-height: 140%
}

.richtext *:is(h1, h2, h3, h4, h5, h6, p, ul, ol, img, iframe) {
	margin-bottom: 16px
}

.richtext *:is(h1, h2, h3, h4, h5, h6, p, ul, ol, img, iframe):last-child {
	margin-bottom: 0
}

.richtext p:has(+ul, +ol) {
	margin-bottom: 0;
	line-height: 200%
}

.richtext a {
	color: #fff;
	text-decoration: underline;
	transition: color .1s linear
}

.richtext a:hover {
	color: #eb1a26
}

.richtext img,
.richtext iframe {
	display: block;
	width: 100%;
	border-radius: 8px
}

.richtext iframe {
	height: auto;
	aspect-ratio: 16/9
}

.richtext ul,
.richtext ol {
	margin-bottom: 16px;
	padding-left: 16px;
	line-height: 200%
}

.richtext ul>li,
.richtext ol>li {
	padding-left: 8px
}

.richtext ul {
	list-style-type: disc
}

.richtext ol {
	list-style-type: decimal
}

.richtext sub,
.richtext caption,
.richtext figcaption {
	font-size: 12px;
	line-height: 160%;
	letter-spacing: .01em
}

.details-text {
	font-size: 16px;
	line-height: 140%;
	color: #807a77
}

.details-text strong {
	font-weight: 700;
	line-height: 120%;
	color: #fff
}

.slide-up-fade-enter-active,
.slide-up-fade-leave-active {
	transition: all .3s cubic-bezier(.68, -.1, .65, 1.03)
}

.slide-up-fade-enter-from,
.slide-up-fade-leave-to {
	transform: translateY(10%);
	opacity: 0
}

.fade-enter-active,
.fade-leave-active {
	transition: opacity .1s ease
}

.fade-enter-from,
.fade-leave-to {
	opacity: 0
}

.fade-slow-enter-active,
.fade-slow-leave-active {
	transition: opacity .3s ease
}

.fade-slow-enter-from,
.fade-slow-leave-to {
	opacity: 0
}

.fade-banner-enter-active,
.fade-banner-leave-active {
	transition: opacity 1.5s ease
}

.fade-banner-enter-from,
.fade-banner-leave-to {
	opacity: 0
}

.scale-enter-active,
.scale-leave-active {
	transition: scale .05s ease-in-out
}

.scale-enter-from,
.scale-leave-to {
	scale: .8
}

.collapse-enter-active,
.collapse-leave-active {
	display: grid;
	grid-template-rows: 1fr;
	transition: grid-template-rows .5s cubic-bezier(.68, -.1, .65, 1.03)
}

.collapse-enter-active>*,
.collapse-leave-active>* {
	overflow: hidden
}

.collapse-enter-from,
.collapse-leave-to {
	grid-template-rows: 0fr
}

.mobile-menu-enter-active,
.mobile-menu-leave-active {
	--transition-duration: .3s;
	transition: all var(--transition-duration) linear
}

.mobile-menu-enter-active .nav-container,
.mobile-menu-leave-active .nav-container {
	transition: translate var(--transition-duration) cubic-bezier(.68, -.1, .65, 1.03)
}

.mobile-menu-enter-active .nav-overlay,
.mobile-menu-leave-active .nav-overlay {
	transition: opacity var(--transition-duration) cubic-bezier(.68, -.1, .65, 1.03)
}

.mobile-menu-enter-from .nav-container,
.mobile-menu-leave-to .nav-container {
	translate: -100%
}

.mobile-menu-enter-from .nav-overlay,
.mobile-menu-leave-to .nav-overlay {
	opacity: 0
}

.webview .content {
	padding-block: 16px !important
}

.article-card {
	display: flex;
	flex-direction: column;
	gap: 12px;
	min-width: min(335px, 100%);
	padding: 12px 12px 16px;
	margin-bottom: 8px;
	border-radius: 12px;
	background: #ffffff1a;
	-webkit-backdrop-filter: blur(40px);
	backdrop-filter: blur(40px);
	color: #fff
}

.article-card .card-content {
	display: flex;
	flex-direction: column;
	gap: 20px
}

.article-card .image-wrapper {
	display: grid;
	grid-template-areas: "content";
	flex-shrink: 0
}

.article-card .date-badge {
	grid-area: content;
	align-self: flex-start;
	justify-self: flex-end;
	top: 11px;
	right: 11px
}

.article-card img {
	grid-area: content;
	width: 100%;
	aspect-ratio: 16/9;
	-o-object-fit: cover;
	object-fit: cover;
	-o-object-position: center;
	object-position: center;
	border-radius: 16px
}

.article-card .title {
	font-weight: 700;
	letter-spacing: .16px;
	margin-bottom: 8px
}

.article-card .intro {
	font-size: 12px;
	line-height: 18px;
	letter-spacing: .12px;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	white-space: pre-wrap;
	font-weight: 400
}

.article-card .card-footer {
	font-size: 12px;
	line-height: 18px;
	letter-spacing: .12px;
	display: flex;
	flex-direction: column;
	gap: 22px;
	flex: 1;
	font-weight: 400
}

.article-card .date {
	font-weight: 700
}

.article-card .article-info {
	display: flex;
	flex-direction: column
}

.article-card .button {
	width: 100%
}

@media (max-width: 768px) {
	.article-card.is-compact {
		gap: 14px
	}

	.article-card.is-compact .card-content {
		flex-direction: row;
		gap: 8px
	}

	.article-card.is-compact .date-badge {
		display: none
	}

	.article-card.is-compact img {
		width: 80px;
		aspect-ratio: 1;
		margin: 0;
		border-radius: 8px;
		-o-object-fit: cover;
		object-fit: cover;
		-o-object-position: center;
		object-position: center
	}

	.article-card.is-compact .card-footer {
		flex: 1;
		gap: 24px
	}
}

@media (min-width: 568px) {
	.article-card {
		padding: 16px 14px;
		border-radius: 16px
	}

	.article-card .card-content {
		gap: 14px
	}

	.article-card img {
		aspect-ratio: 1;
		border-radius: 8px
	}

	.article-card .date-badge {
		top: 14px;
		right: 14px
	}

	.article-card .title {
		font-size: 24px;
		line-height: 120%;
		letter-spacing: .24px;
		margin-bottom: 8px;
		font-weight: 700
	}

	.article-card .intro {
		-webkit-line-clamp: 2
	}

	.article-card .card-footer {
		flex-direction: row-reverse;
		justify-content: left;
		align-items: center;
		gap: 24px;
		flex-wrap: wrap;
		flex-grow: 0;
		margin-top: auto
	}

	.article-card .card-footer span {
		margin: 0
	}

	.article-card .card-content {
		display: flex;
		flex-direction: column
	}

	.article-card .button {
		width: auto;
		margin: 0
	}
}

.articles-slider .cards-row {
	display: flex;
	transition: all .3s cubic-bezier(.68, -.1, .65, 1.03)
}

.articles-slider .cards-row.keen-slider {
	overflow: visible
}

.articles-slider .dots {
	display: flex;
	gap: 8px;
	padding-top: 16px;
	justify-content: center
}

.articles-slider .dot {
	border: none;
	width: 8px;
	height: 8px;
	background: #fff6;
	border-radius: 50%;
	cursor: pointer;
	transition: background .3s cubic-bezier(.68, -.1, .65, 1.03)
}

.articles-slider .dot:focus {
	outline: none
}

.articles-slider .dot.active {
	background: #fff
}

@media (min-width: 568px) {
	.articles-slider .cards-container {
		position: relative
	}

	.articles-slider .cards-container:before {
		content: "";
		display: block;
		position: absolute;
		left: calc(var(--container-padding-inline) * -1);
		height: 100%;
		width: var(--container-padding-inline);
		background: linear-gradient(90deg, #151719, #151719 8%, #151719b3 45%, #15171900);
		z-index: 1
	}

	.articles-slider .slide-wrapper {
		display: flex;
		scale: 1
	}

	.articles-slider .article-card {
		gap: 40px
	}

	.articles-slider .article-card .card-content {
		gap: 16px
	}

	.articles-slider .article-card .title {
		font-size: 16px
	}

	.articles-slider .cards-row.keen-slider {
		overflow: hidden
	}
}

.main-container .content {
	min-height: 100vh;
	padding-inline: var(--container-padding-inline);
	padding-block: 14px calc(var(--bottom-menu-height) + var(--general-player-height));
	overflow-x: hidden
}

.main-container .content .top-bar+.content-block {
	padding-top: 0
}

.page-background {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	height: 100vh;
	width: 100vw;
	z-index: -1;
	background-color: #151719;
	-o-object-fit: cover;
	object-fit: cover;
	-o-object-position: center;
	object-position: center
}

@media (min-width: 568px) {
	.main-container {
		display: flex;
		align-items: flex-start;
		padding-block: 14px;
		gap: 11px
	}

	.main-container .content {
		width: 100%;
		min-width: 0;
		padding-block: 40px var(--general-player-height);
		background: #151719bf;
		border-radius: 16px;
		isolation: isolate
	}
}

.content-block {
	padding-block: 12px
}

.content-block .block-head {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-bottom: 16px
}

.content-block .block-head:empty {
	display: none
}

.content-block .block-body:has(aside) {
	display: flex;
	flex-direction: column;
	-moz-column-gap: 19px;
	column-gap: 19px;
	row-gap: 16px
}

@media (min-width: 1024px) {
	.content-block .block-body:has(aside) {
		flex-direction: row
	}

	.content-block .block-body:has(aside) aside {
		max-width: 338px
	}
}

.content-block .head-row {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
	width: 100%
}

.content-block .block-title {
	display: flex;
	align-items: center;
	gap: 8px;
	font-weight: 700
}

.content-block .tab-list {
	--scrollbar-size: 4px;
	display: flex;
	gap: 16px;
	color: #807a77;
	overflow-x: auto
}

.content-block .tab {
	position: relative
}

.content-block .tab label {
	display: block;
	padding-bottom: 8px;
	line-height: 140%;
	cursor: pointer
}

.content-block .tab label:after {
	content: "";
	position: absolute;
	display: block;
	inset: auto 0 0 0;
	height: 3px;
	border-radius: 2px;
	background-color: #eb1a26;
	scale: 0 1;
	transition: scale .2s ease
}

.content-block .tab input {
	position: absolute;
	clip: rect(0, 0, 0, 0);
	overflow: hidden;
	width: 1px;
	height: 1px;
	padding: 0;
	border: 0;
	margin: -1px
}

.content-block .tab input:checked+label {
	color: #fff;
	font-weight: 700
}

.content-block .tab input:checked+label:after {
	scale: 1
}

@media (min-width: 568px) {
	.content-block {
		padding-block: 32px
	}

	.content-block .block-head {
		margin-bottom: 24px
	}

	.content-block .block-title {
		font-size: 24px;
		gap: 16px
	}
}

.general-player {
	position: fixed;
	inset: auto 0 0 0;
	max-height: 100%;
	bottom: var(--bottom-menu-height);
	z-index: 11
}

.general-player .source-details {
	display: grid;
	grid-auto-flow: row;
	gap: 4px;
	height: 100%;
	min-width: 160px
}

.general-player .source-details>* {
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap
}

.general-player .source-details>*:first-child {
	margin-bottom: auto
}

@media (min-width: 568px) {
	.general-player {
		bottom: 0
	}
}

.desktop-player .player-container {
	position: relative;
	display: flex;
	gap: 40px;
	height: var(--general-player-height);
	background-color: #e600171a;
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	z-index: 1
}

.desktop-player .col {
	display: flex;
	flex: 1;
	height: 100%;
	align-items: center;
	justify-content: center
}

.desktop-player .col-center .col-inner {
	display: flex;
	flex-direction: column;
	justify-content: center;
	width: 100%;
	height: 100%
}

.desktop-player .col-left {
	justify-content: flex-start
}

.desktop-player .col-left a {
	height: 100%
}

.desktop-player .col-left .image-frame {
	transition: height .3s cubic-bezier(.68, -.1, .65, 1.03);
	height: 100%;
	aspect-ratio: 1
}

.desktop-player .col-left .image-frame img {
	-o-object-fit: cover;
	object-fit: cover;
	-o-object-position: center;
	object-position: center
}

@media (max-width: 1024px) {
	.desktop-player .col-left .image-frame {
		height: 0
	}
}

.desktop-player .col-right {
	justify-content: flex-end;
	padding-right: 24px
}

.desktop-player .playback-controls {
	gap: min(40px, 3vw)
}

.desktop-player .source-details {
	padding: 12px 16px
}

.desktop-player .source-name {
	padding-bottom: 8px
}

.desktop-player .vote-buttons {
	padding-left: 16px
}

.desktop-player .volume-slider {
	flex: 1;
	justify-content: flex-end
}

.desktop-player .volume-slider .range-slider {
	max-width: 160px
}

.desktop-player .seek-slider .range-slider {
	max-width: 382px
}

.desktop-player .drawer-toggle {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-left: 18px;
	color: #fff;
	background-color: red;
	transition: all .1s cubic-bezier(.68, -.1, .65, 1.03);
	border-radius: 50%
}

.desktop-player .drawer-toggle:hover {
	background-color: #c00
}

.desktop-player .drawer-toggle:active {
	background-color: #900
}

.desktop-player .drawer-toggle svg {
	transition: transform .3s cubic-bezier(.68, -.1, .65, 1.03)
}

.desktop-player .drawer-toggle.is-active svg {
	transform: rotateX(180deg)
}

.desktop-player .player-drawer {
	--drawer-padding: 40px;
	position: fixed;
	bottom: 104px;
	width: 100%;
	padding: var(--drawer-padding);
	background-color: #1011134d;
	box-shadow: 0 -2px 12px #807a7740;
	-webkit-backdrop-filter: blur(60px);
	backdrop-filter: blur(60px);
	border-radius: 24px 24px 0 0;
	z-index: 0
}

.desktop-player .drawer-content {
	display: flex;
	justify-content: center
}

.desktop-player .drawer-slider {
	display: inline-block;
	max-width: 100%;
	position: relative
}

.desktop-player .drawer-slider .cards-row {
	overflow: visible
}

.desktop-player .drawer-slider .cards-row.no-slider {
	gap: 16px
}

.desktop-player .drawer-slider .dots {
	position: absolute;
	top: -16px;
	left: 0;
	right: 0;
	display: flex;
	gap: 8px;
	justify-content: center
}

.desktop-player .drawer-slider .dot {
	border: none;
	width: 8px;
	height: 8px;
	background: #fff6;
	border-radius: 50%;
	cursor: pointer;
	transition: background .3s cubic-bezier(.68, -.1, .65, 1.03)
}

.desktop-player .drawer-slider .dot:focus {
	outline: none
}

.desktop-player .drawer-slider .dot.active {
	background: #fff
}

.desktop-player .drawer-card {
	--card-width: 128px;
	--card-spacing: 10px;
	max-width: calc(var(--card-width) + var(--card-spacing));
	min-width: calc(var(--card-width) + var(--card-spacing));
	gap: 8px;
	padding-right: var(--card-spacing)
}

.desktop-player .drawer-card:last-child {
	max-width: var(--card-width);
	min-width: var(--card-width);
	padding: 0
}

.desktop-player .drawer-card .parent {
	font-size: 10px;
	line-height: 11px;
	letter-spacing: .01em
}

.desktop-player .drawer-card .station {
	font-size: 15px;
	line-height: 15px;
	letter-spacing: .01em
}

.desktop-player .drawer-card .title,
.desktop-player .drawer-card .subtitle {
	color: #fff
}

.desktop-player .drawer-card .title {
	font-size: 10px;
	line-height: 120%;
	letter-spacing: .01em;
	margin-bottom: 2.52px
}

.desktop-player .drawer-card .subtitle {
	font-size: 10px;
	line-height: 11.3px;
	letter-spacing: .01em;
	height: 12px
}

.desktop-player .minimal-card .card-head {
	background-position: center;
	background-size: cover
}

.desktop-player .minimal-card .logo {
	width: 80px
}

.desktop-player .preroll-container {
	position: relative;
	background-color: #404040cc
}

.desktop-player .preroll-container .button-close {
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	top: -32px;
	right: 0;
	height: 32px;
	width: 32px;
	background-color: #404040cc;
	cursor: pointer
}

.desktop-player .preroll-container .button-close svg {
	height: 24px;
	width: 24px
}

.desktop-player .preroll-container img {
	max-height: 250px
}

.mobile-player {
	display: grid;
	grid-auto-flow: row
}

.mini-player {
	display: flex;
	gap: 8px;
	align-items: center;
	height: var(--general-player-height);
	padding-inline: var(--container-padding-inline);
	background-color: #740b24;
	grid-row: 2;
	grid-column: 1
}

.mini-player .image-frame {
	border-radius: inherit
}

.mini-player .source-details {
	font-size: 12px;
	line-height: 18px;
	letter-spacing: .01em;
	padding-block: 8.5px;
	min-width: unset
}

.mini-player .source-details strong {
	font-size: 14px;
	line-height: 120%;
	letter-spacing: .01em
}

.mini-player .actions {
	display: flex;
	gap: 24px;
	margin-left: auto
}

.mini-player button {
	padding: 8px
}

.mini-player button svg {
	height: 24px;
	width: 24px
}

.mini-player .icon-wrapper {
	position: relative;
	display: grid;
	height: 40px;
	aspect-ratio: 1;
	border-radius: 4px
}

.mini-player .icon-circle {
	display: flex;
	align-items: center;
	justify-content: center;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	position: absolute;
	height: 32px;
	aspect-ratio: 1;
	border-radius: 50%
}

.mini-player .icon {
	height: 24px;
	aspect-ratio: 1
}

@keyframes gradientAnimation {
	0% {
		background-position: 0 50%
	}

	50% {
		background-position: 100% 50%
	}

	to {
		background-position: 0 50%
	}
}

.player-wrapper {
	background-color: #000000e6
}

.full-player {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	height: 100vh;
	-webkit-backdrop-filter: blur(20px);
	backdrop-filter: blur(20px);
	overflow-y: auto;
	grid-row: 1/3;
	grid-column: 1;
	background: linear-gradient(-45deg, var(--main-color), var(--secondary-color), var(--third-color));
	background-size: 400% 400%;
	animation: gradientAnimation 2.5s linear infinite
}

.full-player .inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
	width: 100%;
	padding: 44px var(--container-padding-inline);
	overflow: hidden
}

.full-player .inner-container {
	display: flex;
	flex-direction: column;
	width: 100%;
	max-width: 400px;
	gap: 40px
}

.full-player .slider-container {
	margin-inline: calc(var(--container-padding-inline) * -1);
	padding-inline: var(--container-padding-inline)
}

.full-player .collapse-toggle {
	align-self: flex-end
}

.full-player .source-details-block {
	width: 100%;
	margin-inline: auto
}

.full-player .source-details-block .channel-name:first-child {
	line-height: 120%
}

.full-player .source-details-block .channel-name+.channel-name {
	font-weight: 700
}

.full-player .source-details-block .image-frame {
	aspect-ratio: 1
}

.full-player .source-details-block .loader-overlay {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	display: grid;
	place-items: center;
	background-color: #0006
}

.full-player .source-details-block .loader {
	position: absolute;
	width: 124px;
	aspect-ratio: 1;
	border-radius: 50%;
	background: conic-gradient(#fff 5%, #0000 80%);
	-webkit-mask: radial-gradient(farthest-side, rgba(0, 0, 0, 0) calc(100% - 10px), #000 0);
	animation: rotate 1s infinite linear
}

.full-player .volume-slider,
.full-player .seek-slider {
	flex: 1
}

.full-player .volume-slider .range-slider {
	max-width: 100%
}

.full-player .seek-slider {
	display: grid;
	grid-template-columns: auto 1fr auto;
	gap: 4px
}

.full-player .seek-slider .range-slider {
	max-width: 100%;
	grid-row: 1;
	grid-column: span 3;
	padding-block: 12px
}

.full-player .seek-slider .time-progress {
	grid-row: 2;
	grid-column: 1;
	justify-content: flex-start
}

.full-player .seek-slider .time-max {
	grid-row: 2;
	grid-column: 3;
	justify-content: flex-end
}

.full-player .button-history {
	margin-left: auto;
	transition: color .3s cubic-bezier(.68, -.1, .65, 1.03)
}

.full-player .button-history.active {
	color: #740b24
}

.full-player .flex-row {
	display: flex;
	gap: 24px;
	justify-content: space-between;
	width: 100%;
	margin-inline: auto
}

.full-player .track-item .play-button,
.full-player .podcast-item .play-button {
	margin-left: auto
}

.full-player .track-item .info>*,
.full-player .podcast-item .info>* {
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	white-space: pre-wrap
}

.full-player .source-list ul {
	width: 100%
}

.full-player .channels-block .cards-container {
	display: grid;
	grid-template-columns: repeat(auto-fit, 163px);
	gap: 8px
}

.full-player .channels-block .cards-container:has(.simple-card:nth-child(3)) {
	grid-template-columns: repeat(auto-fit, minmax(163px, 1fr))
}

.full-player .channels-block .cards-container .simple-card {
	--card-width: 100%
}

.full-player .channels-block .simple-card {
	gap: 8px;
	font-size: 16px;
	padding: 0
}

.full-player .channels-block .station {
	font-size: 16px;
	line-height: 120%
}

.full-player .channels-block .subtitle {
	line-height: 18px
}

.fm-radio-block {
	--card-spacing: 8px
}

.fm-radio-block .cards-row {
	display: flex;
	transition: all .3s cubic-bezier(.68, -.1, .65, 1.03)
}

.fm-radio-block .cards-row.keen-slider {
	overflow: visible
}

.fm-radio-block .minimal-card {
	min-width: var(--card-width);
	max-width: var(--card-width)
}

.fm-radio-block .minimal-card:not(:last-child) {
	min-width: calc(var(--card-width) + var(--card-spacing));
	max-width: calc(var(--card-width) + var(--card-spacing));
	padding-right: var(--card-spacing)
}

@media (min-width: 568px) {
	.fm-radio-block {
		--card-spacing: 16px
	}

	.fm-radio-block .cards-container {
		position: relative
	}

	.fm-radio-block .cards-container:before {
		content: "";
		display: block;
		position: absolute;
		left: calc(var(--container-padding-inline) * -1);
		height: 100%;
		width: var(--container-padding-inline);
		background: linear-gradient(90deg, #151719, #151719 8%, #151719b3 45%, #15171900);
		z-index: 1
	}
}

@keyframes circular {
	0% {
		transform: translateY(-150px)
	}

	25% {
		transform: translate(150px)
	}

	50% {
		transform: translateY(150px)
	}

	75% {
		transform: translate(-150px)
	}

	to {
		transform: translateY(-150px)
	}
}

@keyframes circular2 {
	0% {
		transform: translateY(150px)
	}

	25% {
		transform: translate(-150px)
	}

	50% {
		transform: translateY(-150px)
	}

	75% {
		transform: translate(150px)
	}

	to {
		transform: translateY(150px)
	}
}

.giga-player {
	position: relative;
	display: grid;
	grid-template-columns: minmax(auto, 400px) minmax(200px, auto);
	gap: 24px 40px
}

.giga-player.video-mode {
	grid-template-columns: minmax(auto, 718px) minmax(auto, 353px)
}

.giga-player.video-mode .source-details-block .details-main {
	max-height: 400px
}

.giga-player .main-content,
.giga-player .side-content,
.giga-player .block-title {
	position: relative
}

.giga-player .background-image {
	position: absolute;
	bottom: 0;
	right: calc(var(--container-padding-inline) * -1);
	height: 100%;
	width: 80%;
	z-index: 0;
	opacity: 20%;
	background-color: transparent
}

.giga-player .background-image:after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	box-shadow: inset 0 0 76px 64px #151719
}

.giga-player .background-image img {
	-o-object-fit: cover;
	object-fit: cover;
	-o-object-position: center;
	object-position: center
}

.giga-player .source-details-block {
	height: 100%
}

.giga-player .source-details-block.paused .button-play,
.giga-player .source-details-block:hover .button-play {
	opacity: 1;
	visibility: visible
}

.giga-player .source-details-block .icon {
	flex-shrink: 0
}

.giga-player .source-details-block .channel-name {
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	white-space: pre-wrap
}

.giga-player .source-details-block .channel-name+.channel-name {
	font-size: 24px;
	line-height: 24px;
	letter-spacing: .01em;
	font-weight: 700
}

.giga-player .source-details-block .details-main {
	position: relative;
	min-width: 200px;
	min-height: 200px
}

.giga-player .source-details-block .button-container {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	display: grid;
	place-items: center;
	z-index: 1
}

.giga-player .source-details-block .button-play {
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 124px;
	width: 124px;
	z-index: 1;
	background-color: #00000080;
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	border-radius: 50%;
	clip-path: circle(calc(50% + 6px) at 50% 50%);
	opacity: 0;
	visibility: hidden;
	transition: opacity .3s cubic-bezier(.68, -.1, .65, 1.03), visibility .3s linear
}

.giga-player .source-details-block .button-play svg {
	height: 84px;
	width: auto
}

.giga-player .source-details-block .loader {
	position: absolute;
	width: calc(100% + 6px);
	aspect-ratio: 1;
	border-radius: 50%;
	background: conic-gradient(#fff 5%, #0000 80%);
	-webkit-mask: radial-gradient(farthest-side, rgba(0, 0, 0, 0) calc(100% - 8px), #000 0);
	animation: rotate 1s infinite linear
}

@keyframes rotate {
	to {
		transform: rotate(-1turn)
	}
}

.giga-player .episode-description {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	gap: 8px;
	height: 100%;
	padding-bottom: 20%
}

.giga-player .episode-description .title {
	font-size: 24px
}

.giga-player .episode-description .info {
	font-size: 12px;
	line-height: 18px;
	letter-spacing: .01em;
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	white-space: nowrap
}

.giga-player .source-list {
	height: 100%
}

.giga-player .source-list .title,
.giga-player .source-list .subtitle {
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	white-space: pre-wrap
}

.giga-player .blobs {
	width: 50vh;
	height: 50vh;
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%)
}

.giga-player .blob {
	width: 100%;
	height: 100%;
	border-radius: 100%;
	position: absolute;
	background-color: var(--main-color);
	mix-blend-mode: multiply;
	filter: blur(80px)
}

.giga-player .blob.a {
	animation: circular2 40s linear infinite;
	background-image: linear-gradient(#fff, #fff), var(--secondary-color);
	background-blend-mode: color;
	opacity: .8
}

.giga-player .blob.b {
	background-image: linear-gradient(#fff, #fff), var(--third-color);
	background-blend-mode: color;
	opacity: .5;
	animation: circular 20s linear infinite
}

.giga-player .blob.c {
	animation: circular 60s linear infinite
}

.image-gallery .images-container {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 8px
}

.image-gallery .images-container .image-wrapper {
	position: relative;
	display: grid;
	grid-template-areas: "content";
	border-radius: 8px;
	overflow: hidden;
	cursor: pointer
}

.image-gallery .images-container .image-frame {
	grid-area: content;
	width: 100%;
	aspect-ratio: 16/9;
	border-radius: inherit
}

.image-gallery .images-container img {
	-o-object-fit: cover;
	object-fit: cover;
	-o-object-position: center;
	object-position: center;
	border-radius: inherit
}

.image-gallery .images-container .image-overlay {
	grid-area: content;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background-color: #0006
}

.image-gallery .images-container .image-overlay .icon {
	height: 24px;
	width: auto
}

.image-gallery .images-container .images-count {
	font-weight: 700
}

@media (min-width: 568px) {
	.image-gallery .images-container {
		gap: 16px
	}

	.image-gallery .images-container .image-wrapper {
		border-radius: 16px
	}

	.image-gallery .images-container .image-overlay {
		font-size: 24px
	}

	.image-gallery .images-container .image-overlay .icon {
		height: 48px;
		margin-bottom: 8px
	}
}

.gallery-modal .modal-inner {
	width: 100%;
	max-width: 1211px;
	margin-top: 0;
	padding: 25px var(--container-padding-inline) 0;
	gap: 64px
}

.gallery-modal .gallery-slider:not([data-keen-slider-disabled]) {
	display: grid;
	grid-template-areas: "content";
	position: relative;
	width: 100%;
	align-items: center;
	overflow: visible !important
}

.gallery-modal .image-frame {
	grid-area: content;
	background-color: transparent;
	opacity: 0;
	transition: opacity .1s ease-out
}

.gallery-modal .image-frame.is-active {
	opacity: 1
}

.gallery-modal img {
	height: 100%;
	width: auto;
	min-width: auto;
	-o-object-fit: contain;
	object-fit: contain;
	border-radius: 4px
}

.gallery-modal .slider-arrows {
	display: flex;
	justify-content: space-between
}

.gallery-modal .slider-arrows .icon {
	height: 36px;
	width: auto;
	cursor: pointer
}

.gallery-modal .slider-counter {
	font-size: 16px;
	font-weight: 700;
	text-align: center
}

@media (min-width: 568px) {
	.gallery-modal .modal-inner {
		gap: 0
	}

	.gallery-modal img {
		max-height: 617px;
		border-radius: 16px
	}

	.gallery-modal .slider-container {
		position: relative;
		padding-inline: 55px
	}

	.gallery-modal .slider-arrows {
		position: absolute;
		top: 50%;
		left: 0;
		width: 100%
	}

	.gallery-modal .slider-arrows .icon {
		height: 48px
	}

	.gallery-modal .slider-counter {
		margin-top: 16px
	}
}

.minimal-card {
	--card-width: 100px;
	--card-subtitle-height: 22px;
	display: flex;
	flex-direction: column;
	flex: 1;
	gap: 12px;
	width: var(--card-width);
	cursor: pointer
}

.minimal-card .card-head {
	display: flex;
	justify-items: flex-start;
	align-items: flex-end;
	position: relative;
	min-width: 100px;
	aspect-ratio: 1;
	border-radius: 8px;
	overflow: hidden
}

.minimal-card .card-head .image-frame {
	position: absolute;
	height: 100%;
	width: 100%;
	z-index: -1
}

.minimal-card .card-head .image-frame img {
	-o-object-fit: cover;
	object-fit: cover;
	-o-object-position: center;
	object-position: center
}

.minimal-card .card-body {
	display: none
}

.minimal-card .logo {
	width: min(100%, 68px);
	margin-left: 16px;
	margin-bottom: 16px
}

.minimal-card .icon {
	position: absolute;
	top: 8px;
	right: 8px;
	height: 27px;
	width: 27px
}

.minimal-card .title {
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	white-space: pre-wrap;
	font-weight: 700;
	margin-bottom: 4px
}

.minimal-card .subtitle {
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	white-space: pre-wrap;
	height: var(--card-subtitle-height);
	line-height: 140%;
	color: #807a77
}

@media (min-width: 568px) {
	.minimal-card {
		--card-width: 205px
	}

	.minimal-card .card-body {
		display: block
	}

	.minimal-card .logo {
		width: min(100%, 127px)
	}
}

.mobile-header {
	position: relative;
	display: flex;
	color: #fff;
	width: 100%;
	height: 56px;
	justify-content: space-between;
	align-items: center;
	margin-top: 20px;
	padding: 0 20px
}

.mobile-header .mobile-search-wrapper {
	overflow: hidden;
	display: flex;
	justify-content: center;
	align-items: center;
	-moz-column-gap: 12px;
	column-gap: 12px;
	background-color: #000;
	margin: 0 20px;
	position: absolute;
	top: 0;
	left: 100%;
	right: 0;
	bottom: 0;
	visibility: hidden;
	border-radius: 8px;
	transition: left .3s, visibility .3s cubic-bezier(.68, -.1, .65, 1.03)
}

.mobile-header .mobile-search-wrapper.is-open {
	left: 0;
	visibility: visible
}

.mobile-header .mobile-search-wrapper .cancel-button {
	font-size: 14px;
	line-height: 120%;
	letter-spacing: .01em;
	margin-right: 8px
}

.mobile-header .mobile-search-wrapper>form {
	margin-left: 8px
}

@media (min-width: 568px) {
	.mobile-header {
		display: none
	}
}

.modal-container,
.modal-overlay {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0
}

.modal-container {
	z-index: 12;
	display: flex
}

.modal-container[aria-hidden=true] {
	display: none
}

.modal-container .button-close {
	--button-height: 30px;
	background-color: transparent;
	border-color: transparent;
	position: relative;
	align-self: flex-end;
	border-radius: 50%;
	padding: 0
}

.modal-container .button-close:is(:hover, :focus) {
	color: var(--color-gray-2)
}

.modal-container .button-close:active {
	color: var(--color-gray-3)
}

.modal-container .button-close svg {
	display: block;
	height: 100%;
	aspect-ratio: 1
}

.modal-overlay {
	background-color: #0006;
	-webkit-backdrop-filter: blur(15px);
	backdrop-filter: blur(15px);
	animation: fade-in .2s both
}

.modal-inner {
	display: flex;
	flex-direction: column;
	margin: auto;
	z-index: 2;
	position: relative;
	animation: fade-in .4s .2s both, slide-up .4s .2s both;
	pointer-events: none
}

.modal-inner>* {
	pointer-events: auto
}

@keyframes fade-in {
	0% {
		opacity: 0
	}
}

@keyframes slide-up {
	0% {
		transform: translateY(10%)
	}
}

@media (prefers-reduced-motion: reduce) {

	.dialog-overlay,
	.dialog-content {
		animation: none
	}
}

.mobile-nav-menu {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 13
}

.mobile-nav-menu .nav-overlay {
	content: "";
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: #000c;
	z-index: -1;
	pointer-events: none
}

.mobile-nav-menu .nav-container {
	width: 100%;
	max-width: 327px;
	height: 100%;
	overflow-y: auto;
	padding: 20px;
	background-color: #101113
}

.mobile-nav-menu .nav-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	min-height: 56px
}

.mobile-nav-menu .nav-header div {
	display: flex;
	align-items: center
}

.mobile-nav-menu .nav-header div a {
	margin-right: 12px
}

.mobile-nav-menu .nav-header button:first-child {
	padding: 8px 8px 8px 0
}

.nav-menu {
	width: 100%;
	color: #fff
}

.nav-menu .nav-items {
	display: flex;
	flex-direction: column;
	width: 100%;
	padding: 40px 0;
	border-bottom: 1px solid rgba(255, 255, 255, .1);
	border-top: 1px solid rgba(255, 255, 255, .1)
}

.nav-menu .nav-items .nav-item {
	width: 100%;
	max-width: 192px;
	padding-bottom: 8px
}

.nav-menu .nav-items .nav-item.active a {
	background: #eb1a26
}

.nav-menu .nav-items .nav-item a {
	font-size: 16px;
	line-height: 26px;
	font-weight: 500;
	display: flex;
	border-radius: 16px;
	padding: 16px 0
}

.nav-menu .nav-items .nav-item a:hover {
	background: #eb1a26
}

.nav-menu .nav-items .nav-item a svg {
	margin: 0 16px
}

.nav-menu .second-nav-items {
	display: flex;
	flex-direction: column;
	width: 100%;
	padding-top: 40px
}

.nav-menu .second-nav-items .second-nav-item {
	width: 100%;
	max-width: 192px;
	padding-bottom: 8px
}

.nav-menu .second-nav-items .second-nav-item a {
	font-size: 16px;
	line-height: 26px;
	font-weight: 500;
	display: flex;
	padding-bottom: 16px
}

.nav-menu .second-nav-items .second-nav-item a:hover {
	color: #eb1a26
}

.nav-menu h3 {
	font-size: 16px;
	font-style: normal;
	font-weight: 700;
	line-height: 18px;
	letter-spacing: .16px;
	padding: 40px 0 24px
}

.nav-menu .with-us {
	color: #eb1a26
}

@media (min-width: 568px) {
	.nav-menu .nav-items {
		border-top: none
	}
}

.online-radio-block {
	--card-spacing: 8px
}

.online-radio-block .cards-row {
	display: flex;
	transition: all .3s cubic-bezier(.68, -.1, .65, 1.03)
}

.online-radio-block .cards-row.keen-slider {
	overflow: visible
}

@media (max-width: 768px) {
	.online-radio-block .tab-list {
		display: none
	}
}

.online-radio-block .simple-card {
	min-width: var(--card-width);
	max-width: var(--card-width)
}

.online-radio-block .simple-card:not(:last-child) {
	min-width: calc(var(--card-width) + var(--card-spacing));
	max-width: calc(var(--card-width) + var(--card-spacing));
	padding-right: var(--card-spacing)
}

@media (min-width: 568px) {
	.online-radio-block {
		--card-spacing: 16px
	}

	.online-radio-block .cards-container {
		position: relative
	}

	.online-radio-block .cards-container:before {
		content: "";
		display: block;
		position: absolute;
		left: calc(var(--container-padding-inline) * -1);
		height: 100%;
		width: var(--container-padding-inline);
		background: linear-gradient(90deg, #151719, #151719 8%, #151719b3 45%, #15171900);
		z-index: 1
	}
}

.playback-controls {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 40px;
	color: #fff
}

.playback-controls button {
	transition: color .1s ease
}

.playback-controls button:hover {
	color: #f3e5e5
}

.playback-controls button:active {
	color: #807a77
}

.playback-controls .play-button {
	height: 48px;
	width: 48px
}

.podcast-card {
	display: flex;
	flex-direction: column;
	gap: 8px;
	min-width: min(335px, 100%);
	padding: 12px;
	border-radius: 16px;
	background: #ffffff1a;
	-webkit-backdrop-filter: blur(40px);
	backdrop-filter: blur(40px);
	color: #fff
}

.podcast-card .image-wrapper {
	display: grid;
	grid-template-areas: "content";
	flex-shrink: 0
}

.podcast-card img {
	grid-area: content;
	width: 100%;
	aspect-ratio: 16/9;
	-o-object-fit: cover;
	object-fit: cover;
	-o-object-position: center;
	object-position: center;
	border-radius: 8px
}

.podcast-card .title {
	font-weight: 700;
	letter-spacing: .16px;
	text-align: left
}

.podcast-card .description-wrapper {
	display: none
}

.podcast-card .card-footer {
	font-size: 12px;
	line-height: 120%;
	letter-spacing: .12px;
	display: flex;
	gap: 8px;
	justify-content: space-between;
	align-items: center
}

.podcast-card .card-footer strong {
	line-height: 120%
}

.podcast-card .icons {
	display: flex;
	gap: 16px
}

.podcast-card .icons svg {
	width: 16px;
	height: 16px
}

@media (min-width: 568px) {
	.podcast-card {
		min-width: 205px;
		border-radius: 12px;
		padding: 10px 8px 12px;
		gap: 0
	}

	.podcast-card .image-wrapper {
		margin-bottom: 12px
	}

	.podcast-card img {
		aspect-ratio: 1;
		border-radius: 8px
	}

	.podcast-card .title {
		font-size: 16px;
		line-height: 120%;
		letter-spacing: .16px;
		display: block;
		margin-bottom: 12px;
		font-weight: 700
	}

	.podcast-card .description-wrapper {
		display: block;
		margin-top: auto;
		margin-bottom: 8px
	}

	.podcast-card .description {
		font-size: 13px;
		line-height: 120%;
		letter-spacing: .13px;
		margin-top: auto;
		overflow: hidden;
		color: #b1b1b1;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 4;
		white-space: pre-wrap;
		font-weight: 400
	}

	.podcast-card .icons {
		gap: 8px
	}

	.podcast-card.is-featured {
		max-width: 426px;
		padding: 12px;
		border-radius: 16px
	}

	.podcast-card.is-featured img {
		aspect-ratio: 16/9
	}

	.podcast-card.is-featured .title {
		font-size: 24px;
		line-height: 120%;
		letter-spacing: .24px;
		margin-bottom: 0
	}

	.podcast-card.is-featured .description-wrapper {
		margin-bottom: 12px
	}

	.podcast-card.is-featured .description {
		-webkit-line-clamp: 2
	}

	.podcast-card.is-featured .card-footer {
		font-size: 16px;
		line-height: 140%;
		letter-spacing: .16px
	}

	.podcast-card.is-featured .icon {
		width: 24px;
		height: 24px
	}
}

.podcasts-slider .cards-row {
	display: flex;
	transition: all .3s cubic-bezier(.68, -.1, .65, 1.03)
}

.podcasts-slider .cards-row.keen-slider {
	overflow: visible
}

.podcasts-slider .dots {
	display: flex;
	gap: 8px;
	padding-top: 12px;
	justify-content: center
}

.podcasts-slider .dot {
	border: none;
	width: 8px;
	height: 8px;
	background: #fff6;
	border-radius: 50%;
	cursor: pointer;
	transition: background .3s cubic-bezier(.68, -.1, .65, 1.03)
}

.podcasts-slider .dot:focus {
	outline: none
}

.podcasts-slider .dot.active {
	background: #fff
}

@media (min-width: 568px) {
	.podcasts-slider {
		--card-spacing: 16px;
		--card-max-width: 205px
	}

	.podcasts-slider .cards-container {
		position: relative
	}

	.podcasts-slider .cards-container:before {
		content: "";
		display: block;
		position: absolute;
		left: calc(var(--container-padding-inline) * -1);
		height: 100%;
		width: var(--container-padding-inline);
		background: linear-gradient(90deg, #151719, #151719 8%, #151719b3 45%, #15171900);
		z-index: 1
	}

	.podcasts-slider .slide-wrapper {
		max-width: calc(var(--card-max-width) + var(--card-spacing));
		padding-right: var(--card-spacing)
	}

	.podcasts-slider .slide-wrapper.has-featured {
		--card-max-width: 426px;
		flex-shrink: 0
	}

	.podcasts-slider .podcast-card {
		height: 100%
	}
}

.volume-slider,
.seek-slider {
	display: flex;
	align-items: center;
	gap: 16px
}

.volume-slider svg,
.seek-slider svg {
	flex-shrink: 0
}

.volume-slider .range-slider,
.seek-slider .range-slider {
	flex: 1 1 100vw;
	min-width: 80px;
	max-width: 240px
}

@media (max-width: 768px) {

	.volume-slider .range-slider .thumb,
	.seek-slider .range-slider .thumb {
		transform: translate(-50%, -50%) scale(1)
	}
}

.seek-slider {
	color: #807a77;
	line-height: 140%;
	justify-content: center
}

.seek-slider .time-progress,
.seek-slider .time-max {
	display: flex;
	min-width: 6ch;
	justify-content: flex-start
}

.seek-slider .time-progress {
	justify-content: flex-end
}

.volume-slider>button>svg[disabled=true] {
	opacity: .5
}

.sidebar {
	display: none
}

.sidebar .logo {
	text-align: center
}

.sidebar-toggle {
	display: none
}

@media (min-width: 568px) {
	.sidebar {
		display: block;
		position: relative;
		align-self: stretch;
		background: #151719bf;
		color: #fff;
		width: 100%;
		max-width: 272px;
		height: auto;
		padding: 40px 40px 0
	}

	.burger {
		display: none
	}
}

@media (min-width: 568px) and (max-width: 1024px) {
	.sidebar {
		position: fixed;
		top: 0;
		left: 0;
		bottom: 0;
		transform: translate(-100%);
		transition: all .3s cubic-bezier(.68, -.1, .65, 1.03);
		z-index: 1
	}

	.sidebar .inner {
		height: calc(100% - 110px);
		overflow-y: auto
	}

	.sidebar.is-expanded {
		transform: translate(0);
		box-shadow: 0 -2px 12px #807a7740
	}

	.sidebar-toggle {
		display: flex;
		align-items: center;
		justify-content: center;
		position: absolute;
		top: 50%;
		right: -40px;
		transform: translateY(-50%);
		padding: 8px;
		background-color: red;
		border-radius: 0 8px 8px 0
	}

	.sidebar-toggle svg {
		height: 24px;
		width: 24px
	}
}

@media (min-width: 1024px) {
	.sidebar {
		border-radius: 16px;
		padding-bottom: 90px
	}
}

.simple-card {
	--card-width: 163px;
	--card-subtitle-height: 18px;
	display: flex;
	flex-direction: column;
	gap: 12px;
	width: var(--card-width);
	cursor: pointer
}

.simple-card .card-head {
	display: flex;
	flex-direction: column;
	aspect-ratio: 1;
	border-radius: 8px;
	overflow: hidden;
	isolation: isolate;
	position: relative
}

.simple-card .card-head .head-title {
	margin-top: 8px;
	text-align: center
}

.simple-card .card-head .head-content {
	position: relative;
	flex: 1;
	margin-top: 8px
}

.simple-card .card-head .image-frame {
	position: absolute;
	height: 100%;
	width: 100%;
	z-index: -1
}

.simple-card .card-head .image-frame img {
	-o-object-fit: cover;
	object-fit: cover;
	-o-object-position: center;
	object-position: center
}

.simple-card .pillar-primary,
.simple-card .pillar-secondary {
	position: absolute;
	bottom: 0;
	border-radius: 6px 6px 0 0
}

.simple-card .pillar-primary {
	top: 0;
	left: 12px;
	width: 58%;
	z-index: 2;
	background-color: #eb1a26
}

.simple-card .pillar-primary:after {
	content: "";
	display: block;
	position: absolute;
	top: 8px;
	right: -4px;
	height: 100%;
	width: 4px;
	background-color: #1c1a19;
	opacity: .6
}

.simple-card .pillar-secondary {
	top: 8px;
	right: 12px;
	width: 50%;
	z-index: 1;
	overflow: hidden;
	background-color: #00c
}

.simple-card .pillar-secondary img {
	height: 100%;
	width: auto;
	-o-object-position: center;
	object-position: center;
	-o-object-fit: cover;
	object-fit: cover
}

.simple-card .logo {
	position: absolute;
	top: 30%;
	max-width: 100%;
	padding-inline: 12px;
	-o-object-fit: contain;
	object-fit: contain;
	-o-object-position: center;
	object-position: center
}

.simple-card .station-row {
	text-align: center
}

.simple-card .parent {
	line-height: 140%
}

.simple-card .station {
	font-size: 24px;
	line-height: 100%;
	letter-spacing: .01em
}

.simple-card .icon-wrapper {
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	bottom: 8px;
	left: 8px;
	width: 30%;
	aspect-ratio: 1;
	border-radius: 50%
}

.simple-card .icon-wrapper.full-size {
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: auto;
	margin: auto 12px
}

.simple-card .icon-wrapper.full-size .head-icon {
	width: 52%
}

.simple-card .icon {
	width: 71%;
	aspect-ratio: 1
}

.simple-card .title {
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	white-space: pre-wrap;
	font-weight: 700;
	margin-bottom: 4px
}

.simple-card .subtitle {
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	white-space: pre-wrap;
	height: var(--card-subtitle-height);
	line-height: 140%;
	color: #807a77
}

@media (min-width: 568px) {
	.simple-card {
		--card-width: 205px
	}
}

.source-details-block {
	background-color: #ffffff1a;
	-webkit-backdrop-filter: blur(40px);
	backdrop-filter: blur(40px);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	border-radius: 8px;
	line-height: 140%
}

.source-details-block strong {
	line-height: 120%
}

.source-details-block .details-top,
.source-details-block .details-bottom {
	display: flex;
	align-items: center;
	min-height: 72px
}

.source-details-block .details-bottom {
	padding: 24px;
	gap: 16px;
	justify-content: space-between
}

.source-details-block .details-main {
	position: relative;
	flex: 1
}

.source-details-block .details-main .image-frame {
	height: 100%
}

.source-details-block .details-main .image-frame img {
	width: 100%;
	height: 100%;
	-o-object-fit: contain;
	object-fit: contain;
	-o-object-position: center;
	object-position: center
}

.source-details-block .details-image {
	width: 100%;
	height: auto
}

.source-details-block .top-content {
	display: flex;
	align-items: center;
	width: 100%;
	gap: 16px;
	padding-inline: 24px
}

.source-details-block .top-content img,
.source-details-block .top-content svg {
	height: 24px;
	width: 24px
}

.source-details-block .channel-icon {
	color: #eb1a26
}

.source-details-block .top-actions {
	margin-left: auto;
	display: flex
}

.source-details-block .top-actions .button-share {
	margin-left: 8px
}

.source-details-block .top-logo {
	display: flex;
	align-items: center;
	align-self: stretch;
	margin-left: auto;
	padding-inline: 12px;
	width: 72px;
	flex-shrink: 0
}

.source-details-block .top-logo img,
.source-details-block .top-logo svg {
	width: 100%;
	height: auto
}

.source-details-block .info-column {
	display: flex;
	flex-direction: column;
	gap: 4px
}

.source-details-block .date {
	font-size: 12px;
	color: #9fa2a8
}

.source-details-block .date strong {
	color: #fff
}

.source-details-block .vote-buttons {
	margin-left: auto
}

@media (min-width: 568px) {
	.source-details-block .details-top {
		font-size: 16px;
		line-height: 18px;
		letter-spacing: .01em
	}

	.source-details-block .details-top strong {
		font-size: 24px;
		line-height: 24px;
		letter-spacing: .01em
	}

	.source-details-block .details-bottom {
		font-size: 16px;
		line-height: 120%;
		letter-spacing: .01em;
		color: #9fa2a8
	}

	.source-details-block .details-bottom strong {
		font-size: 24px;
		color: #fff
	}

	.source-details-block .date {
		font-size: 16px;
		padding-top: 4px
	}

	.source-details-block .date strong {
		font-size: inherit
	}
}

.source-list {
	--mask-image-content: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 2%, rgba(0, 0, 0, 1) 88%, rgba(0, 0, 0, 0) 100%);
	display: flex;
	gap: 24px;
	margin-top: -2%;
	padding-top: 2%;
	overflow: hidden;
	-webkit-mask-image: var(--mask-image-content);
	mask-image: var(--mask-image-content)
}

.source-list:not(:has(.keen-slider)) {
	-webkit-mask-image: none;
	mask-image: none
}

.source-list .list:not(.keen-slider) {
	--mask-image-content: none;
	display: flex;
	flex-direction: column;
	gap: 8px
}

.source-list .list.keen-slider {
	max-width: 648px;
	max-height: 572px;
	overflow: visible
}

.source-list .list-item {
	display: flex;
	align-items: center;
	gap: 12px;
	flex: 1 1 100%;
	padding: 9px 12px 9px 9px;
	border-radius: 8px;
	background-color: #ffffff1a;
	height: 80px
}

.source-list .list-item .image-frame {
	flex: 1 1 100%;
	max-width: 64px;
	align-self: flex-start;
	border-radius: 4px;
	height: 100%;
	flex-shrink: 0
}

.source-list .list-item .image-frame img {
	width: 100%;
	aspect-ratio: 1;
	-o-object-position: center;
	object-position: center;
	-o-object-fit: cover;
	object-fit: cover
}

.source-list .list-item .duration {
	margin-left: auto
}

.source-list .info {
	display: flex;
	flex-direction: column;
	gap: 4px
}

.source-list .info .subtitle {
	color: #9fa2a8;
	line-height: 18px
}

@media (max-width: 768px) {
	.source-list .info {
		flex-direction: row
	}
}

@media (max-width: 400px) {
	.source-list .info>div:last-child {
		display: none
	}
}

.source-list .play-button[disabled] {
	opacity: .3;
	pointer-events: none
}

.source-list .dots {
	display: flex;
	flex-direction: column;
	gap: 12px;
	justify-content: center
}

.source-list .dot {
	border: none;
	width: 12px;
	height: 12px;
	background: #fff6;
	border-radius: 50%;
	cursor: pointer;
	transition: background .3s cubic-bezier(.68, -.1, .65, 1.03)
}

.source-list .dot:focus {
	outline: none
}

.source-list .dot.active {
	background: #fff
}

.star-rating {
	--item-spacing: 8px;
	display: flex;
	margin-bottom: 12px;
	margin-inline: calc(var(--item-spacing) * -.5)
}

.star-rating button {
	height: 24px;
	width: 32px;
	padding-inline: calc(var(--item-spacing) * .5)
}

.star-rating button .center,
.star-rating button .outline {
	transition: all .3s cubic-bezier(.68, -.1, .65, 1.03)
}

.star-rating button.is-filled .center {
	fill: #fff
}

.star-rating button:hover .outline,
.star-rating button:hover .center,
.star-rating button:has(~button:hover) .outline,
.star-rating button:has(~button:hover) .center {
	fill: #eb1a26
}

.v-popper--theme-dropdown .v-popper__inner {
	max-width: 260px;
	width: 100%;
	padding: 24px;
	border: none;
	border-radius: 16px;
	background: #2c2e30;
	color: #fff
}

.v-popper--theme-dropdown .v-popper__arrow-outer {
	border-color: #2c2e30
}

.v-popper--theme-dropdown .v-popper__arrow-inner {
	border-color: transparent
}

.v-popper--theme-dropdown.v-popper__popper--show-from {
	transition: none
}

.channel-dropdown .dropdown-top {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	padding-bottom: 16px;
	border-bottom: 1px solid rgba(255, 255, 255, .4)
}

.channel-dropdown .dropdown-top .icon {
	color: #eb1a26
}

.channel-dropdown .channel-info {
	display: flex;
	gap: 8px;
	align-items: center;
	font-weight: 700
}

.channel-dropdown .dropdown-body {
	padding-top: 16px
}

.video-modal .modal-inner {
	margin-top: min(152px, 10dvh);
	width: 100vw;
	max-width: 1102px;
	margin-inline: auto;
	padding-inline: var(--container-padding-inline)
}

.video-modal .button-close {
	margin-bottom: 64px
}

.video-modal .modal-content {
	width: 100%
}

.video-modal .video-container {
	max-width: 100%;
	border-radius: 16px
}

@media (min-width: 568px) {
	.video-modal .modal-inner {
		padding-inline: 56px
	}

	.video-modal .button-close {
		margin-bottom: 0;
		translate: 100%
	}
}

.vote-buttons {
	display: flex;
	align-items: center;
	gap: 16px;
	color: #fff
}

.vote-buttons button.active {
	color: #eb1a26
}

.mobile-bottom-menu {
	display: block;
	position: fixed;
	width: 100%;
	height: var(--bottom-menu-height);
	left: 0;
	bottom: 0;
	z-index: 10;
	padding: 16px;
	background: #000
}

.mobile-bottom-menu ul {
	display: flex;
	justify-content: space-evenly
}

.mobile-bottom-menu__item-link {
	display: flex;
	flex-direction: column;
	align-items: center
}

.mobile-bottom-menu__item-link svg {
	margin-bottom: 8px
}

.mobile-bottom-menu__item.active path {
	fill: #eb1a26;
	stroke: #eb1a26
}

.mobile-bottom-menu__item.active span {
	color: #eb1a26
}

@media screen and (min-width: 568px) {
	.mobile-bottom-menu {
		display: none
	}
}

.top-bar {
	display: none
}

@media (min-width: 568px) {
	.top-bar {
		display: flex;
		align-items: center;
		-moz-column-gap: 20px;
		column-gap: 20px;
		height: 44px;
		margin-bottom: 40px
	}

	.top-bar .button-cta {
		white-space: nowrap
	}
}

.two-column-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(164px, auto));
	gap: 8px
}

.podcast-block {
	display: flex;
	flex-direction: column;
	row-gap: 8px;
	background: #ffffff1a;
	padding: 8px;
	border-radius: 12px
}

.podcast-block h4 {
	font-size: 14px;
	line-height: 120%;
	letter-spacing: .01em
}

.podcast-block .button {
	width: 100%;
	margin-top: auto
}

.podcast-block .image-frame {
	aspect-ratio: 1
}

.podcast-block img {
	border-radius: 8px;
	-o-object-fit: cover;
	object-fit: cover;
	-o-object-position: center;
	object-position: center
}

.podcast-block .published {
	margin-bottom: 16px;
	font-size: 12px;
	line-height: 18px;
	letter-spacing: .01em
}

.podcast-block .published span {
	font-weight: 700
}

.latest-podcasts {
	display: flex;
	flex-direction: column;
	row-gap: 23px
}

.latest-podcasts .heading {
	display: flex;
	-moz-column-gap: 16px;
	column-gap: 16px;
	align-items: center
}

.latest-podcasts .heading svg {
	color: #fff
}

.latest-podcasts .two-column-grid>.podcast-block>.image-frame {
	background: transparent
}

.search-form {
	width: 100%;
	background: #2c2e30;
	display: flex;
	border-radius: 8px
}

.search-form button[type=submit] {
	overflow: hidden;
	width: 40px;
	padding: 0;
	margin: 0;
	border: 1px solid transparent;
	border-radius: inherit;
	background: transparent url(/build/assets/search-DKqkst9_.svg) no-repeat center;
	cursor: pointer;
	opacity: .7
}

.search-form button[type=submit]:hover {
	opacity: 1
}

.search-form button[type=submit]:focus {
	outline: none
}

.search-form input[type=search] {
	/*height: 44px;*/
	width: 100%;
	/*background: #2c2e30;*/
	height: calc(1.5em + .5rem + 2px);
	background-color: #eeeeee;
	border: 1px solid #eeeeee;
	border-radius: 8px;
	padding-left: 12px;
	color: #2c2e30;
	font-size: 16px;
	line-height: 18px;
	letter-spacing: .01em;
	font-family: Galano Grotesque, Montserrat, sans-serif
}

.search-form input[type=search]::-webkit-search-cancel-button {
	-webkit-appearance: none;
	height: 24px;
	width: 24px;
	background: url('data:image/svg+xml; utf8, <svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg"><path id="Vector" d="M8.75 8.75L21.25 21.25M8.75 21.25L21.25 8.75" stroke="grey" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"/></svg>') no-repeat;
	background-size: contain;
	pointer-events: none;
	cursor: pointer
}

.search-form input[type=search]:focus::-webkit-search-cancel-button {
	pointer-events: all
}

.search-form input[type=search]:focus {
	outline: none
}

/*.dropdown {
	--toggle-padding: 0 4px 0 0;
	--items-height: 24px;
	position: relative;
	display: flex;
	cursor: pointer
}

.dropdown .dropdown-toggle {
	display: flex;
	align-items: center;
	flex: 1;
	white-space: nowrap;
	height: var(--items-height);
	padding: var(--toggle-padding);
	justify-content: space-between;
	font-size: 16px;
	line-height: 22px;
	letter-spacing: .01em;
	z-index: 5000;
}

.dropdown .dropdown-toggle[aria-expanded=true]+.dropdown-content {
	display: flex
}

.dropdown .dropdown-toggle:has(svg.arrow-down) {
	-moz-column-gap: 8px;
	column-gap: 8px
}

.dropdown .dropdown-toggle:has(svg.arrow-down) svg.arrow-down {
	transition: transform .3s cubic-bezier(.68, -.1, .65, 1.03)
}

.dropdown .dropdown-toggle:has(svg.arrow-down)[aria-expanded=true] svg.arrow-down {
	transform: rotate(180deg)
}

.dropdown-content {
	position: absolute;
	flex-direction: column;
	top: calc(var(--items-height) + 4px);
	width: 100%;
	overflow: hidden;
	z-index: 3000;
	display: none;
	background: #2c2e30;
	border-radius: 4px
}

.dropdown-content .dropdown-item {
	display: flex;
	width: 100%;
	cursor: pointer;
	transition: background-color .3s cubic-bezier(.68, -.1, .65, 1.03);
	padding: 4px 8px;
	align-items: center;
	justify-content: center;
	font-size: 16px;
	line-height: 22px;
	letter-spacing: .01em
}

.dropdown-content .dropdown-item.active,
.dropdown-content .dropdown-item:hover {
	background-color: #344559
}

.dropdown-profile .dropdown-content {
	padding: 24px;
	top: calc(var(--items-height) + 20px);
	min-width: 300px;
	right: -10px;
	border-radius: 16px
}

.dropdown-profile .dropdown-content h4 {
	font-size: 16px;
	line-height: 120%;
	letter-spacing: .01em;
	font-weight: 500
}

.dropdown-profile .dropdown-content hr {
	opacity: .4
}

.dropdown-profile .social-wrapper {
	display: flex;
	flex-direction: column;
	gap: 10px
}

.dropdown-profile .social-wrapper .social-links {
	display: flex;
	align-items: center
}

.dropdown-profile .social-wrapper .social-links svg {
	width: 22px;
	height: 22px
}

.dropdown-profile .profile-wrapper {
	display: flex;
	flex-direction: column;
	gap: 10px
}

.dropdown-profile .profile-wrapper .profile-links {
	display: flex;
	flex-direction: column;
	row-gap: 8px
}

.dropdown-profile .profile-wrapper .profile-links a {
	width: 100%;
	text-align: center;
	padding: var(--button-padding-block) 16px
}*/

.podcast-wide-block {
	display: grid;
	grid-template-areas: "image content""footer footer";
	grid-template-columns: 80px auto;
	grid-template-rows: 80px 1fr;
	border-radius: 16px;
	padding: 8px;
	background: #ffffff1a;
	gap: 8px
}

.podcast-wide-block.transparent {
	padding: unset;
	background: transparent
}

.podcast-wide-block .block-image {
	grid-area: image;
	height: 80px;
	border-radius: 4px
}

.podcast-wide-block .block-image img {
	-o-object-fit: cover;
	object-fit: cover;
	-o-object-position: center;
	object-position: center
}

.podcast-wide-block .block-content {
	grid-area: content;
	display: flex;
	flex-direction: column;
	row-gap: 6px
}

.podcast-wide-block .block-content .title {
	font-size: 14px;
	line-height: 120%;
	letter-spacing: .01em;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	white-space: pre-wrap;
	word-break: break-all;
	font-weight: 700;
	width: -moz-fit-content;
	width: fit-content
}

.podcast-wide-block .block-content .description {
	font-size: 12px;
	line-height: 18px;
	letter-spacing: .01em;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	white-space: pre-wrap
}

.podcast-wide-block .block-content .richtext p {
	margin-bottom: unset
}

.podcast-wide-block .block-content .star-rating {
	margin: revert
}

.podcast-wide-block .block-footer {
	grid-area: footer;
	display: flex;
	row-gap: 8px;
	flex-direction: column-reverse
}

.podcast-wide-block .block-footer .button {
	width: 100%
}

.podcast-wide-block .block-footer .footer-details {
	display: flex;
	justify-content: space-between;
	align-items: center
}

.podcast-wide-block .block-footer .published {
	font-size: 12px;
	line-height: 18px;
	letter-spacing: .01em
}

.podcast-wide-block .block-footer .published span {
	font-weight: 700
}

.podcast-wide-block .block-footer .podcast-types {
	display: flex;
	-moz-column-gap: 16px;
	column-gap: 16px
}

@media (max-width: 768px) {
	.podcast-wide-block .star-rating {
		--item-spacing: 4px
	}

	.podcast-wide-block .star-rating svg {
		width: 16px;
		height: 16px
	}

	.podcast-wide-block .star-rating>* {
		height: 16px;
		width: revert
	}

	.podcast-wide-block.size-large {
		display: flex;
		flex-direction: column
	}

	.podcast-wide-block.size-large .block-image {
		height: unset;
		border-radius: 16px;
		margin-bottom: 3px
	}

	.podcast-wide-block.size-large .block-image img {
		aspect-ratio: 16/9
	}

	.podcast-wide-block.size-large .block-content .title {
		font-size: 16px;
		line-height: 120%;
		letter-spacing: .01em
	}

	.podcast-wide-block.size-large .block-footer {
		row-gap: 17px
	}
}

@media (min-width: 568px) {
	.podcast-wide-block {
		grid-template-areas: "image content""image footer";
		grid-template-columns: 200px auto;
		grid-template-rows: 1fr;
		padding: 12px;
		-moz-column-gap: 16px;
		column-gap: 16px
	}

	.podcast-wide-block.size-large {
		grid-template-columns: 320px auto
	}

	.podcast-wide-block.size-large .block-content .title {
		font-size: 24px;
		line-height: 120%;
		letter-spacing: .01em
	}

	.podcast-wide-block.size-large .block-content .description {
		overflow: hidden;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 8;
		white-space: pre-wrap
	}

	.podcast-wide-block.size-large .block-image {
		height: 320px;
		border-radius: 16px
	}

	.podcast-wide-block .block-content {
		row-gap: 8px
	}

	.podcast-wide-block .block-content .title {
		font-size: 16px;
		line-height: 120%;
		letter-spacing: .01em
	}

	.podcast-wide-block .block-content .description {
		font-size: 16px;
		line-height: 140%;
		letter-spacing: .01em;
		overflow: hidden;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 3;
		white-space: pre-wrap
	}

	.podcast-wide-block .block-image {
		height: 200px;
		border-radius: 8px
	}

	.podcast-wide-block .block-footer {
		flex-direction: row;
		-moz-column-gap: 24px;
		column-gap: 24px;
		align-self: flex-end
	}

	.podcast-wide-block .block-footer .button {
		width: unset
	}

	.podcast-wide-block .block-footer .footer-details {
		width: 100%
	}

	.podcast-wide-block .block-footer .podcast-types {
		-moz-column-gap: 24px;
		column-gap: 24px
	}
}

@media (min-width: 568px) and (min-width: 568px) and (max-width: 1140px) {
	.podcast-wide-block .block-footer {
		flex-wrap: wrap-reverse
	}

	.podcast-wide-block .block-footer .button {
		width: 100%
	}
}

.arrow-slider .inner {
	position: relative
}

.arrow-slider .inner>.dots {
	position: absolute;
	top: 18px;
	left: 50%;
	transform: translate(-50%);
	padding: unset
}

.arrow-slider .dots {
	display: flex;
	gap: 8px;
	padding-top: 12px;
	justify-content: center
}

.arrow-slider .dots .dot {
	border: none;
	width: 8px;
	height: 8px;
	background: #fff6;
	border-radius: 50%;
	cursor: pointer;
	transition: background .3s cubic-bezier(.68, -.1, .65, 1.03)
}

.arrow-slider .dots .dot:focus {
	outline: none
}

.arrow-slider .dots .dot.active {
	background: #fff
}

.arrow-slider .arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	fill: #fff;
	cursor: pointer
}

.arrow-slider .arrow-left {
	left: 16px
}

.arrow-slider .arrow-right {
	left: auto;
	right: 16px
}

.arrow-slider .arrow-disabled {
	color: gray
}

@media (min-width: 568px) {
	.arrow-slider>.dots {
		padding-top: 36px
	}
}

.banner-container {
	width: 100%;
	position: relative;
	aspect-ratio: 1/1
}

.banner-container button,
.banner-container a>img {
	position: absolute;
	width: 100%;
	-o-object-fit: cover;
	object-fit: cover;
	-o-object-position: center;
	object-position: center;
	border-radius: 8px
}

.banners-podcasts {
	display: flex;
	flex-direction: column;
	row-gap: 16px
}

@media (min-width: 568px) {
	.banners-podcasts .banner-container>a>img {
		border-radius: 16px
	}
}

.article-banner-block .block-container {
	display: flex;
	flex-direction: column;
	gap: 24px
}

.article-banner-block .banner-container {
	display: none
}

.article-banner-block .arrow-slider,
.article-banner-block .arrow-slider .slider-track {
	overflow: visible
}

.article-banner-block .arrow-slider .slider-track .inner {
	height: 188px
}

.article-banner-block .new-tag {
	--button-height: 32px;
	--button-padding-inline: 12px;
	border-radius: 118px
}

@media (min-width: 568px) {
	.article-banner-block .block-container:has(>:last-child:nth-child(2)) {
		display: grid;
		grid-template-columns: 2fr 1fr
	}

	.article-banner-block .banner-container {
		display: block;
		height: 352px;
		min-width: 352px
	}

	.article-banner-block .arrow-slider,
	.article-banner-block .arrow-slider .slider-track {
		overflow: hidden
	}

	.article-banner-block .arrow-slider .slider-track .inner {
		height: 352px
	}

	.article-banner-block .arrow-slider .slider-track .inner>.dots {
		gap: 12px;
		top: unset;
		transform: unset;
		left: 32px;
		bottom: 116px
	}

	.article-banner-block .arrow-slider .slider-track .inner>.dots .dot {
		width: 12px;
		height: 12px
	}

	.article-banner-block .new-tag {
		--button-height: 36px;
		border-radius: 120px
	}
}

.background-image-card {
	position: relative;
	overflow: hidden;
	display: flex;
	height: inherit;
	border-radius: 8px
}

.background-image-card .image-frame {
	height: 100%;
	width: 100%
}

.background-image-card .image-frame:after {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	display: inline-block;
	background: linear-gradient(to bottom, #0000 20%, #00000080 50%)
}

.background-image-card .card-thumbnail {
	position: relative;
	overflow: hidden;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%
}

.background-image-card .card-thumbnail img {
	-o-object-fit: cover;
	object-fit: cover;
	-o-object-position: center;
	object-position: center
}

.background-image-card .card-thumbnail>a {
	width: 100%;
	height: 100%
}

.background-image-card .card-info {
	position: absolute;
	left: 16px;
	bottom: 24px
}

.background-image-card .card-info h2 {
	margin-bottom: 4px
}

.background-image-card .card-info h2,
.background-image-card .card-info p {
	text-transform: uppercase;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	white-space: pre-wrap
}

.background-image-card .top-left {
	position: absolute;
	top: 16px;
	right: 16px
}

@media (min-width: 568px) {
	.background-image-card .card-info {
		position: absolute;
		left: 32px;
		bottom: 32px
	}

	.background-image-card .card-info h2 {
		font-size: 32px;
		line-height: 120%;
		letter-spacing: .01em
	}

	.background-image-card .card-info p {
		font-size: 18px;
		line-height: 140%;
		letter-spacing: .01em
	}

	.background-image-card .top-left {
		top: 19px;
		right: 21px
	}
}

.tops-block-content {
	display: flex;
	flex-direction: column;
	row-gap: 19px
}

@media (min-width: 568px) {
	.tops-block-content {
		row-gap: 23px
	}
}

.tops-list-inner {
	display: grid;
	gap: 7px;
	grid-auto-columns: 99px;
	grid-auto-rows: 67px;
	overflow: visible
}

.tops-list.scrollable .tops-list-inner {
	grid-auto-flow: column;
	grid-template-rows: min-content;
	gap: unset
}

.tops-list .image-frame img {
	min-width: unset;
	min-height: unset
}

@media (min-width: 568px) {
	.tops-list .tops-list-inner {
		gap: 12px;
		grid-auto-columns: 205px;
		grid-auto-rows: 90px;
		grid-template-columns: repeat(auto-fit, minmax(205px, 1fr))
	}
}

.top-badge {
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 15px 9px;
	border-radius: 8px;
	background-color: #373737;
	height: 67px
}

.top-badge .image-frame {
	background: transparent
}

.top-badge:hover {
	background-color: #2d2d2d
}

.top-badge img {
	max-height: 41px
}

@media (min-width: 568px) {
	.top-badge {
		height: 90px;
		padding: 12.5px 32px
	}

	.top-badge img {
		max-height: 75px
	}
}

.songs-list {
	display: flex;
	flex-direction: column;
	row-gap: 8px
}

.songs-list-wrapper {
	display: flex;
	flex-direction: column;
	row-gap: 40px
}

.songs-list-wrapper>.button {
	align-self: center
}

@media (max-width: 768px) {
	.songs-list-wrapper>.button {
		width: 100%
	}
}

@media (min-width: 568px) {
	.songs-list {
		row-gap: 16px
	}

	.songs-list.is-compact {
		display: grid;
		grid-template-columns: repeat(2, minmax(530px, 1fr));
		gap: 16px
	}
}

/*.song-card {
	display: flex;
	align-items: center;
	padding: 8px;
	background: #ffffff1a;
	border-radius: 8px
}*/
.song-card {
    position: relative;
    display: flex;
    align-items: center;
	padding: 8px;
	background: #ffffff1a;
	border-radius: 8px
}

.song-card .song-position {
	padding: 12px 8px;
	width: 90px;
	row-gap: 8px;
	display: flex;
	flex-direction: column;
	align-items: center
}

.song-card .song-position:not(:has(svg)) {
	align-self: flex-start
}

.song-card .song-position>p {
	font-size: 24px;
	line-height: 24px;
	letter-spacing: .01em;
	font-weight: 700
}

.song-card .song-position.is-up svg {
	color: #01d4aa
}

.song-card .song-position.is-down svg {
	color: #eb1a26
}

.song-card .song-position.equal svg {
	color: #d9d9d9
}

/*.song-card .song-image {
    width: 30px;
	aspect-ratio: 1;
	margin: 0;
	border-radius: 8px;
	-o-object-fit: cover;
	object-fit: cover;
	-o-object-position: center;
	object-position: center;
	z-index: 1;
}*/
.image-container {
    position: relative;
    width: 60px; /* Adjust to match your image dimensions */
    height: 60px;
}
.song-image {
    width: 100%;
    height: 100%;
    border-radius: 4px; /* Optional for rounded corners */
    display: block;
	-o-object-fit: cover;
	object-fit: cover;
	-o-object-position: center;
	object-position: center;
	z-index: 1;
}

/*.song-card .song-content {
	flex: 1;
	display: flex;
	align-items: center;
}*/
.song-content {
    flex: 1; /* Allow title and artist to take up available space */
    display: flex;
    flex-direction: row;
    justify-content: center;
    margin-right: 10px; /* Add spacing to the right */
}

.song-name, .song-artist {
    margin-left: 10px;
    font-size: 16px;
}

.song-artist {
    margin-left: 5px;
}

.song-card .song-content .song-play {
	grid-area: play
}

.song-card .song-content .song-name {
	grid-area: name;
	font-size: 16px;
	line-height: 120%;
	letter-spacing: .01em;
	font-weight: 700;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	white-space: pre-wrap
}

.song-card .song-content .song-artist {
	grid-area: artist;
	overflow: hidden;
	/*display: -webkit-box;*/
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	white-space: pre-wrap
}

.song-card .song-content .song-length {
	grid-area: length
}

.song-card .song-content .vote-buttons {
	grid-area: vote;
	gap: 8px
}

.song-card .song-content .song-info {
	grid-area: info
}

.song-card .song-content>* {
	margin: 0 4px
}

.song-card .song-content span {
	font-size: 16px;
	line-height: 18px;
	letter-spacing: .01em;
	color: #807a77
}

.song-card .song-content svg {
	min-width: 24px
}

.song-card .song-content>.v-popper {
	display: flex;
	justify-content: end
}

.song-card .song-video {
	position: relative;
	margin-left: 19px;
	display: flex;
	border-radius: 4px;
	overflow: hidden
}

.song-card .song-video button>img {
	margin-top: -18px
}

.song-card .song-video>svg {
	pointer-events: none;
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	margin: auto;
	width: 40px;
	height: 40px
}

.song-card .song-play[disabled] {
	opacity: .3;
	pointer-events: none;
	cursor: not-allowed
}

.play-button {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: rgba(0, 0, 0, 0.5); /* Semi-transparent background */
    border: none;
    color: white;
    border-radius: 50%; /* Circle button */
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background-color 0.3s;
    z-index: 5;
}

.play-button:hover {
    background-color: rgba(0, 0, 0, 0.8); /* Darken on hover */
}

.play-button i {
    font-size: 16px;
}

@media (max-width: 390px) {
    .song-card .song-content .song-name, .song-card .song-content .song-artist {
        font-size:12px;
        text-align: center;
        line-height: 12px;
        display: inline-block;
    }
}

@media (max-width: 600px) {
    .song-card .song-content .song-name, .song-card .song-content .song-artist {
        text-align: center;
        display: inline-block;
    }
    
    .song-card {
        display: flex;
        flex-direction: row; /* Arrange items side by side */
        align-items: center;
        margin: 0;
        max-height: 70.8px; /* Adjust height as needed */
    }

    .song-content {
        display: flex;
        flex-direction: column; /* Stack name, artist, and buttons vertically */
        align-items: flex-start; /* Align items to the left */
        align-items: center;
        width: 100%;
        margin-top: 0;
    }

    .song-name,
    .song-artist {
        margin: 0; /* Remove extra margin */
    }

    .song-artist {
        font-size: 12px;
        margin-top: 5px;
    }

    .vote-buttons {
        display: flex; /* Align vote and play button in a row */
        flex-direction: row; /* Ensure buttons are side by side */
        gap: 10px; /* Add spacing between buttons */
        margin-top: 5px; /* Adjust margin as needed */
    }

    .song-content button {
        width: 30px; /* Adjust button size */
        height: 30px;
        font-size: 16px; /* Adjust font size inside the button */
    }

    .song-video img {
        width: 40px;
        height: 40px;
    }

    .songs-list-wrapper,
    .songs-vote-list {
        row-gap: 4px;
    }

    .vote-buttons input,
    .song-content button {
        transform: scale(0.6); /* Scale buttons for small screens */
    }
}

/*@media (max-width: 768px) {
	.song-card .song-position {
		width: 50px;
		padding: 4px 8px;
		row-gap: 4px
	}

	.song-card .song-image {
		width: 88px
	}

	.song-card .song-content {
		margin-left: 8px
	}

	.song-card .song-video {
		margin-left: 14px;
		width: 160px;
		height: 90px
	}

	.song-card .song-video img {
		margin-top: -15px
	}

	.song-card .song-play {
		margin-left: auto
	}

	.song-card .song-content {
		display: grid;
		grid-template-areas: "name play""artist play""vote play";
		grid-template-columns: auto auto
	}

	.song-card .song-content .vote-buttons {
		margin-top: 8px
	}

	.song-card .song-content .song-length,
	.song-card .song-content .song-info,
	.song-card .song-video {
		display: none
	}
}*/

/*@media (min-width: 568px) {*/
@media (min-width: 600px) {
    .song-card .song-content .song-name, .song-card .song-content .song-artist {
        text-align: center;
        display: inline-block;
    }
    
	.song-card .song-length {
		margin-left: auto
	}

	.song-card .song-artist {
		flex: 1
	}

	.song-card.is-compact .song-position {
		width: 50px;
		padding: 4px 8px;
		row-gap: 4px
	}

	.song-card.is-compact .song-image {
		width: 36px
	}

	.song-card.is-compact .song-content {
		margin-left: 8px
	}

	.song-card.is-compact .song-video {
		margin-left: 14px;
		width: 160px;
		height: 90px
	}

	.song-card.is-compact .song-video img {
		margin-top: -15px
	}

	.song-card.is-compact .song-play {
		margin-left: auto
	}

	.song-card.is-compact .song-content {
		display: grid;
		grid-template-areas: "name name name""artist artist artist""play vote info";
		grid-template-columns: 1fr 1fr 1fr;
		row-gap: 8px;
		margin-left: 16px
	}

	.song-card.is-compact .song-content>* {
		margin: revert
	}

	.song-card.is-compact .song-content .song-length {
		display: none
	}

	.song-card.is-compact .song-content .song-play {
		justify-self: flex-start;
		width: 24px;
		height: 24px
	}

	.song-card.is-compact .song-content .song-play svg {
		width: 24px;
		height: 24px
	}

	.song-card.is-compact .song-content .vote-buttons {
		justify-self: center
	}

	.song-card.is-compact .song-content .vote-buttons button {
		height: 24px
	}

	.song-card.is-compact .song-content .song-info {
		justify-self: flex-end
	}
	
	.song-name, .song-artist{
	    padding-top:10px;
	}
}

.channel-slide {
	padding: 12px 12px 16px;
	border-radius: 16px;
	background-color: #ffffff1a;
	-webkit-backdrop-filter: blur(40px);
	backdrop-filter: blur(40px);
	overflow: hidden
}

.channel-slide .block-image {
	aspect-ratio: 16/9;
	border-radius: 8px;
	margin-bottom: 9px
}

.channel-slide .title {
	font-weight: 700;
	line-height: 120%
}

@media (max-width: 768px) {

	.channel-slide .description-wrapper,
	.channel-slide .button {
		display: none
	}

	.channel-slide .slide-footer {
		margin-top: 5px
	}

	.channel-slide .slide-footer span {
		text-transform: lowercase;
		font-size: 12px;
		line-height: 18px;
		letter-spacing: .01em
	}
}

@media (min-width: 568px) {
	.channel-slide {
		display: flex;
		gap: 16px;
		height: 100%;
		padding-block: 16px;
		padding-inline: min(78px, 6vw)
	}

	.channel-slide .image-frame {
		align-self: flex-start;
		flex: 1;
		max-width: 320px;
		aspect-ratio: 1;
		margin-bottom: 0
	}

	.channel-slide .slide-content {
		display: flex;
		flex-direction: column;
		gap: 16px;
		flex: 1
	}

	.channel-slide .title {
		font-size: 24px
	}

	.channel-slide .slide-footer {
		margin-top: auto;
		display: flex;
		align-items: center;
		-moz-column-gap: 24px;
		column-gap: 24px
	}

	.channel-slide .slide-footer span {
		font-size: 12px;
		line-height: 18px;
		letter-spacing: .01em
	}

	.channel-slide.simple {
		padding-inline: 16px
	}
}

.online-channels-grid-block .block-head {
	gap: 16px
}

.online-channels-grid-block .cards-container {
	display: grid;
	grid-template-columns: repeat(2, minmax(163px, 1fr));
	gap: 9px
}

.online-channels-grid-block .cards-container .simple-card {
	--card-width: 100%
}

.online-channels-grid-block .tab-list .tab>label {
	white-space: nowrap
}

@media (min-width: 568px) {
	.online-channels-grid-block .block-head {
		gap: 24px
	}

	.online-channels-grid-block .cards-container {
		grid-template-columns: repeat(5, 200px);
		gap: 34px 16px
	}
}

.radio-wave-block .block-head {
	display: flex;
	flex-direction: column;
	row-gap: 16px;
	align-items: center;
	text-align: center;
	margin-bottom: 48px
}

.radio-wave-block .block-head>p {
	max-width: 45ch
}

.radio-wave-block .block-head>svg {
	height: 56px
}

.radio-wave-block .block-body {
	display: flex;
	flex-direction: column;
	align-items: center;
	row-gap: 16px
}

.radio-wave-block .block-body .image-frame {
	background-color: unset
}

@media (min-width: 568px) {
	.radio-wave-block .block-head {
		row-gap: 24px;
		margin-bottom: 80px
	}

	.radio-wave-block .block-body .image-frame {
		max-width: 90%
	}
}

.profile-form {
	display: flex;
	flex-direction: column;
	row-gap: 16px;
	padding: 16px;
	background: #2c2e30;
	border-radius: 16px
}

.profile-form form {
	display: flex;
	flex-direction: column;
	row-gap: 16px
}

.profile-form-head {
	display: flex;
	justify-content: space-between;
	align-items: center
}

.profile-form-info {
	display: flex;
	flex-direction: column;
	row-gap: 32px
}

.profile-form-form-items {
	display: flex;
	flex-direction: column;
	gap: 16px
}

@media (min-width: 568px) {
	.profile-form-form-items {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr))
	}
}

.profile-form-form-items .input-date {
	display: flex;
	align-items: center;
	-moz-column-gap: 8px;
	column-gap: 8px;
	margin-top: 8px
}

.profile-form-form-items .input-date>.form-field {
	flex: 1
}

.profile-form-form-items .input-tel {
	display: flex;
	align-items: center;
	-moz-column-gap: 8px;
	column-gap: 8px;
	margin-top: 8px
}

.profile-form-form-items .input-tel>div:nth-child(1) {
	max-width: 100px
}

.profile-form-form-items .input-tel>div:nth-child(2) {
	flex: 1
}

.profile-form-form-items .input-tel>select .control {
	width: unset
}

.profile-form-form-items .error-container {
	color: #d96244;
	font-size: 12px;
	line-height: 16px;
	letter-spacing: .01em;
	margin-top: 4px
}

.profile-form-form-items .error-container:empty {
	display: none
}

.profile-form-form-items .form-item-label {
	font-weight: 500;
	font-size: 16px;
	line-height: 18px;
	letter-spacing: .01em
}

.profile-form .form-field {
	--field-padding-inline: 8px;
	--field-outline-color: #151719
}

.profile-form .form-field .control {
	background-color: #15171980
}

.profile-form .form-field input::-moz-placeholder {
	font-family: Galano Grotesque, Montserrat, sans-serif
}

.profile-form .form-field input::placeholder {
	font-family: Galano Grotesque, Montserrat, sans-serif
}

.profile-form .form-field label {
	font-weight: 500
}

.share .title {
	margin-bottom: 8px;
	padding-bottom: 8px;
	border-bottom: 1px solid white
}

.share li {
	margin-bottom: 8px
}

.share li:last-child {
	margin-bottom: 0
}

.share button,
.share a {
	font-size: 16px
}

.error {
	color: #fff;
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center
}

.error .logo {
	height: 202px;
	margin-left: -48px;
	margin-bottom: 16px
}

.error h1 {
	font-size: 64px;
	line-height: 120%;
	letter-spacing: .01em
}

@media (min-width: 568px) {
	.error h1 {
		font-size: 128px;
		line-height: 120%;
		letter-spacing: .01em
	}
}

.error .status {
	font-size: 24px;
	line-height: 120%;
	letter-spacing: .01em;
	margin-bottom: 32px
}

@media (min-width: 568px) {
	.error .status {
		font-size: 36px;
		line-height: 120%;
		letter-spacing: .01em
	}
}

.error button {
	display: flex;
	width: 192px;
	height: 44px;
	padding: 16px;
	justify-content: center;
	align-items: center;
	gap: 16px;
	border-radius: 8px;
	border: 1px solid #EB1A26
}

.page-wrapper {
	display: flex;
	flex-direction: column;
	-moz-column-gap: 19px;
	column-gap: 19px;
	row-gap: 16px
}

@media (min-width: 1024px) {
	.page-wrapper {
		flex-direction: row
	}

	.page-wrapper aside {
		max-width: 338px
	}
}

.articles-block .block-body {
	display: flex;
	flex-direction: column;
	row-gap: 8px
}

.load-more {
	width: 100%
}

@media (min-width: 1024px) {
	.load-more {
		width: -moz-fit-content;
		width: fit-content;
		align-self: center
	}
}

@media (min-width: 640px) {
	.articles-grid {
		display: grid;
		grid-template-columns: repeat(6, 1fr);
		grid-gap: 20px
	}

	.articles-grid .article-card {
		grid-column: span 3
	}
}

@media (min-width: 1024px) {

	.articles-grid .article-card:nth-child(5n+1),
	.articles-grid .article-card:nth-child(5n+2) {
		grid-column: span 3
	}

	.articles-grid .article-card:nth-child(5n+3),
	.articles-grid .article-card:nth-child(5n+4),
	.articles-grid .article-card:nth-child(5n+5),
	.articles-grid .article-card:nth-child(5n) {
		grid-column: span 2
	}
}

.article-view {
	display: grid;
	grid-template-columns: 1fr;
	grid-gap: 16px;
	width: 100%
}

.article-view .main-content {
	width: 100%;
	display: flex;
	flex-direction: column;
	padding: 13px 12px;
	background-color: #ffffff1a;
	border-radius: 16px
}

.article-view .article-head {
	margin-bottom: 13px
}

.article-view .image-wrapper {
	display: grid;
	grid-template-areas: "content";
	flex-shrink: 0
}

.article-view .article-image {
	grid-area: content;
	width: 100%;
	aspect-ratio: 16/9;
	margin-bottom: 19px;
	-o-object-fit: cover;
	object-fit: cover;
	-o-object-position: center;
	object-position: center;
	border-radius: 16px
}

.article-view .date-badge {
	grid-area: content;
	align-self: flex-start;
	justify-self: flex-end;
	top: 11px;
	right: 11px
}

.article-view .article-row {
	display: flex;
	justify-content: space-between
}

.article-view .article-title {
	font-size: 16px;
	font-weight: 700;
	margin-bottom: 15px
}

.article-view .publish-date {
	font-size: 12px;
	line-height: 18px;
	letter-spacing: .01em
}

@media (min-width: 568px) {
	.article-view {
		grid-gap: 24px
	}

	.article-view .main-content {
		padding: 16px;
		border-radius: 32px;
		-webkit-backdrop-filter: blur(60px);
		backdrop-filter: blur(60px)
	}

	.article-view .article-head {
		margin-bottom: 16px
	}

	.article-view .article-title {
		font-size: 32px;
		line-height: 120%;
		letter-spacing: .01em;
		max-width: 520px;
		margin-bottom: 12px
	}

	.article-view .article-image {
		margin-bottom: 16px
	}

	.article-view .date-badge {
		top: 15px;
		right: 17px
	}
}

.date-badge {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	min-width: 92px;
	padding: 9px 11px;
	border-radius: 8px;
	background: #eb1a26;
	color: #fff
}

.date-badge .month {
	font-size: 12px;
	font-weight: 500
}

.date-badge .day {
	font-size: 48px;
	line-height: 120%;
	letter-spacing: .01em;
	font-weight: 700
}

@media (min-width: 568px) {
	.date-badge {
		min-width: 105px;
		padding: 12px 10px
	}

	.date-badge .month {
		font-size: 16px
	}

	.date-badge .day {
		font-size: 64px;
		line-height: 60px;
		letter-spacing: .01em
	}
}

.schedule {
	display: grid;
	grid-gap: 6px;
	grid-template-columns: [times] 4em [track-1-start] 1fr [track-1-end track-2-start] 1fr [track-2-end track-3-start] 1fr [track-3-end track-4-start] 1fr [track-4-end track-5-start] 1fr [track-5-end track-6-start] 1fr [track-6-end track-7-start] 1fr [track-7-end];
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	grid-auto-flow: column;
	grid-auto-columns: 100%
}

.schedule .title,
.schedule .time-slot {
	margin: 0;
	font-size: 1em
}

.schedule .day-slot,
.schedule .time-slot {
	font-weight: 700;
	font-size: .75em !important;
	text-align: center
}

.schedule:after {
	display: block;
	content: "";
	position: sticky;
	top: 0;
	grid-column: track-1/-1;
	grid-row: tracks
}

.session {
	margin: 0;
	padding: .5em;
	border-radius: 8px;
	font-size: 14px;
	display: flex;
	justify-content: center;
	align-items: center;
	background: #ffffff1a
}

.session.active {
	background: #eb1a26
}

.day-slot {
	display: block;
	padding: 10px 5px 5px;
	position: sticky;
	top: 0;
	width: 138px
}

.time-slot {
	display: flex;
	justify-content: center;
	align-items: center;
	background: #2c2e30;
	border-radius: 8px;
	padding: 12px;
	margin-bottom: 0 !important;
	position: sticky;
	left: -.5px;
	height: auto;
	transition: all .3s cubic-bezier(.68, -.1, .65, 1.03)
}

.time-slot.is-pinned {
	background-color: #44484b
}

.channel-slides-block {
	padding-top: 0
}

@media (max-width: 768px) {
	.channel-slides-block .arrow-slider {
		margin-inline: calc(var(--container-padding-inline) * -1);
		padding-inline: var(--container-padding-inline)
	}

	.channel-slides-block .arrow-slider .slider-track {
		overflow: visible
	}
}

@media (min-width: 568px) {
	.channel-slides-block .arrow-slider .slider-track-item .inner {
		height: 100%
	}
}

.contacts-page .contacts-content {
	width: 100%;
	display: grid;
	row-gap: 40px
}

.contacts-page form,
.contacts-page .contact-form {
	display: grid;
	row-gap: 24px
}

.contacts-page form h3.success,
.contacts-page .contact-form h3.success {
	color: #00a86b
}

.contacts-page form h3.error,
.contacts-page .contact-form h3.error {
	color: #eb1a26;
	align-items: revert
}

@media (max-width: 768px) {

	.contacts-page form .button,
	.contacts-page .contact-form .button {
		width: 100%
	}
}

.contacts-page .contact-info .contacts-list {
	display: flex;
	flex-direction: column;
	gap: 40px
}

.contacts-page .contact-info li {
	display: flex;
	gap: 16px;
	align-items: center
}

.contacts-page .contact-info svg {
	color: #eb1a26;
	flex-shrink: 0
}

.contacts-page .social-links {
	margin-bottom: 16px
}

.podcast-view {
	display: flex;
	flex-direction: column;
	gap: 50px
}

.podcast-view .content-block {
	padding-block: 0
}

.podcast-view .featured-block {
	border-radius: 16px;
	background-color: #ffffff1a;
	-webkit-backdrop-filter: blur(40px);
	backdrop-filter: blur(40px);
	overflow: hidden;
	padding: 12px
}

.podcast-view .featured-block .block-image {
	border-radius: 8px;
	margin-bottom: 12px
}

.podcast-view .featured-block .block-image img {
	aspect-ratio: 1;
	-o-object-fit: cover;
	object-fit: cover;
	-o-object-position: center;
	object-position: center
}

.podcast-view .featured-block .title-row {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	justify-content: space-between;
	margin-bottom: 8px
}

@media (max-width: 768px) {
	.podcast-view .featured-block .season {
		display: none
	}
}

.podcast-view .featured-block .star-rating {
	margin-bottom: 12px
}

.podcast-view .featured-block .description {
	font-size: 12px;
	line-height: 18px;
	letter-spacing: .01em
}

.podcast-view .episodes-list {
	display: grid;
	gap: 8px
}

@media (min-width: 568px) {
	.podcast-view {
		gap: 76px
	}

	.podcast-view .featured-block {
		display: flex;
		gap: 21px;
		padding: 16px;
		border-radius: 24px
	}

	.podcast-view .featured-block>* {
		flex: 1
	}

	.podcast-view .featured-block .block-content {
		display: flex;
		flex-direction: column
	}

	.podcast-view .featured-block .block-image {
		max-width: 320px;
		margin-bottom: 0;
		align-self: flex-start;
		border-radius: 16px
	}

	.podcast-view .featured-block .title {
		font-size: 24px;
		line-height: 120%;
		letter-spacing: .01em
	}

	.podcast-view .featured-block .season {
		display: block;
		margin-bottom: 8px;
		line-height: 140%;
		font-weight: 700
	}

	.podcast-view .featured-block .star-rating {
		margin-bottom: 16px
	}

	.podcast-view .featured-block .description {
		margin-bottom: 12px
	}

	.podcast-view .featured-block .date {
		font-size: 12px;
		line-height: 18px;
		letter-spacing: .01em
	}

	.podcast-view .featured-block .footer-row {
		display: flex;
		margin-top: auto;
		align-items: center;
		flex-wrap: wrap;
		gap: 24px
	}

	.podcast-view .featured-block .footer-group {
		display: flex;
		gap: inherit;
		align-self: stretch;
		align-items: center;
		flex: 1
	}

	.podcast-view .featured-block .icons {
		display: flex;
		gap: 24px;
		margin-left: auto;
		align-self: flex-end
	}

	.podcast-view .episodes-list {
		gap: 16px
	}
}

.episode-block {
	border-radius: 16px;
	background-color: #ffffff1a;
	-webkit-backdrop-filter: blur(40px);
	backdrop-filter: blur(40px);
	overflow: hidden;
	padding: 8px
}

.episode-block .title-row {
	display: flex;
	gap: 8px;
	justify-content: flex-start;
	align-items: center;
	margin-bottom: 8px
}

.episode-block .block-image {
	width: 80px;
	border-radius: 8px
}

.episode-block .block-image img {
	aspect-ratio: 1;
	-o-object-fit: cover;
	object-fit: cover;
	-o-object-position: center;
	object-position: center
}

.episode-block .title {
	font-size: 14px;
	line-height: 120%;
	letter-spacing: .01em;
	padding-block: 10px;
	align-self: flex-start
}

.episode-block .description {
	font-size: 12px;
	line-height: 18px;
	letter-spacing: .01em;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	white-space: pre-wrap;
	margin-bottom: 8px
}

.episode-block .info {
	font-size: 12px;
	line-height: 18px;
	letter-spacing: .01em;
	display: flex;
	flex-wrap: wrap;
	gap: 0 16px;
	margin-bottom: 8px
}

.episode-block .button-container {
	display: flex;
	flex-wrap: wrap;
	gap: 8px
}

.episode-block .button {
	flex: 1
}

@media (min-width: 568px) {
	.episode-block {
		display: grid;
		grid-template-columns: minmax(auto, 200px) auto;
		gap: 16px;
		padding: 12px
	}

	.episode-block .block-image {
		width: 100%
	}

	.episode-block .title {
		font-size: 16px;
		line-height: 120%;
		letter-spacing: .01em;
		padding-block: 0;
		margin-bottom: 16px
	}

	.episode-block .block-content {
		display: flex;
		flex-direction: column;
		padding-top: 4px
	}

	.episode-block .description {
		font-size: 16px;
		line-height: 140%;
		letter-spacing: .01em
	}

	.episode-block .block-footer {
		display: flex;
		flex-direction: row-reverse;
		justify-content: flex-end;
		gap: 8px 16px;
		align-items: center;
		margin-top: auto
	}

	.episode-block .info {
		margin-bottom: 0
	}
}

.podcasts-page .content-block:first-of-type {
	padding-top: 0
}

.podcasts-page .head-row svg {
	color: #fff
}

.podcasts-page .tab-list {
	display: flex
}

.podcasts-page .podcasts-list {
	display: flex;
	flex-direction: column;
	row-gap: 8px
}

.podcasts-page .load-more {
	margin-top: 32px
}

@media (max-width: 768px) {
	.podcasts-page .load-more {
		width: 100%
	}
}

@media (min-width: 568px) {
	.podcasts-page .podcasts-list {
		row-gap: 16px
	}

	.podcasts-page .arrow-slider .podcast-wide-block {
		padding: 16px 56px
	}
}

@media (min-width: 1024px) {
	.podcasts-page .arrow-slider .podcast-wide-block {
		padding: 16px 78px
	}
}

.text-page .main-content {
	display: flex;
	flex-direction: column;
	gap: 16px;
	-webkit-backdrop-filter: blur(30px);
	backdrop-filter: blur(30px);
	padding: 16px;
	width: 100%;
	border-radius: 16px;
	background-color: #ffffff1a
}

@media (min-width: 568px) {
	.text-page .main-content {
		border-radius: 32px
	}
}

.text-page .main-content h1 {
	font-size: 24px;
	line-height: 120%;
	letter-spacing: .01em
}

.text-page .main-content .published {
	font-size: 12px;
	line-height: 18px;
	letter-spacing: .01em
}

.advisors .text {
	margin-bottom: 16px
}

.advisors .questions .accordion {
	width: 100%;
	background: #2c2e30;
	border-radius: 16px;
	margin-bottom: 16px;
	padding: 16px 24px
}

.advisors .questions .accordion button {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center
}

.advisors .questions .accordion .open {
	margin-top: 8px;
	padding-top: 16px
}

.advisors .questions .accordion-content {
	border-top: 1px solid gray
}

.advisors .questions .accordion-content ul {
	list-style: unset
}

.advisors .questions .accordion-content ol {
	list-style: decimal
}

.advisors .questions .accordion-content ul li,
.advisors .questions .accordion-content ol li {
	margin-left: 16px
}

.download-app {
	display: flex;
	flex-direction: column;
	row-gap: 16px;
	border-radius: 32px;
	background: #ffffff1a;
	-webkit-backdrop-filter: blur(30px);
	backdrop-filter: blur(30px);
	padding: 16px;
	width: 100%
}

.download-app .richtext {
	display: flex;
	flex-direction: column;
	row-gap: 16px
}

.download-app .richtext p {
	margin-bottom: unset
}

.download-app .richtext h2 {
	font-size: 32px;
	line-height: 120%;
	letter-spacing: .01em;
	margin-bottom: 12px
}

.download-app .richtext ul {
	list-style: none;
	padding: 0
}

.download-app .richtext ul>li {
	display: flex;
	align-items: center;
	-moz-column-gap: 16px;
	column-gap: 16px;
	padding: 0;
	line-height: 120%
}

.download-app .richtext ul>li:not(:last-of-type) {
	margin-bottom: 24px
}

.download-app .richtext ul>li:before {
	content: url('data:image/svg+xml; utf8, <svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg"> <path fill-rule="evenodd" clip-rule="evenodd" d="M2 12.9374C2 7.41453 6.47715 2.93738 12 2.93738C17.5228 2.93738 22 7.41453 22 12.9374C22 18.4602 17.5228 22.9374 12 22.9374C6.47715 22.9374 2 18.4602 2 12.9374ZM15.7071 11.6446C16.0976 11.2541 16.0976 10.6209 15.7071 10.2304C15.3166 9.83987 14.6834 9.83987 14.2929 10.2304L11 13.5233L9.70711 12.2304C9.31658 11.8399 8.68342 11.8399 8.29289 12.2304C7.90237 12.6209 7.90237 13.2541 8.29289 13.6446L10.2929 15.6446C10.6834 16.0351 11.3166 16.0351 11.7071 15.6446L15.7071 11.6446Z" fill="white"/> </svg>');
	width: 24px;
	height: 24px;
	line-height: 0;
	flex-shrink: 0
}

.download-app .video-container {
	max-width: 100%;
	border-radius: 16px
}

.download-app .store-links {
	padding: 16px 0;
	display: flex;
	-moz-column-gap: 24px;
	column-gap: 24px;
	justify-content: center
}

@media (max-width: 1024px) {
	.download-app {
		row-gap: 8px;
		border-radius: 16px;
		padding: 16px 14px
	}

	.download-app .video-container {
		border-radius: 8px
	}
}

.search {
	width: 100%
}

.search-item {
	display: flex;
	width: 100%;
	min-height: 176px;
	background: #ffffff1a;
	padding: 12px;
	margin-bottom: 16px;
	border-radius: 16px
}

.search-item img {
	min-width: 152px;
	width: 152px;
	height: 152px;
	margin-right: 16px;
	border-radius: 8px;
	-o-object-fit: cover;
	object-fit: cover;
	-o-object-position: center;
	object-position: center
}

.search-item h3 {
	line-height: 120%;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	white-space: pre-wrap;
	word-break: break-all
}

.search-item .published {
	font-size: 12px;
	line-height: 18px;
	letter-spacing: .01em
}

.search-item .published span {
	font-weight: 700
}

.search-item-content {
	display: flex;
	flex-direction: column;
	row-gap: 8px
}

.search-item-content p {
	line-height: 140%;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	white-space: pre-wrap;
	word-break: break-word
}

.search .load-more {
	margin-top: auto
}

.search .no-results {
	display: flex;
	flex-direction: column;
	row-gap: 8px
}

@media (max-width: 1024px) {
	.search .load-more {
		width: 100%
	}
}

.search-results {
	margin-top: 4px;
	margin-bottom: -8px;
	font-size: 12px;
	line-height: 18px;
	letter-spacing: .01em
}

.search-results span {
	font-weight: 700
}

.user-panel {
	display: flex;
	flex-direction: column;
	row-gap: 17px;
	padding: 16px;
	background-color: #2c2e30;
	border-radius: 16px
}


/* ------------------------------------------- */

.modal_statistics{display:none;position:fixed;z-index:10000;top:0;left:0;height:100%;width:100%;background:rgba(0,0,0,.5) url('../images/loading.gif') 50% 50% no-repeat;background-size: 50px 50px;}
body.loading .modal_statistics{overflow:hidden;}
body.loading .modal_statistics{display:block;}

.modal .close {
    position: absolute;
    top: 40px;
    right: 14px;
    z-index: 5000; /* Ensure it's above everything else */
    color: white;
    font-size: 4rem;
    background: transparent;
    border: none;
    cursor: pointer;
}

.iframe-container {
    position: relative;
    width: 100%;
    height: 100%;
}

.iframe-container iframe {
    position: relative;
    z-index: 1; /* Below the close button */
    pointer-events: auto; /* Ensure iframe works for video controls */
}

.modal-body .close {
    z-index: 5000; /* Always above iframe */
    pointer-events: auto; /* Ensure close button is clickable */
}

.modal-open {
	overflow: hidden
}

.modal {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1050;
	display: none;
	overflow: hidden;
	-webkit-overflow-scrolling: touch;
	outline: 0
}

.modal.fade .modal-dialog {
	-webkit-transform: translate(0, -25%);
	-ms-transform: translate(0, -25%);
	-o-transform: translate(0, -25%);
	transform: translate(0, -25%);
	-webkit-transition: -webkit-transform .3s ease-out;
	-o-transition: -o-transform .3s ease-out;
	transition: -webkit-transform .3s ease-out;
	transition: transform .3s ease-out;
	transition: transform .3s ease-out, -webkit-transform .3s ease-out, -o-transform .3s ease-out
}

/*.modal.in .modal-dialog {
	-webkit-transform: translate(0, 0);
	-ms-transform: translate(0, 0);
	-o-transform: translate(0, 0);
	transform: translate(0, 0)
}*/

.modal-open .modal {
	overflow-x: hidden;
	overflow-y: auto
}

.modal-dialog {
	position: relative;
	width: auto;
	margin: 10px
}

.modal-dialog {
    margin: 0 auto;
    max-width: 100%;
}

.modal-content{
    width: 100%;
    height: 100%;
}
.modal-fullscreen {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1051; /* Above everything else */
    display: flex;
    align-items: center;
    justify-content: center;
}

.modal-body {
    padding: 0;
    margin: 0;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%; /* Full height of modal */
    width: 100%; /* Full width of modal */
}

iframe {
    width: 100%;
    height: 100%;
    border: none;
}

.song-card {
    transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
    position: relative; /* Establish stacking context */
    width: 100%;
    padding: 4px;
    border-radius: 5px;
    overflow: visible; /* Allow dropdown to overflow */
    z-index: 1;
}

.song-content, .song-image, .song-video {
    position: relative;
    z-index: 2;
}

.songs-list-wrapper,
.songs-vote-list {
    position: relative;
}

.songs-list-wrapper {
    display: flex;
    flex-direction: column;
    row-gap: 4px;
}

.songs-vote-list {
    display: flex;
    flex-direction: column;
    row-gap: 4px;
}

.vote-position {
    min-width:40px;
    text-align:center;
    /*background-color: #888888;*/
    border: 2px solid #ffffff;
    margin-right: 6px;
    max-height: 34px; /* Default height for single-row appearance */
    overflow-y: hidden;
}

.vote-position.expanded {
    max-height: 100px; /* Allow full height for dropdown */
    overflow-y: auto; /* Add scroll if needed (fallback) */
}

option.disabled-option {
    background-color: #444444; /* Light grey background */
    color: #ffffff; /* Greyed out text */
}




.dropdown {
	position: relative;
	display: block;
}

.dropdown-toggle {
    flex-direction: column;
    width: 32px;
    height: 32px;
    padding: 4px;
    margin-right: 6px;
    text-align: center;
    background-color: #ff0000;
    color: #ffffff;
    border: none;
    border-radius: 4px;
    font-weight: bold;
    cursor: pointer;
    z-index: 2;
}

.dropdown-menu {
    display: none;
    position: absolute;
    top: -20px;
    left: calc(100% + 10px);
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    color: #555555;
    font-weight: bold;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    z-index: 1000;
    padding: 0;
    min-width: 300px;
    max-height: 70px;
}

.dropdown-row {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
}

.dropdown-item {
    flex: 1;
    padding: 4px;
    text-align: center;
    cursor: pointer;
    border: 1px solid transparent;
}

.dropdown-item:hover {
    background-color: #f8f9fa;
    border-color: #ddd;
    border-radius: 4px;
}

.dropdown.open .dropdown-menu {
    display: inline-block;
}

.dropdown-item.disabled-option {
    pointer-events: none;
    background-color: #f8d7da; /* Light red for disabled items */
    color: #a94442; /* Darker red for text */
    cursor: not-allowed;
}

.fill-overlay {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	background-color: rgba(255, 0, 0, 66%); /* Non-transparent overlay color */
	width: 0%; /* Set by JavaScript based on percentage */
	z-index: 1;
    transition: width 0.3s ease-in-out;
}

.fill-overlay.hidden {
    width: 0 !important; /* Remove the width when hidden */
    display: none;
}

/* Wrapper for tooltip and button */
.tooltip-container {
    position: relative;
    display: inline-block;
}

/* Tooltip text */
.tooltip-text {
    position: absolute;
    top: -30px; /* Position above the button */
    left: 50%;
    transform: translateX(-50%);
    background-color: #333; /* Dark background */
    color: #fff; /* White text */
    padding: 5px 10px;
    border-radius: 4px;
    font-size: 12px;
    white-space: nowrap;
    z-index: 1000;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s ease-in-out;
}

/* Show tooltip when hovering over the container */
.tooltip-container:hover .tooltip-text {
    opacity: 1;
    visibility: visible;
}

/* Styling for the disabled button */
.button[disabled] {
    cursor: not-allowed;
    opacity: 0.7; /* Optional: Dim the button */
}

.custom-swal-popup {
    margin: 0 !important; /* Remove any default margins */
}

.swal-confirm-red {
    background-color: #ff0000 !important; /* Red background */
    color: #ffffff !important; /* White text */
    border: none !important; /* Remove border */
    box-shadow: none !important; /* Remove shadow */
}

.swal-confirm-red:hover {
    background-color: #cc0000 !important; /* Darker red on hover */
    color: #ffffff !important;
}

/* Optional: Default styling for cancel button */
.swal-cancel-default {
    background-color: #f8f9fa !important; /* Light gray background */
    color: #212529 !important; /* Dark text */
    border: 1px solid #ced4da !important; /* Border */
}

.swal-cancel-default:hover {
    background-color: #e2e6ea !important; /* Slightly darker gray */
}