/* BASIC LAYOUT
----------------------------------------------- */
.wrapper {min-width: 320px; position: relative; overflow: hidden; overflow: clip; padding: 40px 0;}
.wrapper__container {max-width: var(--max-width); margin: 0 auto; position: relative; z-index: 20;}
.wrapper__container--main {background-color: var(--bg); box-shadow: 0 20px 40px rgba(0,0,0,0.1);}
.header {padding: 0 var(--indent); padding-left: calc(240px + var(--indent)); 
	position: relative; z-index: 100; height: 110px;}
.cols {display: grid; grid-template-columns: 240px minmax(0,1fr); min-height: 100vh; grid-template-areas: "sidebar content";}
.cols__content {grid-area: content; padding: 0 var(--indent); padding-bottom: 40px;}
.cols__sidebar {grid-area: sidebar; padding: 95px 20px 40px 30px; gap: 40px; position: relative; z-index: 50;
	background-color: var(--bg-darker); margin-top: -110px;}
.cols__sidebar-sticky {left: 0; top: 15px;}
.footer {padding: 20px var(--indent); background-color: var(--bg-darker-1);}
.footer__two {border-top: 1px solid var(--bdc); padding-top: 20px; margin-top: 20px;}

.scrolltop {position: fixed; width: 40px; height: 40px; right: 10px; bottom: 10px; padding: 0;
	z-index: 990; border-radius: 50%; font-size: 18px; opacity: 0; scale: 0 0;}
.scrolltop.is-active {scale: 1 1; opacity: 1;}
.overlay {position: fixed; z-index: 998; left: 0; top: 0; width: 100%; height: 100%; 
	opacity: 0.8; background-color: #1d1924; cursor: pointer; display: none;}


/* HEADER, TOPMENU, CAROU
----------------------------------------------- */
.logo {display: flex; align-items: center; font-family: "Black Ops One", system-ui; font-weight: 400; 
	padding-left: 36px; position: relative; font-size: 24px; 
	 background: url(../images/logo.svg) 0 center / 26px no-repeat; height: 50px;}
.logo span {color: var(--accent);}
.logo:has(img) {background: none; min-width: 200px;}
.logo img {display: block; position: absolute; left: 0; top: 50%; translate: 0 -50%; max-height: 100%;}
.header .header__logo {position: absolute; left: 30px; top: 50%; translate: 0 -50%;}
.dt .header__theme-select::before {content:"\f755";}
.header__btn-login, .header__btn-link {height: 50px; padding: 0 30px; border-radius: 25px;}
.header__btn-login::before {display: none !important;}

.header__user {position: relative; padding-left: 60px; padding-right: 15px; cursor: pointer;}
.header__user::before {position: absolute; right: 0; bottom: 2px; color: var(--tt-fade);}
.header__user-ava {width: 50px; position: absolute; left: 0; top: 50%; translate: 0 -50%;}
.header__user-name {font-weight: 600;}
.header__user-group, .header__user-group * {color: var(--tt-fade) !important; font-size: 12px; font-weight: 400 !important;}
.header__btn1 {color: var(--tt-fade); font-size: 24px; position: relative;}
.header__btn1 span {position: absolute; left: 50%; top: -20px; translate: -50% 0;
	padding: 0 8px; font-size: 10px; border-radius: 10px; background-color: var(--accent-fade); color: var(--accent); 
	display: grid; place-items: center; height: 20px; min-width: 30px;}
.c-0 span {display: none;}

.search-block {position: relative; width: 400px;}
.search-block__input, .search-block__input:focus {padding: 0 20px 0 60px; box-shadow: none; 
	border-radius: 25px; height: 50px; line-height: 50px; border-width: 1px;}
.search-block__input:not(:focus)::placeholder {color: var(--tt); opacity: 0.66;}
.search-block__btn {position: absolute; left: 0; top: 0; height: 50px; font-size: 18px; width: 60px; border-radius: 25px;}


/* SECTION
----------------------------------------------- */
.sect {counter-reset: n;}
.sect:not(:last-child) {margin-bottom: 60px;}
.sect__header {margin-bottom: 20px;}
.sect__title {font-size: 24px; font-weight: 700; line-height: 1.3;}
.sect__title span {color: var(--tt-fade); font-size: 12px; font-weight: 400; text-transform: uppercase; display: block;}
.sect__link {height: 30px; border-radius: 15px; padding: 0 15px; font-size: 12px; text-transform: uppercase;
	background-color: var(--accent-fade); color: var(--accent); font-weight: 500;}
.sect__right {width: 360px;}
.genres-list a {display: block; background-color: var(--bg-darker); 
	border-radius: var(--bdrs); padding: 15px 20px; border: 1px solid var(--bdc); --bdc: rgba(0,0,0,0.05);}

.speedbar {color: var(--tt-fade); font-size: 14px; padding: 20px 40px;
	border-bottom: 4px dotted var(--bdc); margin: -30px -40px; margin-bottom: 20px;}
.speedbar a {color: var(--tt);}
.speedbar::before {color: var(--blue); margin-right: 10px;}

.descr {color: var(--tt-fade-0); display: grid; gap: 10px; padding-top: 40px; 
	line-height: 1.6; border-top: 1px solid var(--bdc);}
.descr :is(h1,h2,h3) {font-size: 18px; font-weight: 600; color: var(--tt); line-height: 1.3;}
.descr a {text-decoration: underline; color: var(--accent);}
.descr ul li {position: relative; padding-left: 25px; margin-left: 25px;}
.descr ul li::before {content:"\f00c"; color: var(--accent); position: absolute; left: 0; top: 0;}
.seo-links {background-color: var(--bg-darker); border: 1px solid var(--bdc); border-radius: var(--bdrs); padding: 20px;}
.seo-links h2, .seo-links h3 {margin-bottom: 12px;}
.seo-links__lead {color: var(--tt-fade-0); line-height: 1.6; margin-bottom: 15px;}
.seo-links__list {display: flex; flex-wrap: wrap; gap: 10px;}
.seo-links__list a {display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border-radius: 20px;
	background-color: var(--bg); border: 1px solid var(--bdc); box-shadow: var(--bsh);}
.page__breadcrumbs {flex-wrap: wrap; gap: 8px 10px; margin-bottom: 20px; color: var(--tt-fade); font-size: 13px;}
.page__breadcrumbs a {color: var(--tt);}
.page__breadcrumbs [itemprop="itemListElement"] {display: inline-flex; align-items: center; gap: 8px;}


/* GRIDS
----------------------------------------------- */
.grid-items {display: grid; gap: 10px; grid-template-columns: repeat(auto-fill,minmax(min(60vw,460px),1fr));}
.grid-items > *:not(.grid-items__item), #dle-content > *:not(.grid-items__item) {grid-column: 1 / -1;}
.grid-items > #dle-content {display: inherit; gap: inherit; grid-template-columns: inherit;}
.grid-items:has(.album-item) {gap: 15px; grid-template-columns: repeat(auto-fill,minmax(140px,1fr));}
.grid-items:has(.podcast-item) {gap: 15px; grid-template-columns: repeat(auto-fill,minmax(220px,1fr));}
.grid-items:has(.collection-item) {gap: 20px; grid-template-columns: repeat(auto-fill,minmax(280px,1fr));}
.grid-items:has(.artist-item) {gap: 20px; grid-template-columns: repeat(auto-fill,minmax(180px,1fr));}
.grid-items:has(.collection-main) {gap: 30px 15px; grid-template-columns: repeat(3,minmax(0,1fr)); align-content: start;}


/* TRACK
----------------------------------------------- */
.track-item {background-color: var(--bg); box-shadow: var(--bsh); border-radius: var(--bdrs); padding: 10px;}
.track-item__img {width: 50px; border-radius: var(--bdrs);}
.track-item__btn-play {position: absolute; inset: 0; height: 50px;}
.track-item__btn-play::before {width: 30px; height: 30px; box-sizing: border-box; border-radius: 50%; 
	background-color: rgba(0,0,0,0.3); color: #fff; font-size: 10px; padding-left: 3px; backdrop-filter: blur(5px)}
.track-item__title {font-weight: 600; font-size: 14px;}
.track-item__subtitle {font-size: 14px; color: var(--tt-fade);}
.track-item__time {color: var(--tt-fade); font-size: 12px;}
.track-item__btn-ctrl {font-size: 28px; color: var(--accent); height: 30px; border-radius: 50%;}
.track-item__fav a, .track-item--guest::before {display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; 
	background-color: var(--accent-fade); color: var(--accent); font-size: 14px;}
.track-item--guest::before {content: counter(n,decimal-leading-zero); counter-increment: n; font-size: 12px;}

.js-trc--is-current .track-item__btn-play:not(:hover)::before, .js-trc--is-playing .track-item__btn-play, 
.js-trc--is-playing .page__play {background-color: var(--accent); color: #fff;}
.js-trc--is-playing .track-item__btn-play::before, 
.js-trc--is-playing .page__play::before {content:"\f04c";}
.js-trc--is-playing .track-item__btn-play::before {padding-left: 0;}
.track-item.js-trc--is-playing {box-shadow: 0 0 0 1px var(--accent);}


/* COLLECTION
----------------------------------------------- */
.collection-main {grid-column: 1 / -1; height: 301px; border-radius: var(--bdrs);}
.collection-item__img {border-radius: var(--bdrs); height: 180px; text-shadow: 1px 1px rgba(0,0,0,0.15);}
.grid-items:has(.collection-main) .collection-item__img {height: 110px;}
.collection-item__desc {position: absolute; left: 50%; top: 50%; translate: -50% -50%; border-radius: var(--bdrs); 
	width: calc(100% - 20px); text-transform: uppercase; font-size: 12px; font-weight: 600; box-shadow: var(--bsh);
	color: #fff; backdrop-filter: blur(30px); background-color: rgba(0,0,0,0.05); padding: 10px;}
.collection-main__desc {position: absolute; left: 0; right: 0; bottom: 0; z-index: 3;
	padding: 30px; color: #fff; text-shadow: 1px 1px rgba(0,0,0,0.15);}
.collection-main__title {text-transform: uppercase; font-size: 28px; font-weight: 700; line-height: 1.3; 
	max-width: 60%; margin-bottom: 30px; margin-top: 5px; text-wrap: balance; letter-spacing: 1px;}
.collection-main__subtitle {font-size: 14px; text-transform: uppercase; 
	letter-spacing: 2px; font-weight: 500; opacity: 0.9;}
.collection-main__meta {font-weight: 500; font-size: 16px;}
.collection-main__meta span {text-transform: uppercase; font-size: 10px; 
	opacity: 0.8; font-weight: 700; margin-bottom: 3px;}
.collection-main::before {content: ''; position: absolute; inset: 0; background-color: rgba(0,0,0,0.3); border-radius: var(--bdrs); z-index: 2;}


/* ALBUM ITEM
----------------------------------------------- */
.album-item__img {border-radius: var(--bdrs);}
.album-item__desc {position: absolute; left: 0; right: 0; bottom: 0; padding: 12px 15px; text-shadow: 1px 1px rgba(0,0,0,0.15);
	color: #fff; backdrop-filter: blur(30px); background-color: rgba(0,0,0,0.1);}
.album-item__title {font-weight: 600; text-transform: uppercase; font-size: 12px;}
.album-item__subtitle {opacity: 0.8;}


/* PODCAST ITEM
----------------------------------------------- */
.podcast-item {border-radius: var(--bdrs); height: 180px;}
.sect:has(.album-item) .podcast-item {height: 148px;}
.podcast-item__btn {position: absolute; left: 15px; bottom: 15px; --ui-elem-height: 30px; font-size: 10px; letter-spacing: 0;}


/* SIDEBAR
----------------------------------------------- */
.side-menu__caption {text-transform: uppercase; font-weight: 600; font-size: 14px; color: var(--tt-fade); margin-bottom: 10px;}
.side-menu__list li {position: relative; white-space: nowrap;}
.side-menu__list a, .side-menu__list span {display: flex; align-items: center; gap: 10px; border-radius: var(--bdrs);
	padding-left: 50px; position: relative; height: 40px; cursor: pointer; margin: 0 -10px;}
.side-menu__list span, .side-menu__list li:has(span)::before {color: var(--accent);}
.side-menu__list li::before {width: 1.2em; font-size: 22px; color: var(--tt-fade); z-index: 1;
	position: absolute; left: 0; top: 50%; translate: 0 -50%; pointer-events: none;}
.side-menu__list .btn {justify-content: flex-start; padding-left: 50px; 
	display: flex; margin: 10px 0 15px -10px; background-color: var(--bg-darker-1); color: var(--tt-fade);}
.gnr {background-color: var(--bg); padding: 40px; box-shadow: var(--bsh); width: 600px; display: none;
	position: fixed; left: 50%; top: 50%; translate: -50% -50%; z-index: 998; border-radius: var(--bdrs);}
.gnr__close {position: absolute; right: 10px; top: 10px; border-radius: var(--bdrs); font-size: 18px; background-color: var(--red);}


/* FOOTER, PAGINATION
----------------------------------------------- */
.footer__logo {min-width: 190px;}
.footer__notify {border-left: 1px solid var(--bdc); padding-left: 20px; color: var(--tt-fade); font-size: 13px;}
.footer__copyright {font-size: 12px; text-transform: uppercase;}

.pagination {gap: 20px 10px; padding-top: 25px;}
.pagination__pages a, .pagination__pages span, .pagination > a, .pagination > span 
{display: grid; place-items: center; color: var(--tt-fade);
	height: 40px; min-width: 40px; padding: 0 10px; border-radius: var(--bdrs); 
	background-color: var(--bg-darker);}
.pagination__pages {gap: 10px; font-size: 14px;}
.pagination__pages span:not(.nav_ext) {color: #fff; background: var(--accent);}
.pagination__btns {height: 40px; border-radius: var(--bdrs); overflow: hidden; background-color: var(--bg); box-shadow: var(--bsh);}
.pagination__btns > * {width: 40px; display: grid; place-items: center; color: var(--accent); font-size: 18px;}
.pagination__btns > span {color: var(--tt-fade);}


/* INNER PAGE
----------------------------------------------- */
.page__main {overflow: hidden; border-radius: var(--bdrs); position: relative; --tt-fade: rgba(255,255,255,0.8);
	background-color: #000; color: #fff; --tt: #fff; padding: var(--indent); 
	text-shadow: 1px 1px rgba(0,0,0,0.15); gap: var(--indent);}
.page__main > *:not(.page__main-bg) {position: relative; z-index: 10;}
.page__main-bg, .page__main-bg::after {position: absolute; inset: 0;}
.page__main-bg::after {backdrop-filter: blur(30px) grayscale(0.5); background-color: rgba(0,0,0,0.15); content: '';}
.page__img {border-radius: var(--bdrs); width: 200px; box-shadow: var(--bsh); align-self: start; overflow: hidden;}
.page__img > a {display: block; padding: 5px 10px; font-size: 16px; border-radius: 10px;
	position: absolute; right: 10px; top: 10px; background-color: rgba(0,0,0,0.6);}
.page__rating {position: absolute; left: 10px; right: 10px; bottom: 10px; border-radius: var(--bdrs); overflow: hidden;}
.page__rating a {background-color: var(--green); color: #fff; flex: 1 1 0;
	display: flex; align-items: center; justify-content: center; gap: 10px; padding: 6px;}
.page__rating a + a {background-color: var(--red);}
.page-collection .page__img {width: 300px;}

.page__tech li {display: block; padding: 5px 13px; font-size: 12px; text-transform: uppercase; border-radius: var(--bdrs);}
.page__meta div {color: var(--tt-fade);}
.page__main h1 {font-size: 18px; font-weight: 400; color: var(--tt-fade);}
.page__main h1 span {display: block; font-size: 24px; font-weight: 600; color: #fff;}
.page__caption {color: var(--tt-fade); font-size: 13px;}
.page__play, .page__dl, .page__share, .page__fav a, .page__btn-ctrl1 {height: 50px; border-radius: 25px; padding: 0 30px;}
.page__fav a, .page__share, .page__btn-ctrl1 {display: grid; place-items: center; width: 50px; font-size: 18px; padding: 0;}
.page__dl, .page__fav a, .page__share, .page__tech li, .page__btn-ctrl1 {background-color: rgba(255,255,255,0.1);}

.page__clip-btn {width: 100%; position: relative; background: #000; cursor: pointer; 
	aspect-ratio: 3 / 1.6; border-radius: var(--bdrs);}
.page__clip-btn img {opacity: 0.6;}
.page__clip-btn::before {background-color: rgba(0,0,0,0.3); color: #fff; backdrop-filter: blur(10px); 
	position: relative; z-index: 10; width: 100px; height: 100px; border-radius: 50%; box-sizing: border-box; 
	font-size: 24px; padding-left: 5px; box-shadow: var(--bsh);}
.page__text {overflow-x: hidden; overflow-y: auto; position: relative;}
.sliced::after {content: ''; position: absolute; left: 0; bottom: 0; width: 100%; height: 50%; z-index: 1; 
	background: linear-gradient(to top, var(--bg) 0%, transparent 100%);}
.show-text {position: absolute; left: 50%; bottom: 3px; z-index: 2; translate: -50% 0;}

.artist-country-switch {position: relative; min-width: 290px;}
.artist-country-switch__flag {position: absolute; left: 14px; top: 50%; width: 20px; height: 14px; translate: 0 -50%;
	border-radius: 4px; background: #fff center / cover no-repeat; box-shadow: var(--bsh); border: 1px solid rgba(0,0,0,0.08);}
.artist-country-switch__input {height: 46px; line-height: 46px; padding: 0 42px 0 44px; border-radius: 23px;
	background-color: var(--bg-darker); border: 1px solid var(--bdc); font-size: 13px; font-weight: 500; color: var(--tt); box-shadow: var(--bsh);}
.artist-country-switch__input:focus {border-color: var(--accent);}
.artist-country-switch__arrow {position: absolute; right: 16px; top: 50%; translate: 0 -50%; pointer-events: none; font-size: 11px; color: var(--tt-fade);}

@media screen and (max-width: 760px) {
	.artist-country-switch {width: 100%; min-width: 0;}
	.artist-country-switch__input {width: 100%;}
}

.clip {position: fixed; z-index: 999; left: 50%; top: 50%; translate: -50% -50%; 
	width: 800px; max-width: calc(100vw - 40px); box-shadow: var(--bsh-long);}
.clip__close {font-size: 24px; position: absolute; right: 0; bottom: 100%; color: #fff;}
.clip__close:hover {background-color: var(--red); color: #fff;}
.clip .d-none {display: block;}


/* TEXT BLOCK, TYPOGRAPHY, VIDEO BLOCK
----------------------------------------------- */
.page__title {margin-bottom: 30px; font-size: 24px;}
.full-text {line-height: 1.6; font-size: 15px; word-wrap: break-word; color: var(--tt-fade-0);}
.full-text a {text-decoration: underline; color: var(--ui-accent);}
.full-text img:not(.emoji), .full-text p, .full-text h1, .full-text h2, .full-text h3, .full-text h4, .full-text h5, 
.full-text > ul, .full-text > ol, .full-text table {margin-bottom: 25px;}
.full-text > img[style*="left"], .full-text > .highslide img[style*="left"] {margin:0 10px 10px 0;}
.full-text > img[style*="right"], .full-text > .highslide img[style*="right"] {margin:0 0 10px 10px;}
.full-text > ul li, .full-text > ol li {padding-left: 60px; position: relative;}
.full-text > ul li:before {content: ''; width: 8px; height: 8px; border-radius: 50%; 
	border: 3px solid var(--accent); position: absolute; top: 6px; left: 34px;}
.full-text > ol {counter-reset: num;}
.full-text > ol li:before {content: counter(num); counter-increment: num; background-color: var(--accent); color: #fff; 
	position: absolute; top: -3px; left: 17px; width: 24px; height: 30px; font-size: 14px; font-weight: 500;
	display: flex; justify-content: flex-end; align-items: center; padding-right: 6px; box-sizing: border-box;}
.full-text > ol li:after {content: ''; border: 10px solid transparent; border-left-color: var(--accent); 
	position: absolute; left: 41px; top: -3px; transform: scale(0.66,1.5); transform-origin: 0 0;}
.full-text > ul li + li, .full-text > ol li + li {margin-top: 10px;}
.full-text table, .video-inside > * {width:100%;}
.full-text > *:last-child {margin-bottom: 0;}
.video-responsive {padding-top: 60%; position: relative; background-color: #000;}
.video-responsive > iframe, .video-responsive > video {position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.full-text h1, .full-text h2, .full-text h3, .full-text h4, .full-text h5 {font-size: 21px; margin-bottom: 20px;}


/* COMMENTS
----------------------------------------------- */
.page__comments {margin-top: 0px;}
.page__comments-info {color: var(--tt-fade); display: block; margin: 5px 0 20px; font-size: 14px; padding-left: 23px; position: relative;}
.page__comments-info::before {color: var(--red); position: absolute; left: 0; top: 2px;}
.page__ac {margin-bottom: 40px;}
.ac-form {position: relative;}
.ac-form__header, .ac-form__editor, .ac-form .message-info {gap: 10px; margin-bottom: 10px;}
.ac-form__btn {padding: 0 60px;}
.ac-form__bottom {gap: 25px;}
.confidential-check {font-size: 14px;}
.ac-form__header > span {margin-left: 15px;}
.ac-form .comments_subscribe {margin-top: 0px;}

.ac-toggle.ac-form {cursor: pointer;}
.ac-form__header input, .ac-form__editor textarea {background-color: rgba(0,0,0,0.02);}
.ac-toggle, .ac-toggle .ac-form__editor {position: relative;}
.ac-toggle .ac-form__bottom button {position: absolute; bottom: 20px; right: 10px; z-index: 10; pointer-events: none;}
.ac-form .bb-btn {display: none;}
.ac-form .bb-pane {background: none; box-shadow: none; border: 0; position: absolute; left: 0; bottom: 0; right: 0;}
.ac-form #b_emo, .ac-form #b_leech, .ac-form #b_quote, .ac-form #b_spoiler, 
.ac-form #b_b, .ac-form #b_u, .ac-form #b_s, .ac-form #b_color, .ac-form #b_hide {display: grid;}
.ac-toggle .bb-btn {pointer-events: none;}
.ac-toggle .ac-form__editor .bb-editor textarea {height: 120px; resize: none;}
.ac-form__editor .bb-editor textarea {height: 200px; line-height: 1.4; padding-bottom: 40px;}
.comments_subscribe + br, .ac-form .bb-editor + br {display: none;}
.ac-toggle .has-checkbox {display: none;}

.mass_comments_action {display: none; align-items: center; flex-wrap: wrap; gap: 10px;}
.mass_comments_action select {flex: 1 1 0; margin: 0 -28px 0 0; border-radius: 0; box-shadow: none; min-width: 60%;}
.mass_comments_action .bbcodes {border-radius: 0; padding: 0 10px;}

.comm__title {font-size: 18px; margin-bottom: 20px;}

.comm {margin-bottom: 40px; position: relative; padding-left: 90px;}
.comm::before {content: ''; background-color: var(--accent); height: 100%; width: 2px; position: absolute; top: 0; left: 70px;}
.comm__img {width: 50px; height: 50px; border-radius: 50%; position: absolute; left: 0px; top: 0px;}
.comm__letter {width: 100%; height: 100%; text-transform: uppercase; border-radius: inherit;
	position: absolute; left: 0; top: 0; color: #fff; font-size: 18px; font-weight: 500;}
.comm__author, .comm__author a {color: var(--accent); font-weight: 500; font-size: 14px;}
.comm__date {color: var(--tt-fade); font-size: 12px;}
.comm__rating a {color: var(--green); font-size: 18px;}
.comm__rating a:last-child {color: var(--red);}
.comm__rating span {font-size: 14px;}
.comm__rating span .ratingplus {color: var(--green);}
.comm__rating span .ratingminus {color: var(--red);}
.comm__text {margin: 8px 0;}
.comm__action {font-size: 12px; --tt: var(--tt-fade);}
.comm__ctrl-btn {font-size: 18px; height: 30px; --tt: var(--tt-fade);}
.comm__ctrl-menu li + li {margin-top: 10px;}
body:has(.pwidget) #dropmenudiv {z-index: 1000 !important;}


/* POPUP WIDGET
----------------------------------------------- */
.pwidget {background-color: var(--bg); color: var(--tt); 
	border-radius: 20px; overflow: hidden; z-index: 999; padding: 20px; padding-top: 24px; 
	position: fixed; left: 20px; bottom: 20px; right: 20px; box-shadow: 0 0 60px rgba(0,0,0,0.5);}
.pwidget::before {content: ''; position: absolute; top: 10px; left: 50%; transform: translateX(-50%); 
	background-color: rgba(0,0,0,0.2); height: 4px; width: 40px; border-radius: 2px;}
.pwidget .wctrl__content {display: block; margin-bottom: 20px;}
@media screen and (min-width: 760px) {
	.pwidget {left: 50%; bottom: 50%; right: auto; translate: -50% 50%; width: 400px;}
	.pwidget::before {display: none;}
}


/* LOGIN
----------------------------------------------- */
.lgn {position: fixed; z-index: 999; left: 50%; top: 50%; translate: -50% -50%; width: 500px; max-width: calc(100% - 40px);}
.lgn__content {background-color: var(--bg); box-shadow: var(--bsh-long); padding: 30px 60px; position: relative;}
.lgn__ctrl > * {color: #fff !important; font-size: 19px; font-weight: 500; height: 45px; position: relative; text-transform: uppercase;}
.lgn__ctrl span::before {content: ''; border: 10px solid transparent; border-bottom-color: var(--bg); 
	position: absolute; left: 50%; bottom: 0; margin-left: -10px; z-index: 5;}
.lgn__btn-close {font-size: 40px; color: #fff; position: absolute; right: -50px; top: 0; z-index: 10;}
.lgn__header {position: relative; padding-left: 80px; margin-bottom: 15px;}
.lgn__avatar {width: 60px; background-color: var(--bg-darker); color: var(--bg-darkest); font-size: 24px; 
	position: absolute; left: 0; top: 50%; translate: 0 -50%; overflow: hidden; border-radius: 50%;}
.lgn__title {font-size: 19px; font-weight: 500;}
.lgn__caption {color: var(--tt-fade); margin-top: 5px;}
.lgn__input input {height: 50px; line-height: 50px; border-radius: 0; padding: 0 30px;}
.lgn__input input::placeholder {font-size: 16px;}
.lgn__input input + input {margin-top: -1px;} 
.lgn__input input:focus {position: relative; z-index: 5;}
.lgn__btn button {height: 50px;}
.lgn__cell a {color: var(--ui-accent);}
.lgn__social-caption {font-size: 13px; color: var(--tt-fade); margin-top: 5px;}
.lgn__social-caption::before, .lgn__social-caption::after {content: ''; flex-grow: 1; background: var(--bdc); height: 1px;}
.lgn__social a {border-radius: 50%; width: 34px; height: 34px; display: grid; place-items: center;}
.lgn__social a img {height: 18px; width: 18px; display: block; filter: invert(1);}
.lgn__social-vk {background-color: #587ba1;}
.lgn__social-ok {background-color: #ff9800;}
.lgn__social-fb {background-color: #3b5998;}
.lgn__social-ml {background-color: #2196f3;}
.lgn__social-gg {background-color: #f44336;}
.lgn__social-ya {background-color: #fc3f1d;}
.lgn__social:not(:has(a)) {display: none;}
.lgn--logged {width: 400px;}
.lgn__menu a {display: flex; align-items: center; gap: 10px;}


/* plr
----------------------------------------------- */
.plr {position: fixed; left: 0; bottom: 0; width: 100%; z-index: 990;}
.plr__inner {background-color: rgba(255,255,255,0.8); backdrop-filter: blur(30px); 
	padding: 15px var(--indent); box-shadow: 0 -20px 40px rgba(0,0,0,0.1);}
.plr__middle {width: 600px;}
.plr__left {position: relative; padding-left: 60px;}
.plr__img {width: 50px; border-radius: var(--bdrs); box-shadow: var(--bsh); 
	position: absolute; left: 0; top: 50%; translate: 0 -50%;}
.plr__title {font-weight: 600; font-size: 15px;}
.plr__subtitle {color: var(--tt-fade); font-size: 14px; margin-top: 1px;}
.plr__top {padding: 0 60px;}
.plr__next-info {max-width: 100%; font-weight: 600; font-size: 15px;}
.plr__next-info span {font-size: 10px; text-transform: uppercase; color: var(--tt-fade); margin-bottom: 3px;}
.plr__time {width: 40px; font-weight: 600; font-size: 12px;}
.plr__time-total {text-align: right;}
.plr__bar {height: 6px; border-radius: 3px; position: relative; background-color: rgba(0,0,0,0.1);}
.plr__bar input {height: 100%; width: 100%; position: absolute; left: 0; top: 0; opacity: 0; cursor: pointer;}
.plr__bar::before {content: ''; position: absolute; left: 0; top: 0; height: 100%;
	width: var(--range-progress,0%); border-radius: inherit; background-color: var(--accent);}
.plr__bar-vol {height: 4px; border-radius: 2px;}
.plr__bar-vol::before {background-color: rgba(0,0,0,0.3);}
.plr__prev, .plr__next {border-radius: 50%; color: var(--accent); font-size: 14px; height: 30px;}
.plr__shuffle, .plr__repeat, .plr__mute, .plr__playlist {border-radius: 50%; color: var(--tt-fade); font-size: 14px; height: 30px;}
.plr__play {border-radius: 50%; border: 1px solid var(--accent); color: var(--accent); 
	padding-left: 3px; font-size: 10px; height: 30px;}
.plr__playlist span {font-size: 12px;}

.plr__playlist-list {position: absolute; left: 50%; bottom: 100%; translate: -50% 0; margin-bottom: 10px; width: 600px; 
	background-color: var(--bg); box-shadow: var(--bsh); border-radius: var(--bdrs); padding-bottom: 30px; display: none;}
.plr__playlist-list::before {content: ''; border: 10px solid transparent; border-top-color: var(--bg); 
	position: absolute; top: 100%; left: 50%; translate: -50% 0; z-index: 5;}
.plr__playlist-list-title {height: 80px; font-size: 18px; font-weight: 600; padding: 0 30px; cursor: pointer;}
.plr__playlist-list-content {overflow-x: hidden; overflow-y: auto; height: 400px;}
.plr__trc {border-top: 1px solid var(--bdc); padding: 15px 30px; cursor: pointer; gap: 15px;}
.plr__trc-img {width: 50px; border-radius: 10px; overflow: hidden;}
.plr__trc-img::before {position: absolute; inset: 0; z-index: 3; background-color: var(--accent); color: #fff; 
	display: grid; place-items: center; font-size: 12px; opacity: 0;}
.plr__trc-title {font-weight: 600;}
.plr__trc-subtitle {color: var(--tt-fade); margin-top: 3px;}
.plr__trc-time {color: var(--tt-fade);}
.plr__trc:hover, .plr__trc.is-active {background-color: var(--bg-darker);}
.plr__trc.is-active .plr__trc-img::before {opacity: 1;}
.plr__playlist-holder.is-active .plr__playlist-list {display: block;}
.plr__playlist-holder.is-active .plr__playlist {color: var(--accent);}

.plr--is-muted .plr__mute::before {content:"\f6a9";}
.plr--is-playing .plr__play::before {content:"\f04c";}
.plr--is-playing .plr__play {padding-left: 0;}
.plr--is-repeated .plr__btn-repeat:not(:hover), .plr--is-shuffled .plr__btn-repeat:not(:hover) 
{color: var(--accent);}
.plr--is-repeated .plr__repeat, .plr--is-shuffled .plr__shuffle {color: var(--accent);}
.plr--not-loaded button:not(.plr__play), .plr--not-loaded .plr__bar {pointer-events: none;}

.wrapper {padding-bottom: 88px;}
@media screen and (max-width: 1220px) {
	.plr__middle {width: 500px;}
	.plr__top {padding: 0;}
	.plr__playlist-holder {position: static;}
	.plr__playlist-list {width: 100vw; left: 0; translate: 0 0; 
		height: calc(100vh - 88px); height: calc(100dvh - 88px); border-radius: 0; margin: 0;}
	.plr__playlist-list::before {display: none;}
	.plr__playlist-list-content {height: calc(100% - 110px);}
	.scrolltop {bottom: 100px; display: none !important;}
}
@media screen and (max-width: 950px) {
	.plr__middle {width: 100%;}
	.plr__left, .plr__right {display: none;}
}
@media screen and (max-width: 590px) {
	.wrapper {padding-bottom: 75px;}
	.plr__top {gap: 10px;}
	.plr__middle {display: block;}
	.plr__ctrl {gap: 10px;}
	.plr__vol {justify-content: flex-end;}
	.plr__bar-vol {display: none;}
	.plr__bottom {position: absolute; left: 0; right: 0; bottom: 100%;}
	.plr__time {position: absolute; left: var(--indent); height: 15px; font-weight: 400; font-size: 10px; z-index: 3;
		display: flex; align-items: center; width: auto; pointer-events: none;}
	.plr__time-total {left: auto; right: var(--indent);}
	.plr__bar-progress {height: 15px; border-radius: 0; background-color: var(--bg-darker-1);}
	.plr__playlist-list {height: calc(100vh - 60px); height: calc(100dvh - 60px);}
}

.trc__ctrl li {margin-bottom: 10px; cursor: pointer; height: 30px;}
.trc__ctrl li:hover span, .trc__ctrl li:hover a {text-decoration: underline;}
/*
.cols__sidebar-sticky, .plr {position: static;}
.wrapper {padding-bottom: 40px;}
body {background-repeat: repeat; background-attachment: scroll;}
*/

.toasts {position: fixed; right: 10px; top: 20px; z-index: 990; display: grid; gap: 20px;}
.toast {background-color: #fff; color: #000; border-radius: 6px; overflow: hidden;
	position: relative; width: 400px; display: flex; align-items: center; gap: 20px; 
	padding: 16px 20px; box-shadow: 0 5px 20px rgba(0,0,0,0.2); --accent: #00a2ff; 
	animation: showToast 0.5s ease forwards; max-width: calc(100vw - 40px);}
.toast__icon {font-size: 28px; color: var(--accent);}
.toast__title {font-weight: 500;}
.toast__text {font-size: 14px;}
.toast__close {font-size: 18px; margin: 0 -10px; display: grid; place-items: center; 
	cursor: pointer; opacity: 0.6; width: 40px; height: 40px;}
.toast::after {content: ''; width: 100%; height: 3px; background-color: var(--accent); 
	position: absolute; left: 0; bottom: 0; animation: progressToast var(--toast-timer) linear forwards}
.toast--success {--accent: #41b92f;}
.toast--warning {--accent: #f4bd00;}
.toast--error {--accent: #dd3954;}
.toast--is-hiding {animation: hideToast 0.5s ease forwards;}
@keyframes progressToast {
	100% {width: 0}
}
@keyframes showToast {
	0% {transform: translateX(calc(100% + 20px));}
	40% {transform: translateX(-5%);}
	80% {transform: translateX(0%);}
	100% {transform: translateX(-10px);}
}
@keyframes hideToast {
	0% {transform: translateX(-10px);}
	40% {transform: translateX(0%);}
	80% {transform: translateX(-5%);}
	100% {transform: translateX(calc(100% + 20px));}
}











:root {
  /* --default variation only 👇 */
  --select-icon-size: 16px;
  --select-icon-margin: 1rem; /* icon right/left position */
  --select-text-icon-gap: 0.5rem; /* gap between text and icon */
}

.select {
  position: relative;
}

.select__input {
  appearance: none;
  border: 0;
  margin: 0;
  font-size: 1rem;
  width: 100%;
  height: 100%;
  padding: 0.5rem calc(var(--select-icon-size) + var(--select-icon-margin) + var(--select-text-icon-gap));
  -webkit-user-select: none;
          user-select: none;
  box-shadow: inset 0 1px 0 hsla(0, 0%, 100%, 0.1), 0 0 0 1px hsla(230, 13%, 9%, 0.02), 0 0.3px 0.4px hsla(230, 13%, 9%, 0.025), 0 1px 3px -1px hsla(230, 13%, 9%, 0.2), 0 3.5px 6px hsla(230, 13%, 9%, 0.12);
  border-radius: 0.375em;
  transition: box-shadow 0.2s;
}

.select__input:focus  {
  outline: none;
  box-shadow: inset 0 1px 0 hsla(0, 0%, 100%, 0.1), 0 0 0 1px hsla(230, 13%, 9%, 0.02), 0 0.3px 0.4px hsla(230, 13%, 9%, 0.025), 0 1px 3px -1px hsla(230, 13%, 9%, 0.2), 0 3.5px 6px hsla(230, 13%, 9%, 0.12), 0 0 0 2px hsl(0, 0%, 100%), 0 0 0 4px hsl(230, 7%, 23%);
}

.select__arrow,
.select__flag {
  display: inline-block;
  width: var(--select-icon-size);
  height: var(--select-icon-size);
  pointer-events: none;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

.select__arrow {
  color: inherit;
  right: var(--select-icon-margin);
}

.select__flag {
  left: var(--select-icon-margin);
  background-position: center;
  background-repeat: no-repeat;
  background-size: var(--select-icon-size);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cg%3E%3Cpath d='M16 0c-8.8 0-16 7.2-16 16s7.2 16 16 16 16-7.2 16-16-7.2-16-16-16z m11.8 14h-3.8c-0.2-3-0.8-5.8-1.6-8.2 2.8 1.8 4.8 4.8 5.4 8.2z m-11.8 14c-1.2 0-3.6-3.8-4-10h8c-0.4 6.2-2.8 10-4 10z m-4-14c0.4-6.2 2.6-10 4-10s3.6 3.8 4 10h-8z m-2.2-8.2c-1 2.4-1.6 5.2-1.8 8.2h-3.8c0.6-3.4 2.6-6.4 5.6-8.2z m-5.6 12.2h3.8c0.2 3 0.8 5.8 1.6 8.2-2.8-1.8-4.8-4.8-5.4-8.2z m18 8.2c1-2.4 1.4-5.2 1.6-8.2h3.8c-0.4 3.4-2.4 6.4-5.4 8.2z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}

.select:has(option[value="IT"]:checked) .select__flag {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cg%3E%3Cpath fill='%23fff' d='M10 4H22V28H10z'%3E%3C/path%3E%3Cpath d='M5,4h6V28H5c-2.208,0-4-1.792-4-4V8c0-2.208,1.792-4,4-4Z' fill='%2341914d'%3E%3C/path%3E%3Cpath d='M25,4h6V28h-6c-2.208,0-4-1.792-4-4V8c0-2.208,1.792-4,4-4Z' transform='rotate(180 26 16)' fill='%23bf393b'%3E%3C/path%3E%3Cpath d='M27,4H5c-2.209,0-4,1.791-4,4V24c0,2.209,1.791,4,4,4H27c2.209,0,4-1.791,4-4V8c0-2.209-1.791-4-4-4Zm3,20c0,1.654-1.346,3-3,3H5c-1.654,0-3-1.346-3-3V8c0-1.654,1.346-3,3-3H27c1.654,0,3,1.346,3,3V24Z' opacity='.15'%3E%3C/path%3E%3Cpath d='M27,5H5c-1.657,0-3,1.343-3,3v1c0-1.657,1.343-3,3-3H27c1.657,0,3,1.343,3,3v-1c0-1.657-1.343-3-3-3Z' fill='%23fff' opacity='.2'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}

.select:has(option[value="ES"]:checked) .select__flag {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cg%3E%3Cpath fill='%23f1c142' d='M1 10H31V22H1z'%3E%3C/path%3E%3Cpath d='M5,4H27c2.208,0,4,1.792,4,4v3H1v-3c0-2.208,1.792-4,4-4Z' fill='%23a0251e'%3E%3C/path%3E%3Cpath d='M5,21H27c2.208,0,4,1.792,4,4v3H1v-3c0-2.208,1.792-4,4-4Z' transform='rotate(180 16 24.5)' fill='%23a0251e'%3E%3C/path%3E%3Cpath d='M27,4H5c-2.209,0-4,1.791-4,4V24c0,2.209,1.791,4,4,4H27c2.209,0,4-1.791,4-4V8c0-2.209-1.791-4-4-4Zm3,20c0,1.654-1.346,3-3,3H5c-1.654,0-3-1.346-3-3V8c0-1.654,1.346-3,3-3H27c1.654,0,3,1.346,3,3V24Z' opacity='.15'%3E%3C/path%3E%3Cpath d='M27,5H5c-1.657,0-3,1.343-3,3v1c0-1.657,1.343-3,3-3H27c1.657,0,3,1.343,3,3v-1c0-1.657-1.343-3-3-3Z' fill='%23fff' opacity='.2'%3E%3C/path%3E%3Cpath d='M12.614,13.091c.066-.031,.055-.14-.016-.157,.057-.047,.02-.15-.055-.148,.04-.057-.012-.144-.082-.13,.021-.062-.042-.127-.104-.105,.01-.068-.071-.119-.127-.081,.004-.068-.081-.112-.134-.069-.01-.071-.11-.095-.15-.035-.014-.068-.111-.087-.149-.028-.027-.055-.114-.057-.144-.004-.03-.047-.107-.045-.136,.002-.018-.028-.057-.044-.09-.034,.009-.065-.066-.115-.122-.082,.002-.07-.087-.111-.138-.064-.013-.064-.103-.087-.144-.036-.02-.063-.114-.075-.148-.017-.036-.056-.129-.042-.147,.022-.041-.055-.135-.031-.146,.036-.011-.008-.023-.014-.037-.016,.006-.008,.01-.016,.015-.025h.002c.058-.107,.004-.256-.106-.298v-.098h.099v-.154h-.099v-.101h-.151v.101h-.099v.154h.099v.096c-.113,.04-.169,.191-.11,.299h.002c.004,.008,.009,.017,.014,.024-.015,.002-.029,.008-.04,.017-.011-.067-.106-.091-.146-.036-.018-.064-.111-.078-.147-.022-.034-.057-.128-.046-.148,.017-.041-.052-.131-.028-.144,.036-.051-.047-.139-.006-.138,.064-.056-.033-.131,.017-.122,.082-.034-.01-.072,.006-.091,.034-.029-.047-.106-.049-.136-.002-.03-.054-.117-.051-.143,.004-.037-.059-.135-.04-.149,.028-.039-.06-.14-.037-.15,.035-.053-.043-.138,0-.134,.069-.056-.038-.137,.013-.127,.081-.062-.021-.125,.044-.104,.105-.05-.009-.096,.033-.096,.084h0c0,.017,.005,.033,.014,.047-.075-.002-.111,.101-.055,.148-.071,.017-.082,.125-.016,.157-.061,.035-.047,.138,.022,.154-.013,.015-.021,.034-.021,.055h0c0,.042,.03,.077,.069,.084-.023,.048,.009,.11,.06,.118-.013,.03-.012,.073-.012,.106,.09-.019,.2,.006,.239,.11-.015,.068,.065,.156,.138,.146,.06,.085,.133,.165,.251,.197-.021,.093,.064,.093,.123,.118-.013,.016-.043,.063-.055,.081,.024,.013,.087,.041,.113,.051,.005,.019,.004,.028,.004,.031,.091,.501,2.534,.502,2.616-.001v-.002s.004,.003,.004,.004c0-.003-.001-.011,.004-.031l.118-.042-.062-.09c.056-.028,.145-.025,.123-.119,.119-.032,.193-.112,.253-.198,.073,.01,.153-.078,.138-.146,.039-.104,.15-.129,.239-.11,0-.035,.002-.078-.013-.109,.044-.014,.07-.071,.049-.115,.062-.009,.091-.093,.048-.139,.069-.016,.083-.12,.022-.154Zm-.296-.114c0,.049-.012,.098-.034,.141-.198-.137-.477-.238-.694-.214-.002-.009-.006-.017-.011-.024,0,0,0-.001,0-.002,.064-.021,.074-.12,.015-.153,0,0,0,0,0,0,.048-.032,.045-.113-.005-.141,.328-.039,.728,.09,.728,.393Zm-.956-.275c0,.063-.02,.124-.054,.175-.274-.059-.412-.169-.717-.185-.007-.082-.005-.171-.011-.254,.246-.19,.81-.062,.783,.264Zm-1.191-.164c-.002,.05-.003,.102-.007,.151-.302,.013-.449,.122-.719,.185-.26-.406,.415-.676,.73-.436-.002,.033-.005,.067-.004,.101Zm-1.046,.117c0,.028,.014,.053,.034,.069,0,0,0,0,0,0-.058,.033-.049,.132,.015,.152,0,0,0,.001,0,.002-.005,.007-.008,.015-.011,.024-.219-.024-.495,.067-.698,.206-.155-.377,.323-.576,.698-.525-.023,.015-.039,.041-.039,.072Zm3.065-.115s0,0,0,0c0,0,0,0,0,0,0,0,0,0,0,0Zm-3.113,1.798v.002s-.002,0-.003,.002c0-.001,.002-.003,.003-.003Z' fill='%239b8028'%3E%3C/path%3E%3Cpath d='M14.133,16.856c.275-.65,.201-.508-.319-.787v-.873c.149-.099-.094-.121,.05-.235h.072v-.339h-.99v.339h.075c.136,.102-.091,.146,.05,.235v.76c-.524-.007-.771,.066-.679,.576h.039s0,0,0,0l.016,.036c.14-.063,.372-.107,.624-.119v.224c-.384,.029-.42,.608,0,.8v1.291c-.053,.017-.069,.089-.024,.123,.007,.065-.058,.092-.113,.083,0,.026,0,.237,0,.269-.044,.024-.113,.03-.17,.028v.108s0,0,0,0v.107s0,0,0,0v.107s0,0,0,0v.108s0,0,0,0v.186c.459-.068,.895-.068,1.353,0v-.616c-.057,.002-.124-.004-.17-.028,0-.033,0-.241,0-.268-.054,.008-.118-.017-.113-.081,.048-.033,.034-.108-.021-.126v-.932c.038,.017,.073,.035,.105,.053-.105,.119-.092,.326,.031,.429l.057-.053c.222-.329,.396-.743-.193-.896v-.35c.177-.019,.289-.074,.319-.158Z' fill='%239b8028'%3E%3C/path%3E%3Cpath d='M8.36,16.058c-.153-.062-.39-.098-.653-.102v-.76c.094-.041,.034-.115-.013-.159,.02-.038,.092-.057,.056-.115h.043v-.261h-.912v.261h.039c-.037,.059,.039,.078,.057,.115-.047,.042-.108,.118-.014,.159v.873c-.644,.133-.611,.748,0,.945v.35c-.59,.154-.415,.567-.193,.896l.057,.053c.123-.103,.136-.31,.031-.429,.032-.018,.067-.036,.105-.053v.932c-.055,.018-.069,.093-.021,.126,.005,.064-.059,.089-.113,.081,0,.026,0,.236,0,.268-.045,.024-.113,.031-.17,.028v.401h0v.215c.459-.068,.895-.068,1.352,0v-.186s0,0,0,0v-.108s0,0,0,0v-.107s0,0,0,0v-.107s0,0,0,0v-.108c-.056,.002-.124-.004-.169-.028,0-.033,0-.241,0-.269-.055,.008-.119-.018-.113-.083,.045-.034,.03-.107-.024-.124v-1.29c.421-.192,.383-.772,0-.8v-.224c.575,.035,.796,.314,.653-.392Z' fill='%239b8028'%3E%3C/path%3E%3Cpath d='M12.531,14.533h-4.28l.003,2.572v1.485c0,.432,.226,.822,.591,1.019,.473,.252,1.024,.391,1.552,.391s1.064-.135,1.544-.391c.364-.197,.591-.587,.591-1.019v-4.057Z' fill='%23a0251e'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}
.select:has(option[value="PT"]:checked) .select__flag {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cg%3E%3Cpath d='M5,4H13V28H5c-2.208,0-4-1.792-4-4V8c0-2.208,1.792-4,4-4Z' fill='%232b6519'%3E%3C/path%3E%3Cpath d='M16,4h15V28h-15c-2.208,0-4-1.792-4-4V8c0-2.208,1.792-4,4-4Z' transform='rotate(180 21.5 16)' fill='%23ea3323'%3E%3C/path%3E%3Cpath d='M27,4H5c-2.209,0-4,1.791-4,4V24c0,2.209,1.791,4,4,4H27c2.209,0,4-1.791,4-4V8c0-2.209-1.791-4-4-4Zm3,20c0,1.654-1.346,3-3,3H5c-1.654,0-3-1.346-3-3V8c0-1.654,1.346-3,3-3H27c1.654,0,3,1.346,3,3V24Z' opacity='.15'%3E%3C/path%3E%3Cpath d='M27,5H5c-1.657,0-3,1.343-3,3v1c0-1.657,1.343-3,3-3H27c1.657,0,3,1.343,3,3v-1c0-1.657-1.343-3-3-3Z' fill='%23fff' opacity='.2'%3E%3C/path%3E%3Ccircle cx='12' cy='16' r='5' fill='%23ff5'%3E%3C/circle%3E%3Cpath d='M14.562,13.529l-5.125-.006v3.431h0c.004,.672,.271,1.307,.753,1.787,.491,.489,1.132,.759,1.805,.759,.684,0,1.328-.267,1.813-.75,.485-.484,.753-1.126,.753-1.808v-3.413Z' fill='%23ea3323'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}
/* region-test-marker */
/* Country Menu CSS Icons */
.side-menu__liste--regions a{min-height:42px;border-radius:14px;transition:background-color .25s ease,color .25s ease,transform .25s ease;}
.side-menu__liste--regions li:hover{background:transparent;}
.side-menu__liste--regions a:hover{background:rgba(255,255,255,0.08)!important;transform:translateX(2px);}
.side-menu__liste--regions .side-menu__flag{width:28px;height:28px;border-radius:50%;border:1px solid rgba(255,255,255,0.16);box-shadow:0 6px 14px rgba(8,12,20,0.22);background:rgba(255,255,255,0.9);overflow:hidden;}
.side-menu__liste--regions .side-menu__flag::before,.side-menu__liste--regions .side-menu__flag::after{content:"";position:absolute;inset:0;}
.side-menu__liste--regions .side-menu__flag--ru{background:linear-gradient(180deg,#fff 0 33.33%,#2d63d4 33.33% 66.66%,#d63b3b 66.66% 100%);}
.side-menu__liste--regions .side-menu__flag--world{background:radial-gradient(circle at 35% 35%,rgba(255,255,255,.28),transparent 18%),linear-gradient(135deg,#67b8ff 0%,#417dff 100%);}
.side-menu__liste--regions .side-menu__flag--world::before{inset:5px;border:1.5px solid rgba(255,255,255,.9);border-radius:50%;}
.side-menu__liste--regions .side-menu__flag--world::after{inset:8px;border-top:1.5px solid rgba(255,255,255,.9);border-bottom:1.5px solid rgba(255,255,255,.9);border-radius:50%;}
.side-menu__liste--regions .side-menu__flag--tr{background:#d63a45;}
.side-menu__liste--regions .side-menu__flag--tr::before{width:12px;height:12px;left:6px;top:8px;border-radius:50%;background:#fff;}
.side-menu__liste--regions .side-menu__flag--tr::after{width:10px;height:10px;left:9px;top:9px;border-radius:50%;background:#d63a45;box-shadow:8px 1px 0 -4px #fff;}
.side-menu__liste--regions .side-menu__flag--uz{background:linear-gradient(180deg,#33a9ff 0 28%,#fff 28% 31%,#d94253 31% 34%,#fff 34% 66%,#d94253 66% 69%,#1f9f57 69% 100%);}
.side-menu__liste--regions .side-menu__flag--kz{background:linear-gradient(135deg,#44c8ef 0%,#1aa7db 100%);}
.side-menu__liste--regions .side-menu__flag--kz::before{width:10px;height:10px;left:9px;top:9px;border-radius:50%;background:rgba(255,215,74,.95);}
.side-menu__liste--regions .side-menu__flag--kg{background:linear-gradient(135deg,#f14545 0%,#d92d2d 100%);}
.side-menu__liste--regions .side-menu__flag--kg::before{width:12px;height:12px;left:8px;top:8px;border-radius:50%;border:2px solid #ffd76a;}
.side-menu__liste--regions .side-menu__flag--az{background:linear-gradient(180deg,#33b6e6 0 33.33%,#cf3648 33.33% 66.66%,#31a35e 66.66% 100%);}
.side-menu__liste--regions .side-menu__flag--am{background:linear-gradient(180deg,#d7434f 0 33.33%,#3457c8 33.33% 66.66%,#e19d3a 66.66% 100%);}
.side-menu__liste--regions .side-menu__flag--ge{background:#fff;}
.side-menu__liste--regions .side-menu__flag--ge::before{background:linear-gradient(90deg,transparent 43%,#e04646 43% 57%,transparent 57%),linear-gradient(180deg,transparent 43%,#e04646 43% 57%,transparent 57%);}
.side-menu__liste--regions .side-menu__flag--ge::after{inset:6px;background:linear-gradient(90deg,transparent 45%,rgba(224,70,70,.85) 45% 55%,transparent 55%),linear-gradient(180deg,transparent 45%,rgba(224,70,70,.85) 45% 55%,transparent 55%);opacity:.65;}



button.track-ctrl {
        font-size: 15px;
    color: var(--accent);
    background: var(--accent-fade);
    /* height: 37px; */
    border-radius: 13px;
    padding: 11px;
}

button.track-ctrl:hover {
    background:var(--ui-bg-btn-hover);
    color: #fff;
}