/* BASIC LAYOUT
----------------------------------------------- */
.wrapper {min-width: 320px; position: relative; padding-top: 50px; padding-bottom: 70px;}
.wrapper__container {max-width: var(--max-width); margin: 0 auto; position: relative; z-index: 20;}
.wrapper__main {display: grid; grid-template-columns: 280px minmax(0,1fr); background-color: var(--bg-darker); min-height: 80vh; 
	grid-template-areas: "header header" "nav nav" "sidebar content"; box-shadow: 0 20px 30px rgba(0,0,0,0.1); border-radius: var(--bdrs);}
.header {background-color: var(--bg); grid-area: header; border-radius: var(--bdrs) var(--bdrs) 0 0; box-shadow: 0 5px 5px rgba(0,0,0,0.03);
	border-bottom: 1px solid var(--bdc); padding: 0 40px; position: relative; z-index: 100; height: 70px;}
.content {min-height: 80vh; grid-area: content; padding: 40px; overflow: hidden;}
.nav {grid-area: nav; background-color: var(--bg); border-bottom: 1px solid var(--bdc); position: relative; z-index: 95;}
.sidebar {grid-area: sidebar; border-right: 1px solid var(--bdc); padding: 40px; position: relative; z-index: 90;
	background-color: var(--bg); box-shadow: 5px 0 5px rgba(0,0,0,0.03); border-radius: 0 0 0 var(--bdrs);}
.footer {grid-area: footer; padding: 40px; padding-top: 40px;}
.footer__two {margin-top: 10px; gap: 20px 40px; font-size: 14px; color: var(--tt-fade);}
.wrapper-bg::before, .wrapper-bg::after {content: ''; width: 50vw; height: 300px; border-radius: 20px; background: var(--bg-gradient); 
	position: absolute; top: -100px; right: -10vw; transform: rotate(10deg); 
	box-shadow: 0 0 0 40px rgba(97,199,82,0.3), 0 0 0 80px rgba(97,199,82,0.1);}
.wrapper-bg::after {right: auto; left: -10vw; transform: rotate(-10deg); top: 60vh;}
.scrolltop {position: fixed; width: 50px; height: 50px; right: -60px; bottom: 90px;
	z-index: 980; border-radius: 50%; font-size: 20px; opacity: 0; transition: right 0.2s, opacity 0.2s;}
.scrolltop.is-active {right: 10px; opacity: 1;}
.wrapper-bg {overflow: hidden; position: absolute; inset: 0;}


/* HEADER
----------------------------------------------- */
.logo {display: inline-flex; flex-direction: column; justify-content: center; height: 40px;
	padding-left: 43px; font-weight: 700; font-size: 24px; min-width: 240px; position: relative;
	background: url(../images/logo.svg) 0 center / 30px no-repeat; background: none;}
.logo svg {width: 30px; height: 30px; position: absolute; left: 0; top: 50%; transform: translateY(-50%); }
.logo svg path {fill: var(--accent-secondary) !important;}
.search-block {position: relative; width: 320px; margin: 0 40px;}
.search-block__input, .search-block__input:focus {border-radius: 0px; padding: 0 0 0 50px; 
	border: 0; box-shadow: none; background-color: transparent; color: var(--tt);}
.search-block__input:not(:focus)::placeholder {color: var(--tt-fade); opacity: 1; font-size: 14px;}
.search-block__btn {position: absolute; left: 0; top: 0; width: auto; 
	border-radius: 0px; font-size: 18px; color: var(--tt-fade);}
.logo img {width: 30px; height: 30px; position: absolute; left: 0; top: 50%; transform: translateY(-50%); }
.nav__list {gap: 0 30px; padding: 0 40px;}
.nav__menu > li {position: relative;}
.nav__list > li > a {display: flex; align-items: center; height: 60px; font-weight: 400; gap: 10px;}
.nav__menu-submenu {width: 240px; padding: 15px 30px; border-radius: 0 0 4px 4px; display: grid; gap: 10px; 
	position: absolute; left: 0px; top: 100%; background: var(--bg); box-shadow: 0 12px 12px rgba(0,0,0,0.27); 
	opacity: 0; visibility: hidden; transform: translateY(30px);}
.nav__menu-submenu li + li {border-top: 1px dashed var(--bdc); padding-top: 10px;}
.nav__menu-has-submenu > a::after {content:"\f107"; font-weight: 300; font-family:'Font Awesome 5 Pro';}


/* SECTION
----------------------------------------------- */
.sect {margin-bottom: 40px;}
.sect__header {margin-bottom: 40px; gap: 20px; line-height: 1;}
.sect__title {font-size: 24px; font-weight: 700;}
.sect__subtitle {font-size: 18px;}
.sect__link {color: var(--accent-secondary); gap: 10px; font-size: 13px; text-transform: uppercase; font-weight: 700;}
.sect__content--tracks {margin-left: -40px; margin-right: -40px;
	border: 1px solid var(--bdc); border-left: 0; border-right: 0; 
	display: grid; gap: 0; grid-template-columns: repeat(auto-fill,minmax(400px,1fr));}
.sect__content--collections {grid-template-columns: repeat(auto-fill,minmax(400px,1fr));}

	.speedbar:before {color: var(--accent-primary); margin-right: 5px;}
	.speedbar {border-bottom: 1px solid var(--bdc); padding: 0 40px; padding-bottom: 20px; 
	margin: -20px -40px; margin-bottom: 20px; font-size: 13px; color: var(--tt-fade);}
    .speedbar a {color: var(--tt);}
	body:has(.page) .speedbar {margin-bottom: 40px;}
@media screen and (max-width: 1220px) {
	.speedbar {padding-left: 20px; padding-right: 20px; margin-left: -20px; margin-right: -20px;}
}
.site-desc {display: grid; gap: 15px; line-height: 1.6; font-size: 14px; padding: 40px 0;}
.site-desc h1, .site-desc h2, .site-desc h3 {font-size: 18px; color: var(--tt); line-height: 1.3;}
.site-desc a {text-decoration: underline; color: var(--accent-secondary);}


/* TRACK ITEM
----------------------------------------------- */
.trc {gap: 20px; position: relative;}
.trc + .trc {margin-top: 20px;}
.sect__content--tracks .trc {padding: 20px 40px; margin: -1px 0 0 -1px; 
	border-top: 1px solid var(--bdc); border-left: 1px solid var(--bdc); padding-left: 80px;}
.trc__count {position: absolute; left: 40px; top: 50%; transform: translateY(-50%); 
	font-size: 14px; font-weight: 700; color: var(--tt-fade);}
.trc__img {width: 40px; height: 40px; border-radius: 50%;}
.trc__title {font-weight: 700;}
.trc__subtitle {font-size: 14px; color: var(--tt-fade); margin-top: 2px;}
.trc__fav a {font-size: 18px; color: var(--tt-fade);}
.trc__play {padding: 0; width: 40px; height: 40px; font-size: 10px; border-radius: 50%; padding-left: 1px;
	color: var(--tt-fade); border: 1px solid var(--bdc); background-color: transparent;}
.trc__desc::before {left: -60px;}
.sect__content--tracks .trc__desc::before {left: -100px;}
.trc__to-playlist {color: var(--tt-fade); min-width: 30px; height: 30px; border-radius: 50%; margin: 0 -20px 0 -10px;}
.ctrl {position: fixed; left: 50%; top: 50%; z-index: 999; transform: translate(-50%,-50%); width: max-content;}
.ctrl li {cursor: pointer; margin-bottom: 20px; border-radius: 10px; 
	padding: 20px 40px; background-color: var(--bg); box-shadow: var(--bsh);}

.js-item-current .trc__play:not(:hover) {border-color: var(--accent-primary); color: var(--accent-primary);}
.js-item-loading .trc__play::before {
    content:"\f110" !important; /* fa-spinner */
    margin-left: 0;
    display: inline-block;
    animation: trcspin 0.9s linear infinite !important;
}
.js-item-error .trc__play {
    border-color: var(--red) !important;
    color: var(--red) !important;
}
.js-item-error .trc__play::before {
    content:"\f071" !important; /* fa-exclamation-triangle */
    margin-left: 0;
    display: inline-block;
    animation: none !important;
}
.js-item-played .trc__play::before {content:"\f04c"; margin-left: -1px;}
.trc.js-item-played {z-index: 5; box-shadow: var(--bsh); background-color: var(--bg);}

@keyframes trcspin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}


/* ARTIST ITEM
----------------------------------------------- */
.artist {display: block; overflow: hidden; border: 1px solid var(--bdc); background-color: var(--bg); box-shadow: var(--bsh);}
.artist__img {padding-top: 100%;}
.artist__desc {padding: 20px 15px;}
.artist__title {font-weight: 700; font-size: 14px;}
.artist__subtitle {font-size: 13px; color: var(--tt-fade); margin-top: 2px;}
.artist__img::after {content:"\f04b"; font-family:'Font Awesome 5 Pro'; font-weight: 900; display: grid;
	width: 40px; height: 40px; border-radius: 50%; padding-left: 3px; box-sizing: border-box; place-items: center;
	background-color: var(--green); color: #fff; position: absolute; right: 20px; bottom: -20px; font-size: 10px;}
.artist:nth-child(n) .artist__img::after {background-color: var(--yellow);}
.artist:nth-child(2n) .artist__img::after {background-color: var(--green);}
.artist:nth-child(3n) .artist__img::after {background-color: var(--red);}
.artist:nth-child(4n) .artist__img::after {background-color: var(--blue);}
.artist:nth-child(5n) .artist__img::after {background-color: var(--grey);}
.artist:nth-child(6n) .artist__img::after {background-color: var(--violet);}


/* COLLECTION ITEM
----------------------------------------------- */
.sect__content--coll {padding: 0 160px; position: relative;}
.coll {overflow: hidden; box-shadow: var(--bsh);}
.coll__img {height: 260px; overflow: hidden;}
.coll__img::before {content: ''; background: var(--bg-gradient); position: absolute; inset: 0; z-index: 1; 
	mix-blend-mode: color;}
.coll__desc {position: absolute; left: 0; top: 0; height: 100%; width: 100%; padding: 30px 40px; padding-right: 40%;
	gap: 20px; z-index: 5; color: #fff; background: linear-gradient(to right, var(--accent-secondary), transparent);;}
.coll__title {font-weight: 700; font-size: 24px; line-height: 1.2; color: #fff;}
.coll__text {-webkit-line-clamp: 3;}
.coll__category {font-size: 13px; text-transform: uppercase; font-weight: 700; padding-top: 6px;}
@media screen and (min-width: 760px) {
	.sect__content--coll {padding: 0; height: 260px;}
	.sect__content--coll .coll {position: absolute; top: 0; left: 50%; width: 68%; margin-left: -34%; 
		transition: transform 0.3s ease-out, z-index 0.3s linear;}
	.sect__content--coll .coll.a2 {transform: translateX(33%) scale(0.8,0.8); z-index: -2;}
	.sect__content--coll .coll.a3 {transform: translateX(-33%) scale(0.8,0.8); z-index: -1;}
	.sect__content--coll .coll.a2 .coll__img::before, 
	.sect__content--coll .coll.a3 .coll__img::before {background: rgba(0,0,0,0.1); 
		backdrop-filter: blur(8px) grayscale(0.6); mix-blend-mode: unset;}
	.sect__content--coll .coll.a2 .coll__desc, .sect__content--coll .coll.a3 .coll__desc {display: none;}
}


/* SIDEBAR
----------------------------------------------- */
.sb-sticky {position: sticky; left: 0; top: 30px;}
.sb {display: grid; gap: 40px; margin-bottom: 40px;}
.side-menu {margin-bottom: 30px;}
.sb:last-child {margin-bottom: 0;}
.sb__title {margin-bottom: -8px !important;}
.side-menu__caption, .sb__title {font-weight: 700; font-size: 13px; text-transform: uppercase; margin-bottom: 18px;}
.side-menu__list a {height: 40px; line-height: 40px; display: block; padding-left: 30px; white-space: nowrap;}
.side-menu__list li {position: relative;}
.side-menu__list a .menu-badge-new {display: inline-block; margin-left: 8px; padding: 2px 7px; line-height: 1.2; font-size: 11px; font-weight: 700; text-transform: uppercase; color: #fff; background: #e53935; border-radius: 10px; vertical-align: middle;}
.side-menu__list li::before {pointer-events: none; font-size: 18px; color: var(--accent-primary);
	position: absolute; left: 0; top: 0; height: 40px; width: 18px; display: grid; place-items: center;}
	
.side-menu__btn {width: 100%;}
.side__menu-submenu {position: absolute; left: 100%; top: 0; z-index: 1000;
	background-color: var(--bg); box-shadow: var(--bsh); width: 500px; padding: 30px 35px; 
	display: grid; gap: 5px 20px; grid-template-columns: repeat(auto-fill,minmax(150px,1fr)); display: none;}
.side__menu-submenu a {display: block; padding: 5px 10px;}
.side-genres:hover .side__menu-submenu {display: grid;}

.side-menu--btns + .side-menu--btns {margin-top: -20px;}
.side-menu__design button {width: 30px; height: 30px; border-radius: 15px; padding: 0; 
	background-color: var(--bg); border: 2px solid var(--bdc); color: var(--tt); font-weight: 400; font-size: 14px;}
.side-menu__design--cols button {width: 100%; text-transform: none;}
.side-menu--btns .side-menu__caption {margin-bottom: 10px;}
.side-menu--btns:nth-child(3) {border-bottom: 1px solid var(--bdc); padding-bottom: 36px;}
.side-menu__design li button.is-active {box-shadow: 0 0 0 1px var(--accent-primary); 
	border-color: var(--bg); color: var(--tt);}
.side-menu__design--btns li:nth-child(1) button {background-color: var(--green);}
.side-menu__design--btns li:nth-child(2) button {background-color: var(--red);}
.side-menu__design--btns li:nth-child(3) button {background-color: var(--blue);}
.side-menu__design--btns li:nth-child(4) button {background-color: var(--violet);}
.side-menu__design--btns li:nth-child(5) button {background-color: var(--yellow);}


/* FOOTER, PAGINATION
----------------------------------------------- */
.footer__soc {gap: 10px;}
.footer__soc-item {display: grid; place-items: center; height: 30px; width: 30px; border-radius: 50%; background-color: #2daae1;}
.vk {background-color: #1877f2;}
.yt {background-color: #df1111;}
.ok {background-color: #FFA500;}
.footer__soc img {width: 15px; height: 15px; filter: invert(1);}
.footer__text {line-height: 1.5; text-wrap: balance;}
.footer__menu {gap: 10px 40px;}

.pagination {gap: 20px 60px; padding-top: 40px;}
.pagination a, .pagination span {display: grid; place-items: center; 
	height: 36px; min-width: 36px; padding: 0 10px; border-radius: 18px; border: 1px solid var(--bdc);}
.pagination__pages {gap: 10px 10px; font-size: 14px;}
.pagination__pages span:not(.nav_ext) {background-color: var(--accent-primary); color: #fff; border-color: var(--accent-primary);}


/* INNER PAGE
----------------------------------------------- */
.page__cols {display: grid; grid-template-columns: minmax(0,1fr) 420px; 
	border-bottom: 1px solid var(--bdc); margin: -40px; margin-bottom: 40px;}
.page__cols-main, .page__cols-side {padding: 40px;}
.page__cols-side {border-left: 1px solid var(--bdc); padding-bottom: 0;}

.page__img {width: 160px; height: 160px; margin-right: 20px;}
.page__img > a, .page__poster > a {position: absolute; left: 0; top: 0; background-color: #000; color: #fff; padding: 5px 10px;}
.page__header-right h1 {font-size: 18px;}
.page__header-right h1 span {display: block; color: var(--tt-fade); font-size: 14px; font-weight: 400; margin-top: 5px;}
.page__tech {margin: 15px 0 20px; gap: 5px 15px; font-size: 12px;}
.page__tech li > span:first-child {color: var(--tt-fade);}
.page__ctrl {gap: 10px;}

/* Fullstory: left column under the Play button */
/*
  Важно: page__ctrl — flex-строка (d-flex), справа находится громкость.
  Чтобы «Добавить в закладки» не падало на новую строку, даём левому блоку flex:1,
  а строке действий запрещаем перенос.
*/
.page__ctrl-left{display:flex;flex:1;min-width:0;flex-direction:column;align-items:flex-start;gap:8px;}
.page__actions{display:flex;align-items:center;gap:16px;flex-wrap:nowrap;width:100%;min-width:0;}
.page__actions .page__fav{margin-left:auto;}
.page__fav{display:flex;align-items:center;gap:8px;min-width:auto;flex-shrink:0;white-space:nowrap;}
.page__fav a{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;}
.page__favlabel{font-size:13px;color:var(--tt-fade);line-height:1;white-space:nowrap;}

/* На узких экранах оставляем только иконку, чтобы всё точно помещалось в одну строку */
@media (max-width: 520px){
  .page__actions{
    gap:10px;
    flex-wrap:wrap;
    align-items:center;
  }
  .page__play{
    width:100%;
    justify-content:center;
  }
  .page__fav{
    width:100%;
    justify-content:flex-start;
  }
  .page__favlabel{display:none;}
  .page__btr{
    width:100%;
    align-items:flex-start;
  }
  .page__btr-list{
    width:100%;
  }
  .page__vl-box{
    width:100%;
    min-width:0;
  }
  .page__vl{
    flex:1;
    min-width:0;
  }
}


/* === Fullstory layout fix: keep bitrate & volume in correct rows === */
.page__ctrl{
  flex-direction: column;
  align-items: stretch !important; /* override .ai-center */
  gap: 14px;
}
.page__ctrl-left{ width: 100%; }
.page__vl-box{ width: 100%; }

/* Keep favorites right after Play (no huge empty gap) */
.page__actions .page__fav{ margin-left: 0 !important; }

/* Bitrate: keep label on same row; buttons can wrap inside list */
.page__btr{ flex-wrap: nowrap; }
.page__btr-title{ white-space: nowrap; }
.page__btr-list{ flex: 1; min-width: 0; }

/* Fullstory bitrate chooser */
.page__btr{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:12px;user-select:none;}
.page__btr-title{color:var(--tt-fade);}
.page__btr-list{display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.page__btr-btn{padding:3px 9px;border-radius:999px;border:1px solid var(--bdc);background:transparent;color:var(--tt);cursor:pointer;line-height:1;font-size:11px;transition:background-color .15s ease,border-color .15s ease,color .15s ease;}
.page__btr-btn:hover{
  border-color:var(--accent-primary);
  color:var(--accent-primary);
  background-color: rgba(0,0,0,0.05);
  background-color: color-mix(in srgb, var(--accent-primary) 12%, transparent);
}
.page__btr-btn.active{background:var(--accent-secondary);border-color:var(--accent-secondary);color:#fff;cursor:default;}
.page__btr-btn.active:hover{color:#fff;border-color:var(--accent-secondary);}

.page__ctrl.js-item-loading .page__play::before {
    content:"\f110" !important; /* fa-spinner */
    margin-left: 0;
    display: inline-block;
    animation: trcspin 0.9s linear infinite !important;
}
.page__ctrl.js-item-error .page__play {
    border-color: var(--red) !important;
    color: var(--red) !important;
}
.page__ctrl.js-item-error .page__play::before {
    content:"\f071" !important; /* fa-exclamation-triangle */
    margin-left: 0;
    display: inline-block;
    animation: none !important;
}
.page__ctrl.js-item-played .page__play::before {content:"\f04c"; margin-left: -1px;}
.page__dl {border: 2px solid var(--accent-primary); color: var(--accent-primary); background-color: transparent;}
.page__fav {min-width: auto;}

.page__caption {line-height: 1.4; display: block; position: relative; padding: 15px 40px;
	padding-left: 95px; font-size: 13px; isolation: isolate; margin: 0 -40px; margin-bottom: 40px;}
.page__caption::before {position: absolute; left: 40px; top: 20px; font-size: 34px; color: var(--accent-primary);}
.page__caption::after {content: ''; position: absolute; inset: 0; background: var(--accent-primary); opacity: 0.1;}

.page__clip {position: absolute; left: 0; top: 0; width: 100%; height: 100%; 
	padding-top: 0; background-color: #000; border-radius: 0;}
.page__clip::before {position: relative; z-index: 5; font-size: 40px; border: 2px solid var(--red); 
	padding-left: 5px; box-sizing: border-box; color: var(--red); width: 100px; height: 100px; border-radius: 50%;}
.page__text {color: var(--tt-fade); max-height: 230px; overflow-y: auto; overflow-x: hidden; margin-top: -10px;}
.page__text2 {color: var(--tt-fade);}
.scroller__content {scrollbar-width: thin; scrollbar-color: var(--accent-primary) rgba(0,0,0,0.1);}
.scroller__content::-webkit-scrollbar {width: 12px; height: 8px;}
.scroller__content::-webkit-scrollbar-thumb {border-radius: 0; background-color:var(--accent-primary); border: 0;}
.scroller__content::-webkit-scrollbar-track {background-color: rgba(0,0,0,0.1);}

.page--artist .page__tech {margin-bottom: 0;}
.page--artist .page__cols-main {padding-bottom: 0;}
.page--artist .page__caption {margin-bottom: 0;}
.page__poster {margin: -40px; height: 240px; margin-bottom: 0;}
.page__header-desc {position: absolute; left: 0; right: 0; bottom: 0; padding: 40px; color: #fff; z-index: 10;}
.page--collection .page__header {margin-bottom: 0; --tt-fade: #ccc;}


/* TEXT BLOCK, TYPOGRAPHY, VIDEO BLOCK
----------------------------------------------- */
.page__title {margin-bottom: 30px; font-size: 24px;}
.full-text {line-height: 1.5; font-size: 15px; word-wrap: break-word;}
.full-text a {text-decoration: underline; color: var(--blue);}
.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 #fcc506; 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: #fcc506; color: #000; 
	position: absolute; top: -3px; left: 17px; width: 24px; height: 30px; font-size: 14px; font-weight: 700;
	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: #fcc506; 
	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 table tr td {padding:10px; border:2px solid #fff;}
.full-text table tr:nth-child(2n+1) {background-color:#f2f6f9;} 
.full-text table tr:nth-child(1) {background-color:#cee0ed;}
.full-text table img:not(.emoji) {margin:0; max-width:350px}
.full-text > *:last-child {margin-bottom: 0;}
.video-responsive {padding-top: 60%; position: relative;}
.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;}
.full-text iframe {width: 100%; height: 400px; margin-bottom: 20px;}






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







/* COMMENTS
----------------------------------------------- */
.page__comments {margin-top: 0px;}
.page__comments-title {font-size: 24px; margin-bottom: 20px;}
.page__comments-info {color: var(--tt-fade); display: block; margin: -15px 0 20px; font-size: 14px; padding-left: 23px; position: relative;}
.page__comments-info::before {color: var(--ui-red); position: absolute; left: 0; top: 2px;}
.ac-form {margin-bottom: 30px; 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-toggle .ac-form__editor textarea {border-radius: 0; box-shadow: none;}
.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: 140px; resize: none;}
.ac-form__editor .bb-editor textarea {height: 140px; 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: flex; 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: 50%;}
.mass_comments_action .bbcodes {border-radius: 0; padding: 0 10px;}

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

.comm {margin-bottom: 20px; padding-bottom: 15px; border-bottom: 1px solid var(--bdc);}
.comm__img {width: 40px; height: 40px; border-radius: 50%; margin-right: 15px;}
.comm__img::before {content: ''; width: 8px; height: 8px; border-radius: 50%; background-color: var(--ui-red); 
	position: absolute; right: -1px; top: -1px; z-index: 5; border: 2px solid var(--bg);}
.comm--online .comm__img::before {background-color: var(--ui-green);}
.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: var(--ui-fw-bolder);}
.comm__author, .comm__author a {color: var(--tt-colored); font-weight: 700; font-size: 14px;}
.comm__date {color: var(--tt-fade); font-size: 13px; margin-top: 2px;}
.comm__main {margin: 10px 0 6px 0;}
.comm__action {gap: 20px; font-size: 13px;}
.comm__action li, .comm__action li a {color: var(--tt-fade); cursor: pointer; gap: 8px; display: flex; align-items: center;}
.comm__ctrl, .comm__ctrl a {font-size: 15px; gap: 10px 15px; color: var(--tt-fade);}
.comm__ctrl li.has-checkbox {transform: scale(0.8,0.8); margin: 0 -10px 0 -5px;}
.comm__ctrl li.has-checkbox input {border-color: var(--tt-fade);}
.comm__rating {gap: 10px; font-size: 14px;}
.comm__rating::before {content: attr(data-text); display: inline;}
.comm__rating > * {display: flex; gap: 5px;}
.comm__rating > * > span:first-child {text-decoration: underline; color: var(--ui-green);}
.comm__rating > * + * > span:first-child {color: var(--ui-red);}


/* LOGIN
----------------------------------------------- */
.login {position: fixed; z-index: 999; left: 50%; top: 50%; transform: translate(-50%,-50%);
	background-color: var(--ui-bg); width: 440px; border: 10px solid var(--ui-bg-darker); 
	box-shadow: 0 15px 45px rgba(0,0,0,1); overflow-y: auto;
	 max-width: calc(100vw - 40px); max-height: calc(100vh - 40px);}
.login__header {padding: 20px 50px 25px 50px; border-bottom: 1px solid var(--ui-bdc); position: relative;}
.login__title {font-size: 24px; font-weight: var(--ui-fw-bolder);}
.login__caption {
  font-size: 13px;
  color: green; /* или, например, #00c853 */
  margin-top: 3px;
}
.login__close {font-size: 23px; position: absolute; right: 10px; top: 10px; padding: 0; width: 40px; height: 40px;}
.login__content {display: grid; gap: 20px; padding: 25px 50px; padding-bottom: 50px; position: relative;}
.login__row, .login__row.fal, .login__row.fas {position: relative; display: grid; gap: 10px; justify-content: stretch;}
.login__row-caption a, .login__caption a {margin-left: 10px;}
.login__row::before {position: absolute; left: 2px; bottom: 0; width: 40px; height: 50px; 
	display: grid; place-items: center; opacity: 0.4; font-size: 18px;}
.login__input input {padding-left: 40px; border-radius: var(--ui-bdrs); height: 50px; line-height: 48px;}
.login__row button {width: 100%; height: 40px; border-radius: var(--ui-bdrs);}
.login__social {padding-top: 10px; text-align: center; gap: 10px; margin-bottom: -20px;}
.login__social-caption {font-size: 13px; color: var(--ui-tt-fade); width: 100%;}
.login__social a {padding: 0 10px; border-radius: 20px; position: relative; width: 40px; height: 40px; 
	overflow: hidden; color: #fff; display: flex; align-items: center; justify-content: center;}
.login__social a::before {content: ''; width: 40px; background: rgba(0,0,0,0); position: absolute; left: 0; top: 0; height: 100%;}
.login__social a img {position: absolute; left: 10px; top: 50%; height: 20px; width: 20px; z-index: 1; 
	display: block; filter: invert(1); transform: translateY(-50%);}
.login__social-vk {background-color: #587ba1;}
.login__social-ok {background-color: #ff9800;}
.login__social-fb {background-color: #3b5998;}
.login__social-ml {background-color: #2196f3;}
.login__social-gg {background-color: #f44336;}
.login__social-ya {background-color: #fc3f1d;}

.header__favlink {height: 70px; border-left: 1px solid var(--bdc); font-size: 28px; 
	padding: 0 20px; position: relative; display: grid; place-items: center; color: var(--tt-fade);}
.header__favlink.nl {border-right: 1px solid var(--bdc); margin-right: 40px;}
.header__favlink span {background-color: var(--red); color: #fff; min-width: 20px; width: auto; min-height: 20px; height: auto; border-radius: 999px;
	padding: 0 5px; box-sizing: border-box; font-size: 10px; font-weight: 700; line-height: 1; position: absolute; right: 4px; left: auto; top: 8px; margin-left: 0; display: inline-flex; align-items: center; justify-content: center; white-space: nowrap; overflow: hidden;}
.header__login-menu a.fa-heart {display: flex; align-items: center; min-height: 30px; line-height: 1.35; white-space: normal;}
.header__login-menu a.fa-heart span {margin-left: 6px; flex: 0 0 auto; white-space: nowrap;}

/* Sleep timer (header) */
.header__sleep {height: 70px; border-left: 1px solid var(--bdc); font-size: 24px;
	padding: 0 18px; position: relative; display: flex; align-items: center; justify-content: center;
	color: var(--tt-fade); cursor: pointer; background: transparent;}
.header__sleep.is-active {color: var(--tt);} 
/* Keep header action items from changing their flex size when dropdowns are opened */
.header__sleep, .header__favlink, .header__login, .header__btn-login, .header__btn-menu {flex: 0 0 auto; box-sizing: border-box;}
/* Stabilize the chevron area inside the profile trigger so neighboring icons do not shift */
.header__login::before {flex: 0 0 14px; width: 14px; text-align: center;}
/* Green background only when a timer is actually set */
.header__sleep.has-timer {background-color: var(--accent-primary); color: #fff;}
.header__sleep.has-timer.is-active {color: #fff;}

/* Extra safety: never show background when timer is not set */
.header__sleep:not(.has-timer) {background-color: transparent !important;}

.header__sleep-badge {
	background-color: var(--accent-primary);
	color: #fff;
	min-width: 0;
	height: 16px;
	border-radius: 999px;
	font-size: 10px;
	line-height: 16px;
	padding: 0 6px;
	position: absolute;
	right: 6px;
	top: 10px;
	left: auto;
	margin-left: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	white-space: nowrap;
	max-width: 52px;
	box-sizing: border-box;
	pointer-events: none;
	/* Keep the badge inside the icon area and avoid overlapping neighboring header icons */
	overflow: hidden;
	text-overflow: clip;
}
/* Ensure common.css .d-none isn't overridden by the badge's display:flex */
.header__sleep-badge.d-none {display: none !important;}
/* No timer -> show only the icon (no badge dot) */
.header__sleep:not(.has-timer) .header__sleep-badge {display: none !important;}
/* Make badge readable on green icon */
.header__sleep.has-timer .header__sleep-badge {background-color: #fff; color: var(--accent-primary);} 
.header__sleep-panel {position: absolute; right: 0; top: 100%; width: 250px;
	background-color: var(--bg); z-index: 20; border: 1px solid var(--bdc); padding: 12px 0;
	box-shadow: var(--bsh); color: var(--tt); font-size: 15px; font-weight: 400;}
.header__sleep-title {padding: 0 16px 10px; font-weight: 700; border-bottom: 1px solid var(--bdc); margin-bottom: 10px;}
.header__sleep-menu a {display: flex; align-items: center; min-height: 32px; padding: 0 16px;}
.header__sleep-menu a:hover {background-color: rgba(0,0,0,0.04);} 
.header__sleep-border {border-top: 1px solid var(--bdc); margin-top: 10px; padding-top: 10px;}
.header__sleep-custom {padding: 0 16px;}
.header__sleep-custom-title {font-size: 13px; color: var(--tt-fade); margin: 8px 0 6px;}
.header__sleep-custom-form {display: flex; gap: 8px; align-items: center;}
.header__sleep-custom-input {flex: 1; height: 34px; border-radius: 12px; border: 1px solid var(--bdc);
	background-color: var(--bg); padding: 0 10px;}
.header__sleep-custom-btn {height: 34px; padding: 0 12px; border-radius: 12px;}
.header__sleep-status {padding: 10px 16px 0; font-size: 12px; color: var(--tt-fade);} 
.header__login, .header__login.is-active {height: 70px; border-left: 1px solid var(--bdc);
	gap: 20px; width: 230px; position: relative; margin-right: -40px; display: flex; align-items: center;
	padding: 0 40px 0 20px; cursor: pointer; isolation: isolate;}
.header__login:not(:hover)::before {color: var(--tt);}
.header__login-login {font-weight: 700; margin-right: -10px;}
.header__login-img {width: 40px; height: 40px; border-radius: 50%; cursor: pointer;}
.header__login-panel {position: absolute; right: 0; top: 100%; width: 230px;
	background-color: var(--bg); z-index: 120; border: 1px solid var(--bdc); padding: 10px 0;
	box-shadow: var(--bsh); color: var(--tt); font-size: 15px; font-weight: 400;}
.header__login-header {padding: 20px; color: var(--tt); font-weight: 700; gap: 20px; border-bottom: 1px solid var(--bdc);
	margin-bottom: 10px; display: none;}
.header__login-avatar {width: 40px; height: 40px; border-radius: 50%;}
.header__login-group span {font-size: 12px; font-weight: 400; margin-top: 2px; 
	display: block; color: var(--tt-fade) !important;}
.header__login-menu a {display: flex; align-items: center; min-height: 30px; padding: 0 20px 0 0;}
.header__login-menu a::before {width: 40px; text-align: center; color: var(--accent-primary);}
.header__login-menu-border {border-top: 1px solid var(--bdc); margin-top: 10px; padding-top: 10px;}
.header__login-menu a span {font-size: 12px; margin-left: auto;}


/* ADAPTIVE, MOBILE MENU
----------------------------------------------- */
.overlay {position: fixed; z-index: 998; left: 0; top: 0; width: 100%; height: 100%; 
	opacity: 0.6; background-color: #000; cursor: pointer; display: none;}
.mobile-menu {width: 280px; height: 100%; overflow-x: hidden; overflow-y: auto;
	z-index: 999; position: fixed; left: -360px; top: 0; transition: left 0.4s; background-color: var(--bg);}
.mobile-menu.is-active {left: 0;}
body.mobile-menu-is-opened {overflow: hidden; width: 100%; height: 100%;}
.mobile-menu__header {padding: 0px 20px; gap: 10px; background: var(--bg-darker);}
.mobile-menu__btn-close {font-size: 24px; width: 40px; height: 40px; margin-right: 0px;}
.mobile-menu__content {padding: 40px 20px;}
.mobile-menu__content .side-menu__btn {display: none;}
.mobile-menu__content .side__menu-submenu {display: grid; box-shadow: none; gap: 0 10px;
	position: static; width: calc(100% + 40px); margin: 0 -20px; padding: 15px 20px;
	grid-template-columns: repeat(2,minmax(0,1fr)); background-color: var(--bg-darker);}
.mobile-menu__content .side__menu-submenu a {padding: 5px 0; font-size: 14px;
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.mobile-menu__content .nav__list {padding: 0 0 20px 0; gap: 5px; margin-top: -20px; flex-direction: column;}
.mobile-menu__content .nav__list1 li {flex-grow: 1;}
.mobile-menu__content .nav__list > li > a {height: 40px; padding: 0 20px; background-color: var(--bg-darker);}
.mobile-menu__content .nav__menu-submenu {width: 100%; height: auto; position: static; display: block; font-size: 12px;
	border-radius: 0; padding: 5px 0 5px 20px; opacity: 1; visibility: visible; transform: none; box-shadow: none;}

@media screen and (max-width: 1220px) {
	:root {--indent-negative: -20px; --indent: 20px;}
	body {background-image: none;}
	.wrapper {padding-top: 0; background-image: none; overflow: hidden;}
	.wrapper__container {max-width:1000px;}
	.wrapper__main, .sidebar, .header {border-radius: 0;}
	.wrapper__main {display: block;}
	.header .header__menu, .sidebar, .nav {display: none;}
	.logo {min-width: 100px;}
	.header__btn-login {background-color: rgba(0,0,0,0.06); color: var(--tt-fade);
		padding: 0 15px; font-weight: 400; height: 30px; border-radius: 15px; text-transform: none;}
	.header__favlink.nl {margin-right: 20px;}
	.header__btn-menu {display: flex; margin-left: 20px; padding: 0; width: 40px; 
		border-radius: 50%; font-size: 18px; position: relative; z-index: 10;}
	.wrapper::after, .wrapper::before {display: none;}

	.page__cols {display: block;}
	.page__cols-side {padding-top: 0;}
	.page--artist .page__caption {margin-bottom: 40px;}
	.page--artist .page__cols-side {padding-bottom: 20px;}
}

@media screen and (max-width: 950px) {
	.wrapper__container {max-width:768px;}
	.pagination {gap: 10px;}
	.pagination__btn-loader a, .pagination__btn-loader span {width: 100%;}
	.pagination > a, .pagination > span {flex-grow: 1; order: 10;}
	.pagination__pages {width: 100%;}
	.pagination__pages a, .pagination__pages span {flex-grow: 1;}
	.header__login-login, .header__login::before {display: none !important;}
	.header__login {width: auto !important;}
	.header__login-header {display: flex; margin-top: -10px;}
	
	/* Compact header + header icons (tablet) */
	.header {padding: 0 30px; height: 60px;}
	.header__logo.logo {min-width: 200px;}
	.logo {font-size: 20px; padding-left: 38px; height: 34px;}
	.logo svg, .logo img {width: 26px; height: 26px;}
	.search-block {margin: 0 20px;}

	/* Icons: sleep / fav / login / menu */
	.header__sleep, .header__favlink, .header__login, .header__login.is-active {height: 60px;}
	.header__sleep {font-size: 20px; padding: 0 14px;}
	.header__sleep-badge {height: 14px; line-height: 14px; font-size: 9px; padding: 0 5px; top: 8px; right: 5px; max-width: 46px;}
	.header__favlink {font-size: 24px; padding: 0 16px;}
	.header__favlink span {min-width: 18px; min-height: 18px; height: auto; padding: 0 4px; font-size: 9px; top: 8px; right: 4px;}
	.header__btn-login {height: 28px; padding: 0 12px; font-size: 13px;}
	.header__login {gap: 10px; padding: 0 18px; margin-right: -20px; width: 88px !important; min-width: 88px; justify-content: center;}
	.header__login-img, .header__login-avatar {width: 34px; height: 34px;}
	.header__btn-menu {width: 34px; height: 34px; font-size: 16px; margin-left: 12px;}

	.sect__content--tracks .trc {border-left: 0; margin-left: 0;}
	.coll__desc {padding: 20px 30px;}
	.sect__content--coll {padding: 0 80px;}
	.footer__one, .footer__two {gap: 20px;} 
	.footer__two {margin-top: 30px;}
	.footer__menu {min-width: 100%; justify-content: flex-start; gap: 20px;}
	.footer__text {min-width: 100%; order: -1;}
	.footer__text br {display: none;}

	.page__header {margin-bottom: 20px; margin-top: -20px;}
}

@media screen and (max-width: 760px) {
	.wrapper__container {max-width:640px;}
	.login__header, .login__content {padding: 20px;}
	.login__social {margin-bottom: 0;}
	.login__row::before {height: 40px;}
	.login__input input {height: 40px; line-height: 40px; box-shadow: none; border: 0; background-color: var(--bg-darker);}
	.login__social a {border-radius: var(--bdrs); height: 30px; flex: 1 0 30%;}
	.login__social a img {left: 50%; margin-left: -10px;}
	

	.header, .footer, .content {padding-left: 20px; padding-right: 20px;}
	.sect__content--tracks {margin: 0 -20px;}
	.sect__content--coll {padding: 0; display: flex; gap: 20px; overflow-y: hidden; overflow-x: auto; margin-right: -20px;}
	.sect__content--coll .coll {box-shadow: none; width: 300px; flex-shrink: 0;}
	.coll__title {font-size: 18px;}
	.coll__category {padding-top: 0;}
	.coll__img {height: 200px;}
	.coll__desc {gap: 15px; padding: 20px;}
	.coll__text {font-size: 13px;}
	.sect__content--tracks .trc {padding: 20px 20px; padding-left: 60px;}
	.trc__count {left: 20px;}
	.trc__to-playlist, .trc__img {margin-right: -10px;}

	.page__caption {padding-left: 20px; padding-right: 20px; margin-left: -20px; margin-right: -20px;}
	.page__caption::before {left: 20px; display: none !important;}
	.page__poster {margin-left: -20px; margin-right: -20px;}
	.page__header-desc {padding: 20px;}

	.page__title {font-size: 24px;}
	.full-text h1, .full-text h2, .full-text h3, .full-text h4, .full-text h5 {font-size: 20px;}
	.page__intro, .page__text .quote {margin-left: var(--indent-negative); margin-right: var(--indent-negative); padding-right: var(--indent);}
	.full-text h1, .full-text h2, .full-text h3, .full-text h4, .full-text h5 {font-size: 18px;}
	
	.ac-form__bottom {gap: 10px;}
	.ac-form__bottom button {padding: 0 20px;}
	.ac-form__header input + input {min-width: 100%; order: 10;}
	.ac-form__header > span, .comm__rating::before {display: none;}
	.ac-form #b_color {display: none;}
	.ac-form__bottom button {position: static !important; width: 100% !important;}
}

@media screen and (max-width: 590px) {
	.wrapper__container {max-width:480px;}
	.header {height: auto;}
	.search-block {min-width: calc(100% + 40px); border-top: 1px solid var(--bdc); order: 10; margin: 0 -20px;}
	.search-block__btn {left: auto; right: 5px;}
	.search-block input {padding-left: 20px !important;}
	.header__logo {flex-grow: 1; height: 70px;}
	.header__btn-login {margin-left: 10px; margin-right: -10px;}

	.header__btn-login {
		width: 36px;
		height: 36px;
		padding: 0;
		margin-left: 8px;
		margin-right: 0;
		border-radius: 50%;
		font-size: 0;
		flex: 0 0 36px;
	}
	.header__btn-login span {display: none;}
	.header__btn-login::before {
		content: "\f007";
		font-family: "Font Awesome 5 Pro";
		font-weight: 300;
		font-size: 16px;
		line-height: 1;
	}

	.page__header {display: block; position: relative;}
	.page__img {margin: 0; position: absolute; top: 0; left: 0; width: 80px; height: 80px;}
	.page__header-right h1 {padding-left: 100px; min-height: 80px; 
		display: flex; flex-direction: column; justify-content: center;}
	.page--collection .page__header-right h1 {display: block; padding-left: 0; min-height: auto;}
	.page__poster {height: 200px;}
}

@media screen and (max-width: 470px) {
	.wrapper__container123 {max-width:360px;}
	.sect__content--coll .coll {width: calc(100vw - 60px);}
	.d-grid-items {grid-template-columns: repeat(2,minmax(100px,1fr));}
	.sect__content--tracks, .sect__content--collections {display: block;}
	.sect__content--collections .coll + .coll {margin-top: 20px;}
	.sect__content--artists .artist:nth-child(5n) {grid-column: 1 / -1;}
	.sect__title {min-width: 100%;}
	.trc__count {display: none;}
	.sect__content--tracks .trc {padding-left: 20px;}
	
	.page__scr ul li {flex: 0 0 220px; width: 220px;}
	.page__message {margin-left: var(--indent-negative); margin-right: var(--indent-negative); padding-left: 18px;}
	
	.ac-form__bottom .comments_subscribe {font-size: 13px;}
	.full-text iframe {width: calc(100% + 40px); max-width: calc(100% + 40px); height: 260px; margin-left: -20px; margin-right: -20px;}
}


@media screen and (max-width: 448px) {

    .header__logotext {  font-size: 11px;}
}

@media screen and (max-width: 360px) {

    .header__logotext {display: none;}
}


/* PLAYER
----------------------------------------------- */
.img-fit img {width: 100%; height: 100%; object-fit: cover;}
.fx-row {display: flex; flex-wrap: wrap; flex-direction: row;}
.fx-col {flex-direction: column; flex-wrap: nowrap;} 
.fx-row {justify-content: space-between;}
.fx-middle {align-items: center;}
.fx-1 {flex: 1 1 0; max-width: 100%; min-width: 50px;}
.fx-first {-ms-flex-order: -1;-webkit-order: -1;order: -1;}
.fx-last {-ms-flex-order: 10;-webkit-order: 10;order: 10;}
.wplayer {width: 100%; position: fixed; left: 0; bottom: 0; z-index: 997;
	background-color: #565656; opacity: .93; color: #fff; box-shadow: 0 0 6px rgba(0,0,0,0.6);}
.audioplayer {max-width: 1200px; width: calc(100% - 40px); margin: 0 auto; height: 60px;}
.audioplayer audio {display: none;}
.audioplayer-bar {position: relative; height: 10px; width: 500px; 
	background-color: #000; border-radius: 0px; margin-left: 20px;}
.audioplayer-bar-loaded {position: absolute; left: 0; top: 0; height: 100%;
	background-color: rgba(0,0,0,0.1); border-radius: 0px;}
.audioplayer-bar-played {position: absolute; left: 0; top: 0; height: 100%;
	z-index: 10; border-radius: 0px; background-color: var(--accent-secondary);}

.audioplayer-volume {position: relative; z-index: 100; margin-left: 20px; font-size: 18px;}
.audioplayer-muted .fa-volume-up:before, .pl-muted .page__vl-mute::before {content: '\f6a9';}
.audioplayer-volume-button a { display: block; height: 30px; line-height: 30px; text-align: center; color: #ccc;}
.audioplayer-volume-adjust {position: absolute; left: 0; bottom: 100%; width: 30px; height: 100px;
	background-color: #111; box-shadow: 0 0 10px rgba(0,0,0,0.5); padding: 10px; display: none;}
.audioplayer-volume-adjust > div {width: 10px; height: 80px; border-radius: 0px;
	position: relative; cursor: pointer; background-color: #000; overflow: hidden;}
.audioplayer-volume-adjust > div > div {width: 100% !important; background-color: var(--accent-secondary);
	position: absolute; left: 0; bottom: 0; z-index: 10;}
.audioplayer-volume:hover .audioplayer-volume-adjust {display: block;}

.ap-dl {font-size: 18px; margin-left: 20px; color: #ccc;}
.ap-time {font-size: 12px; margin-left: 20px;}
.audioplayer-time-current:after {content: '/'; display: inline; margin: 0 6px;}
.ap-desc {width: 300px;}
.ap-img {width: 40px; height: 40px; margin-right: 10px; border-radius: 0px;}
.ap-artist {font-size: 13px; margin-top: 4px; color: #ccc; 
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.ap-title {font-size: 15px; color: #fff; font-weight: 600; 
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.ap-btns {margin-right: 20px;}
.audioplayer-playpause a {width: 40px; height: 40px; line-height: 40px; text-align: center;
	border-radius: 50%; display: block; position: relative; margin: 0 20px;
	background: var(--accent-primary); color: #fff;}
.ap-prev, .ap-next {cursor: pointer; font-size: 18px; color: #ccc;}
.ap-prev:hover, .ap-next:hover, .audioplayer-volume-button a:hover, .ap-dl:hover {opacity: 1; color: #fff;}
.audioplayer-stopped .audioplayer-playpause a {padding-left: 3px;}
.audioplayer-playpause a:hover {background: var(--accent-secondary); color: #fff;}
.wplayer-init .audioplayer-playpause .fas:before {content: '\f04b'; padding-left: 1px;}

.ap-dl, .ap-time, .audioplayer-bar {display: none;}
.audioplayer-bar {width: 300px;}
.ap-btr {margin-left: 20px; gap: 5px; font-size: 12px;}
.ap-btr i {font-style: normal;}
.ap-btr span {cursor: pointer; display: inline-block; padding: 5px 5px; background-color: #000;}
.ap-btr span.active {background-color: var(--accent-secondary); pointer-events: none;}
.ap-btr span:not(.active):hover {background-color: var(--accent-primary);}
/* Fullstory volume control (horizontal slider with handle) */
.page__vl-box {gap: 12px; user-select: none;}

.page__vl-mute {
	width: 34px; height: 34px;
	background: transparent;
	border: 0;
	padding: 0;
	display: grid;
	place-items: center;
	font-size: 20px;
	line-height: 1;
	color: var(--tt);
	opacity: .85;
}
.page__vl-mute:hover {opacity: 1;}

.page__vl {
	/* 0..1 */
	/* Default UI position: 100% (real value is synced from localStorage/JS) */
	--vl: 1;
	position: relative;
	cursor: pointer;
	touch-action: none;
	width: 180px;
	height: 8px;
	border-radius: 999px;
	background-color: var(--bdc);
	top: 0;
}
.page__vl-val {
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	width: calc(var(--vl) * 100%);
	border-radius: inherit;
	background-color: var(--accent-primary);
	pointer-events: none;
	transition: width .12s linear;
}
/* Handle */
.page__vl::after {
	content: '';
	position: absolute;
	left: calc(var(--vl) * 100%);
	top: 50%;
	transform: translate(-50%, -50%);
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: var(--accent-secondary);
	box-shadow: 0 2px 6px rgba(0,0,0,.25);
	transition: left .12s linear;
}
.page__vl:active::after {transform: translate(-50%, -50%) scale(1.08);}
/* Tooltip on hover (optional) */
.page__vl::before {
	content: attr(data-text);
	position: absolute;
	left: 0;
	bottom: calc(100% + 8px);
	font-size: 12px;
	color: var(--tt-fade);
	opacity: 0;
	transform: translateY(4px);
	pointer-events: none;
	transition: opacity .15s ease, transform .15s ease;
}
.page__vl:hover::before {opacity: 1; transform: translateY(0);}

@media screen and (max-width: 590px) {
	.page__vl {width: 140px;}
}
@media screen and (max-width: 1220px) {
	.audioplayer-bar {position: absolute; left: 0; top: -6px; height: 6px; width: 100%; border-radius: 0; margin: 0;}
	.ap-btr {width: 100%; position: absolute; left: -20px; bottom: 100%; 
		background-color: #111; padding: 20px; justify-content: center; display: none;}
	.ap-settings {display: block; cursor: pointer; font-size: 24px; margin-left: 20px; color: #ccc;}
	.ap-settings.is-active {color: var(--accent-primary);}
	.ap-btr.is-active {display: flex;}
}
@media screen and (max-width: 590px) {
 .audioplayer-volume, .ap-time, .ap-img {display: none;}
	.audioplayer-playpause a {margin: 0 10px;}
}
	/* На десктопе (есть hover) громкость не скрываем даже при ≤590px */
@media screen and (max-width: 590px) and (hover: hover) {
  .audioplayer-volume { display: inline-flex; /* или то значение, что было */ }
}
	



















.hrefs__numb {
  display: none;
}




.hrefs__link--hide {
  display: none !important;
}

.hrefs__link:hover {
  opacity: 0.6;
}

.hrefs__more--none {
  display: none;
}















/* --- Mobile header icon compactness (sleep timer / favorites) --- */
@media screen and (max-width: 590px) {
  .header {
    align-items: center;
  }
  .header__logo,
  .header__logo.logo {
    min-width: 0;
    flex: 1 1 auto;
  }
  .header__sleep, .header__favlink {
    height: 56px;
    padding: 0 10px;
    min-width: 40px;
    font-size: 22px;
  }
  .header__favlink span {
    min-width: 18px;
    min-height: 18px;
    height: auto;
    padding: 0 4px;
    font-size: 9px;
    top: 6px;
    right: 3px;
  }
  .header__sleep-badge {
    height: 14px;
    line-height: 14px;
    font-size: 9px;
    padding: 0 5px;
    top: 6px;
    right: 4px;
    max-width: 46px;
  }
  .header__favlink.nl { margin-right: 8px; }
  .header__login,
  .header__login.is-active {
    width: 44px !important;
    min-width: 44px;
    padding: 0 4px;
    margin-right: 0;
    gap: 0;
    justify-content: center;
    overflow: visible;
  }
  .header__login-img {
    width: 30px;
    height: 30px;
    flex: 0 0 auto;
    min-width: 30px;
    min-height: 30px;
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 130;
    overflow: hidden;
    pointer-events: none;
  }
  .header__login-panel {
    right: 0;
    left: auto;
    top: calc(100% + 6px);
    width: min(230px, calc(100vw - 24px));
    max-width: calc(100vw - 24px);
    max-height: calc(100vh - 84px);
    overflow-y: auto;
    box-sizing: border-box;
    z-index: 120;
  }
  .header__logo { height: 56px; }
  .header__btn-menu {
    margin-left: 8px;
  }

  /* Sleep timer dropdown: use the same placement logic as the profile dropdown */
  .header__sleep-panel {
    position: absolute;
    left: auto;
    right: 0;
    top: 100%;
    width: min(230px, calc(100vw - 24px));
    max-width: calc(100vw - 24px);
    max-height: calc(100vh - 84px);
    overflow-y: auto;
    box-sizing: border-box;
    border-radius: 0;
    padding: 12px 0;
    z-index: 20;
  }
}

@media screen and (max-width: 470px) {
  .header__sleep, .header__favlink {
    height: 52px;
    padding: 0 8px;
    min-width: 36px;
    font-size: 20px;
  }
  .header__favlink span { top: 4px; }
  .header__sleep-badge { top: 4px; right: 3px; }
  .header__login,
  .header__login.is-active {
    width: 40px !important;
    min-width: 40px;
    padding: 0 3px;
    margin-right: 0;
    gap: 0;
    justify-content: center;
    overflow: visible;
  }
  .header__login-img {
    width: 28px;
    height: 28px;
    min-width: 28px;
    min-height: 28px;
  }
  .header__login-panel {
    top: calc(100% + 6px);
    width: min(230px, calc(100vw - 16px));
    max-width: calc(100vw - 16px);
    max-height: calc(100vh - 76px);
    z-index: 120;
  }
  .header__logo { height: 52px; }
  .header__btn-menu {
    width: 32px;
    height: 32px;
    margin-left: 6px;
  }

  .header__sleep-panel {
    width: min(230px, calc(100vw - 16px));
    max-width: calc(100vw - 16px);
    max-height: calc(100vh - 76px);
  }
}

/* FAVORITES: sorting mode tweaks (mobile-friendly) */
body.fav-sort-mode .sect__content--tracks .trc {
  padding-left: 80px !important; /* keep room for drag handle even on <=470px */
}

body.fav-sort-mode .sect__content--tracks [data-news-id] a,
body.fav-sort-mode .sect__content--tracks [data-news-id] button {
  pointer-events: none;
}

body.fav-sort-mode .sect__content--tracks [data-news-id] .fav-sort-handle {
  pointer-events: auto;
}


@media screen and (max-width: 470px) {
  .header__login-menu a.fa-heart {
    min-height: 38px;
    padding-right: 12px;
    font-size: 14px;
  }

  .header__login-menu a.fa-heart::before {
    width: 34px;
    flex: 0 0 34px;
  }

  .header__login-menu a.fa-heart span {
    margin-left: 4px;
    font-size: 11px;
  }
}

@media screen and (max-width: 360px) {
  .header__sleep, .header__favlink {
    padding: 0 8px;
    font-size: 18px;
  }

  .header__favlink {
    min-width: 40px;
  }

  .header__favlink span {
    min-width: 16px;
    min-height: 16px;
    height: auto;
    padding: 0 3px;
    font-size: 8px;
    top: 3px;
    right: 2px;
  }

  .header__favlink.nl {
    margin-right: 6px;
  }

  .header__login-menu a.fa-heart {
    font-size: 13px;
    line-height: 1.25;
  }

  .header__login-menu a.fa-heart::before {
    width: 30px;
    flex: 0 0 30px;
  }

  .header__login-menu a.fa-heart span {
    display: inline-block;
    margin-left: 0;
    padding-left: 4px;
    font-size: 10px;
  }
}

@media screen and (max-width: 320px) {
  .header__favlink {
    padding: 0 7px;
  }

  .header__favlink span {
    min-width: 14px;
    height: 14px;
    padding: 0 2px;
    font-size: 7px;
    top: 2px;
  }

  .header__login-menu a.fa-heart {
    font-size: 12px;
  }
}


/* Floating player refresh: compact + theme adaptive */
.wplayer{
	background: var(--bg);
	color: var(--tt);
	border-top: 1px solid var(--bdc);
	box-shadow: 0 -10px 24px rgba(0,0,0,.12);
	opacity: 1;
	padding-bottom: max(env(safe-area-inset-bottom), 0px);
}
.audioplayer{
	width: calc(100% - 32px);
	height: auto;
	min-height: 62px;
	padding: 8px 0;
	gap: 14px;
	align-items: center;
}
.audioplayer-bar{
	background-color: var(--bdc);
	border-radius: 999px;
	height: 6px;
}
.audioplayer-bar-loaded{
	background-color: rgba(0,0,0,.08);
	border-radius: inherit;
}
.audioplayer-bar-played{
	background-color: var(--accent-secondary);
	border-radius: inherit;
}
.ap-desc{
	width: auto;
	gap: 12px;
	align-items: center;
	min-width: 0;
}
.ap-img{
	width: 44px;
	height: 44px;
	margin-right: 0;
	border-radius: 12px;
	overflow: hidden;
	background: var(--bg-darker);
	border: 1px solid var(--bdc);
	box-shadow: 0 6px 14px rgba(0,0,0,.08);
	flex: 0 0 44px;
	display: block;
}
.ap-info{
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 4px;
	min-width: 0;
}
.ap-meta{
	gap: 10px;
	min-width: 0;
	flex-wrap: nowrap;
}
.ap-title{
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0;
	min-width: 0;
	flex: 1 1 auto;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	color: var(--tt);
}
.ap-title-link:hover{
	color: var(--accent-secondary);
}
.ap-title-link.is-disabled,
.ap-title-link[aria-disabled="true"]{
	pointer-events: none;
	text-decoration: none;
}
.ap-artist{
	font-size: 12px;
	margin-top: 0;
	color: var(--tt-fade);
}
.ap-actions{
	display: none;
}
.ap-fav{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	min-width: 34px;
	padding: 0;
	border-radius: 50%;
	border: 1px solid var(--bdc);
	background: var(--bg-darker);
	color: var(--tt-fade);
	box-shadow: none;
	text-transform: none;
	font-size: 15px;
}
.ap-fav:hover{
	background: var(--bg-darker);
	border-color: var(--red);
	color: var(--red);
	transform: translateY(-1px);
}
.ap-fav.is-active{
	color: var(--red);
	border-color: rgba(221,57,84,.35);
	background: rgba(221,57,84,.08);
}
.ap-fav.is-active .ap-fav-icon{
	color: var(--red);
}
.ap-fav.is-disabled,
.ap-fav[aria-disabled="true"]{
	opacity: .45;
	pointer-events: none;
}
.ap-btns{
	margin-right: 0;
	gap: 8px;
	padding-right: 0;
	flex-wrap: nowrap;
}
.audioplayer-playpause a{
	width: 42px;
	height: 42px;
	line-height: 42px;
	margin: 0;
	box-shadow: none;
}
.ap-prev,
.ap-next{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: var(--bg-darker);
	border: 1px solid var(--bdc);
	color: var(--tt-fade);
	transition: background-color .18s ease, border-color .18s ease, color .18s ease, transform .18s ease;
}
.ap-prev:hover,
.ap-next:hover{
	transform: translateY(-1px);
	background: var(--bg-darker);
	border-color: var(--accent-primary);
	color: var(--accent-primary);
}
.audioplayer-volume{
	margin-left: 10px;
}
.audioplayer-volume-button a,
.ap-dl,
.ap-settings{
	color: var(--tt-fade);
}
.ap-btr{
	margin-left: 0;
	gap: 6px;
	font-size: 10px;
	color: var(--tt-fade);
	line-height: 1;
}
.ap-btr i{
	font-style: normal;
	color: var(--tt-fade);
}
.ap-btr span{
	border-radius: 999px;
	padding: 4px 7px;
	background-color: var(--bg-darker);
	border: 1px solid var(--bdc);
}
.ap-btr span.active{
	background-color: var(--accent-secondary);
	border-color: var(--accent-secondary);
	color: #fff;
}
body.design4 .wplayer,
body.design5 .wplayer{
	box-shadow: 0 -10px 24px rgba(0,0,0,.28);
}
body.design4 .audioplayer-bar-loaded,
body.design5 .audioplayer-bar-loaded{
	background-color: rgba(255,255,255,.08);
}
@media screen and (max-width: 1220px) {
	.audioplayer{
		padding-top: 10px;
	}
	.ap-btr{
		left: 0;
		bottom: calc(100% + 8px);
		margin-left: 0;
		border-radius: 14px;
		background-color: var(--bg);
		border: 1px solid var(--bdc);
		box-shadow: 0 10px 24px rgba(0,0,0,.12);
		padding: 6px;
	}
}
@media screen and (max-width: 780px) {
	.audioplayer{
		gap: 10px;
		width: calc(100% - 24px);
	}
	.ap-desc{
		gap: 10px;
	}
	.ap-img{
		width: 40px;
		height: 40px;
		flex-basis: 40px;
	}
	.audioplayer-playpause a{
		width: 40px;
		height: 40px;
		line-height: 40px;
	}
}
@media screen and (max-width: 590px) {
	.audioplayer{
		padding: 8px 0;
		gap: 8px;
	}
	.ap-title{
		font-size: 13px;
	}
	.ap-artist{
		font-size: 11px;
	}
	.ap-fav,
	.ap-prev,
	.ap-next{
		width: 32px;
		height: 32px;
		min-width: 32px;
	}
	.ap-btns{
		gap: 6px;
	}
}
@media screen and (max-width: 420px) {
	.audioplayer-volume,
	.ap-prev,
	.ap-next{
		display: none;
	}
	.audioplayer{
		width: calc(100% - 20px);
		gap: 8px;
	}
	.ap-img{
		width: 36px;
		height: 36px;
		flex-basis: 36px;
		border-radius: 10px;
	}
	.audioplayer-playpause a{
		width: 38px;
		height: 38px;
		line-height: 38px;
	}
}



/* Floating player: compact pill style, closer to site controls */
.wplayer{
	background: var(--bg);
	color: var(--tt);
	border-top: 1px solid var(--bdc);
	box-shadow: 0 -10px 30px rgba(0,0,0,.08);
	opacity: 1;
	padding-bottom: max(env(safe-area-inset-bottom), 0px);
}
.audioplayer{
	max-width: 1320px;
	width: calc(100% - 28px);
	min-height: 68px;
	height: auto;
	padding: 10px 0;
	gap: 14px;
	align-items: center;
}
.audioplayer audio{display:none;}
.ap-desc{
	width: auto;
	gap: 14px;
	align-items: center;
	min-width: 0;
	flex: 1 1 auto;
}
.ap-img{
	width: 58px;
	height: 58px;
	flex: 0 0 58px;
	margin-right: 0;
	border-radius: 50%;
	overflow: hidden;
	background: var(--bg-darker);
	border: 0;
	box-shadow: none;
	display: block;
}
.ap-info{
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 2px;
	min-width: 0;
}
.ap-meta{
	gap: 0;
	min-width: 0;
	flex-wrap: nowrap;
}
.ap-title{
	font-size: 16px;
	line-height: 1.2;
	font-weight: 800;
	letter-spacing: -.01em;
	min-width: 0;
	flex: 1 1 auto;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	color: var(--tt);
}
.ap-title-link{
	text-decoration: none;
}
.ap-title-link:hover{
	color: var(--accent-secondary);
}
.ap-title-link.is-disabled,
.ap-title-link[aria-disabled="true"]{
	pointer-events: none;
	text-decoration: none;
}
.ap-artist{
	font-size: 12px;
	line-height: 1.25;
	margin-top: 0;
	color: var(--tt-fade);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 100%;
}
.ap-btns{
	margin-right: 0;
	padding-right: 0;
	gap: 10px;
	flex-wrap: nowrap;
	flex: 0 0 auto;
	align-items: center;
}
.ap-fav,
.audioplayer-playpause a,
.audioplayer-volume-button a{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	min-width: 48px;
	padding: 0;
	border-radius: 50%;
	border: 1px solid var(--bdc);
	background: var(--bg-darker);
	color: var(--tt);
	box-shadow: none;
	transition: background-color .18s ease, border-color .18s ease, color .18s ease, transform .18s ease;
}
.audioplayer-playpause a{
	width: 52px;
	height: 52px;
	min-width: 52px;
	line-height: 52px;
	margin: 0;
	font-size: 18px;
}
.audioplayer-stopped .audioplayer-playpause a{
	padding-left: 2px;
}
.ap-fav:hover,
.audioplayer-volume-button a:hover,
.audioplayer-playpause a:hover{
	transform: translateY(-1px);
}
.audioplayer-playpause a:hover,
.audioplayer-playing .audioplayer-playpause a,
.wplayer-init .audioplayer-playpause a{
	background: var(--accent-primary);
	border-color: var(--accent-primary);
	color: #fff;
}
.ap-fav{
	font-size: 18px;
}
.ap-fav:hover{
	border-color: var(--accent-primary);
	color: var(--accent-primary);
}
.ap-fav.is-active{
	color: #fff;
	border-color: var(--red);
	background: var(--red);
}
.ap-fav.is-active .ap-fav-icon{
	color: inherit;
}
.ap-fav.is-disabled,
.ap-fav[aria-disabled="true"]{
	opacity: .45;
	pointer-events: none;
}
.ap-prev,
.ap-next,
.ap-settings,
.ap-dl,
.ap-time,
.ap-btr,
.audioplayer-bar{
	display: none !important;
}
.audioplayer-volume{
	position: relative;
	z-index: 100;
	margin-left: 0;
	font-size: 18px;
	flex: 0 0 auto;
}
.audioplayer-volume-button a{
	font-size: 18px;
	line-height: 1;
}
.audioplayer-volume-adjust{
	left: 50%;
	bottom: calc(100% + 10px);
	transform: translateX(-50%);
	width: 42px;
	height: 126px;
	background: var(--bg);
	border: 1px solid var(--bdc);
	border-radius: 20px;
	box-shadow: 0 14px 32px rgba(0,0,0,.16);
	padding: 12px 16px;
}
.audioplayer-volume-adjust > div{
	width: 10px;
	height: 100%;
	border-radius: 999px;
	position: relative;
	cursor: pointer;
	background-color: var(--bg-darker);
	overflow: hidden;
	margin: 0 auto;
}
.audioplayer-volume-adjust > div > div{
	width: 100% !important;
	background-color: var(--accent-secondary);
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: 10;
	border-radius: 999px;
}
body.design4 .wplayer,
body.design5 .wplayer{
	box-shadow: 0 -12px 30px rgba(0,0,0,.24);
}
body.design4 .audioplayer-volume-adjust,
body.design5 .audioplayer-volume-adjust{
	box-shadow: 0 16px 34px rgba(0,0,0,.34);
}
@media screen and (max-width: 980px){
	.audioplayer{
		width: calc(100% - 20px);
		gap: 10px;
		min-height: 62px;
		padding: 8px 0;
	}
	.ap-img{
		width: 52px;
		height: 52px;
		flex-basis: 52px;
	}
	.ap-title{
		font-size: 15px;
	}
	.ap-fav,
	.audioplayer-volume-button a{
		width: 44px;
		height: 44px;
		min-width: 44px;
	}
	.audioplayer-playpause a{
		width: 48px;
		height: 48px;
		min-width: 48px;
		line-height: 48px;
	}
}
@media screen and (max-width: 680px){
	.audioplayer{
		width: calc(100% - 16px);
		gap: 8px;
	}
	.ap-desc{
		gap: 10px;
	}
	.ap-img{
		width: 46px;
		height: 46px;
		flex-basis: 46px;
	}
	.ap-title{
		font-size: 14px;
	}
	.ap-artist{
		display: none;
	}
	.ap-fav,
	.audioplayer-volume-button a{
		width: 40px;
		height: 40px;
		min-width: 40px;
	}
	.audioplayer-playpause a{
		width: 44px;
		height: 44px;
		min-width: 44px;
		line-height: 44px;
	}
}
@media screen and (max-width: 480px){
	.audioplayer{
		width: calc(100% - 12px);
		padding: 7px 0;
		gap: 6px;
	}
	.ap-img{
		width: 40px;
		height: 40px;
		flex-basis: 40px;
	}
	.ap-title{
		font-size: 13px;
	}
	.audioplayer-volume{
		display: none;
	}
	.ap-fav,
	.audioplayer-playpause a{
		width: 38px;
		height: 38px;
		min-width: 38px;
		line-height: 38px;
	}
}


/* --- bottom player compact reference: restore prev/next + quality --- */
.ap-prev,
.ap-next{
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	min-width: 38px;
	border-radius: 50%;
	border: 1px solid var(--bdc);
	background: var(--bg-darker);
	color: var(--tt);
	box-shadow: none;
	transition: background-color .18s ease, border-color .18s ease, color .18s ease, transform .18s ease;
}
.ap-prev:hover,
.ap-next:hover{
	transform: translateY(-1px);
	border-color: var(--accent-primary);
	color: var(--accent-primary);
	background: var(--bg-darker);
}
.ap-btr{
	display: flex !important;
	align-items: center;
	flex-wrap: wrap;
	gap: 4px;
	margin-top: 4px;
	font-size: 10px;
	line-height: 1;
	color: var(--tt-fade);
}
.ap-btr i{
	font-style: normal;
	margin-right: 2px;
	color: var(--tt-fade);
}
.ap-btr span{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 28px;
	height: 22px;
	padding: 0 8px;
	border-radius: 999px;
	border: 1px solid var(--bdc);
	background: var(--bg-darker);
	color: var(--tt);
	font-weight: 600;
}
.ap-btr span.active{
	background: var(--accent-primary);
	border-color: var(--accent-primary);
	color: #fff;
}
.ap-btns{
	gap: 8px;
}

@media screen and (max-width: 980px){
	.ap-prev,
	.ap-next{
		width: 36px;
		height: 36px;
		min-width: 36px;
	}
	.ap-btr{
		gap: 3px;
		font-size: 9px;
	}
	.ap-btr span{
		height: 20px;
		min-width: 24px;
		padding: 0 7px;
	}
}

@media screen and (max-width: 680px){
	.ap-prev,
	.ap-next{
		width: 34px;
		height: 34px;
		min-width: 34px;
	}
	.ap-btr i{
		display: none;
	}
}

@media screen and (max-width: 480px){
	.ap-btns{
		gap: 6px;
	}
	.ap-prev,
	.ap-next,
	.ap-fav,
	.audioplayer-playpause a{
		width: 36px;
		height: 36px;
		min-width: 36px;
		line-height: 36px;
	}
	.ap-btr{
		margin-top: 3px;
	}
	.ap-btr span{
		height: 18px;
		min-width: 22px;
		padding: 0 6px;
	}
}


/* --- bottom player: recent icons + quality in subtitle row --- */
.ap-recent-source{
	display: none !important;
}
.ap-desc{
	min-width: 0;
}
.ap-info{
	gap: 4px;
}
.ap-btr{
	margin-top: 0;
	gap: 6px;
}
.ap-btr span{
	cursor: pointer;
}
.wplayer .audioplayer-volume-button a:hover,
.wplayer .audioplayer-volume-button a:focus-visible{
	color: var(--accent-primary);
	border-color: var(--accent-primary);
	background: var(--bg-darker);
	opacity: 1;
}
.wplayer .audioplayer-volume-button a:hover .fas,
.wplayer .audioplayer-volume-button a:focus-visible .fas{
	color: inherit;
}
.ap-recent{
	display: inline-flex;
	align-items: center;
	gap: 14px;
	min-width: 0;
	margin-left: auto;
	padding-left: 18px;
	border-left: 1px solid var(--bdc);
	flex: 0 1 34%;
}
.ap-recent__label{
	font-size: 18px;
	line-height: 1.1;
	font-weight: 800;
	color: var(--tt);
	white-space: nowrap;
	flex: 0 0 auto;
}
.ap-recent__list{
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
	overflow-x: auto;
	scrollbar-width: none;
	-ms-overflow-style: none;
	padding-bottom: 2px;
}
.ap-recent__list::-webkit-scrollbar{
	display: none;
}
.ap-recent__item,
.ap-recent__trigger,
.ap-recent__link{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 54px;
	height: 54px;
	min-width: 54px;
	padding: 0;
	border: 2px solid transparent;
	border-radius: 50%;
	background: transparent;
	box-shadow: none;
	overflow: hidden;
	text-decoration: none;
	transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
	cursor: pointer;
}
.ap-recent__thumb,
.ap-recent__thumb img{
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 50%;
}
.ap-recent__thumb img{
	object-fit: cover;
}
.ap-recent__trigger:hover,
.ap-recent__link:hover,
.ap-recent__trigger:focus-visible,
.ap-recent__link:focus-visible{
	transform: translateY(-1px);
	border-color: var(--accent-primary);
	box-shadow: 0 0 0 3px rgba(0,0,0,.04);
}
.ap-recent__trigger.is-current,
.ap-recent__link.is-current{
	border-color: var(--accent-primary);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent-primary) 18%, transparent);
}
@supports not (color: color-mix(in srgb, red 50%, transparent)) {
	.ap-recent__trigger.is-current,
	.ap-recent__link.is-current{
		box-shadow: 0 0 0 3px rgba(0,0,0,.08);
	}
}
@media screen and (max-width: 1180px){
	.ap-recent{
		flex-basis: 28%;
		gap: 12px;
		padding-left: 14px;
	}
	.ap-recent__label{
		font-size: 16px;
	}
	.ap-recent__item,
	.ap-recent__trigger,
	.ap-recent__link{
		width: 48px;
		height: 48px;
		min-width: 48px;
	}
}
@media screen and (max-width: 980px){
	.ap-recent{
		flex-basis: 24%;
	}
	.ap-recent__label{
		display: none;
	}
}
@media screen and (max-width: 860px){
	.ap-recent{
		display: none;
	}
}


/* --- bottom player compact refinements: recent icons + quality dropdown --- */
.ap-info{
	min-width: 0;
}
.ap-btr{
	display: block;
	margin-top: 2px;
}
.ap-btr__select-wrap{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	max-width: 100%;
	padding: 0;
	border: 0;
	background: transparent;
}
.ap-btr__label{
	font-size: 12px;
	line-height: 1;
	font-weight: 700;
	color: var(--tlh);
	white-space: nowrap;
}
.ap-btr-select{
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	width: auto;
	min-width: 106px;
	max-width: 132px;
	height: 28px;
	padding: 0 32px 0 12px;
	border: 1px solid var(--bdc);
	border-radius: 999px;
	background: var(--bg);
	color: var(--tt);
	font: inherit;
	font-size: 12px;
	font-weight: 700;
	line-height: 26px;
	box-shadow: none;
	outline: none;
	background-image: linear-gradient(45deg, transparent 50%, var(--tt) 50%), linear-gradient(135deg, var(--tt) 50%, transparent 50%);
	background-position: calc(100% - 17px) calc(50% - 2px), calc(100% - 12px) calc(50% - 2px);
	background-size: 5px 5px, 5px 5px;
	background-repeat: no-repeat;
}
.ap-btr-select:hover,
.ap-btr-select:focus{
	border-color: var(--accent-primary);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent-primary) 14%, transparent);
}
@supports not (color: color-mix(in srgb, red 50%, transparent)) {
	.ap-btr-select:hover,
	.ap-btr-select:focus{
		box-shadow: 0 0 0 3px rgba(0,0,0,.06);
	}
}
.wplayer .audioplayer-volume-button a:hover,
.wplayer .audioplayer-volume-button a:focus-visible{
	color: var(--accent-primary) !important;
	background: color-mix(in srgb, var(--accent-primary) 10%, var(--bg));
	border-color: color-mix(in srgb, var(--accent-primary) 28%, var(--bdc));
}
.wplayer .audioplayer-volume-button a:hover .fas,
.wplayer .audioplayer-volume-button a:focus-visible .fas{
	color: var(--accent-primary) !important;
}
.ap-recent{
	gap: 12px;
	flex: 0 1 30%;
}
.ap-recent__list{
	flex-wrap: nowrap;
	gap: 8px;
	overflow-x: auto;
	overflow-y: hidden;
	white-space: nowrap;
}
.ap-recent__item,
.ap-recent__trigger,
.ap-recent__link{
	width: 40px;
	height: 40px;
	min-width: 40px;
	border-width: 1px;
}
.ap-recent__thumb{
	background: var(--bg3);
}
.ap-recent__thumb img{
	object-fit: cover;
	object-position: center;
	background: var(--bg3);
}
@media screen and (max-width: 1180px){
	.ap-recent__item,
	.ap-recent__trigger,
	.ap-recent__link{
		width: 36px;
		height: 36px;
		min-width: 36px;
	}
	.ap-btr__label{
		display: none;
	}
	.ap-btr-select{
		min-width: 96px;
	}
}
@media screen and (max-width: 980px){
	.ap-recent{
		flex-basis: 22%;
	}
}
@media screen and (max-width: 760px){
	.ap-btr-select{
		height: 26px;
		min-width: 88px;
		padding-left: 10px;
	}
}


/* --- bottom player final recent/quality refinements --- */
.ap-recent{
	display: inline-flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	gap: 10px;
	min-width: 0;
	max-width: 34%;
}
.ap-recent__label{
	flex: 0 0 auto;
	margin-right: 2px;
	font-size: 17px;
	line-height: 1;
	font-weight: 800;
	white-space: nowrap;
}
.ap-recent__list{
	display: flex;
	flex-wrap: nowrap !important;
	align-items: center;
	gap: 7px;
	overflow-x: auto;
	overflow-y: hidden;
	white-space: nowrap;
}
.ap-recent__item,
.ap-recent__trigger,
.ap-recent__link{
	width: 34px;
	height: 34px;
	min-width: 34px;
	border-width: 1px;
	border-color: color-mix(in srgb, var(--bdc) 72%, transparent);
	background: var(--bg2);
}
.ap-recent__thumb{
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 4px;
	background: var(--bg2);
}
.ap-recent__thumb img{
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
	background: transparent;
}
.ap-recent__link:hover,
.ap-recent__link:focus-visible,
.ap-recent__trigger:hover,
.ap-recent__trigger:focus-visible{
	border-color: var(--accent-primary);
	background: var(--bg);
}
.ap-btr{
	margin-top: 3px;
}
.ap-btr__select-wrap{
	gap: 6px;
}
.ap-btr__label{
	display: inline !important;
	padding: 0;
	border: 0;
	background: transparent;
	font-size: 12px;
	font-weight: 700;
	color: var(--tlh);
}
.ap-btr-select{
	min-width: 92px;
	max-width: 108px;
	height: 26px;
	padding: 0 28px 0 10px;
	font-size: 12px;
	line-height: 24px;
}
@media screen and (max-width: 1280px){
	.ap-recent{max-width: 31%;}
}
@media screen and (max-width: 1180px){
	.ap-recent__label{display: inline; font-size: 15px;}
	.ap-recent__item,
	.ap-recent__trigger,
	.ap-recent__link{width: 32px; height: 32px; min-width: 32px;}
	.ap-btr__label{display: inline !important;}
}
@media screen and (max-width: 980px){
	.ap-recent{max-width: 26%;}
}
@media screen and (max-width: 860px){
	.ap-recent{display: none;}
}


/* --- bottom player latest fixes: dynamic recent + mobile bitrate position --- */
.ap-btr-placeholder{display:none;}
.ap-info > .ap-btr{
	display:block;
	margin-top:3px;
}
.ap-btr__select-wrap{
	gap:0;
}
.ap-btr__label{
	display:none !important;
}
.ap-btr-select{
	min-width:84px;
	max-width:104px;
}
.ap-recent{
	gap:9px;
}
.ap-recent__list{
	gap:6px;
}
.ap-recent__item,
.ap-recent__trigger,
.ap-recent__link{
	width:30px;
	height:30px;
	min-width:30px;
	border-radius:50%;
}
.ap-recent__thumb{
	padding:3px;
}
.ap-recent__thumb img{
	object-fit:contain;
	object-position:center;
}
@media screen and (max-width: 760px){
	.wplayer .audioplayer{
		flex-wrap: wrap;
		row-gap: 8px;
	}
	.wplayer .audioplayer > .ap-btr{
		order: 18;
		margin: 0 6px 0 0;
		flex: 0 0 auto;
	}
	.wplayer .audioplayer > .ap-btr .ap-btr-select{
		height: 34px;
		min-width: 82px;
		max-width: 92px;
		padding: 0 28px 0 10px;
		font-size: 11px;
	}
	.wplayer .audioplayer > .audioplayer-volume{
		order: 19;
	}
	.wplayer .audioplayer > .audioplayer-volume-button{
		order: 17;
	}
}


/* --- bottom player final polish: 5 larger recent icons + slightly lower bar --- */
.wplayer{
	box-shadow: 0 -8px 24px rgba(0,0,0,.08);
}
.audioplayer{
	min-height: 64px;
	padding: 7px 0;
	gap: 12px;
}
.ap-desc{
	gap: 12px;
}
.ap-btns{
	gap: 8px;
}
.ap-recent{
	gap: 8px;
	max-width: 30%;
}
.ap-recent__label{
	font-size: 16px;
}
.ap-recent__list{
	gap: 7px;
}
.ap-recent__item,
.ap-recent__trigger,
.ap-recent__link{
	width: 34px;
	height: 34px;
	min-width: 34px;
}
.ap-recent__thumb{
	padding: 2px;
}
@media screen and (max-width: 1280px){
	.ap-recent{max-width: 28%;}
}
@media screen and (max-width: 980px){
	.audioplayer{
		min-height: 60px;
		padding: 6px 0;
		gap: 9px;
	}
	.ap-desc{gap: 10px;}
	.ap-recent{max-width: 27%;}
	.ap-recent__item,
	.ap-recent__trigger,
	.ap-recent__link{
		width: 32px;
		height: 32px;
		min-width: 32px;
	}
}
@media screen and (max-width: 760px){
	.wplayer .audioplayer{
		row-gap: 6px;
	}
}

/* --- bottom player recent: tighter label + slightly larger icons --- */
.ap-recent{
	margin-left: auto;
	justify-content: flex-start !important;
	align-items: center;
	gap: 6px;
	max-width: 32%;
}
.ap-recent__label{
	margin-right: 0;
	padding-right: 2px;
	flex: 0 0 auto;
}
.ap-recent__list{
	justify-content: flex-start !important;
	flex: 0 1 auto;
	width: auto;
	gap: 8px;
}
.ap-recent__item,
.ap-recent__trigger,
.ap-recent__link{
	width: 36px;
	height: 36px;
	min-width: 36px;
}
.ap-recent__thumb{
	padding: 2px;
}
@media screen and (max-width: 1280px){
	.ap-recent{max-width: 31%;}
}
@media screen and (max-width: 980px){
	.ap-recent{
		max-width: 29%;
		gap: 5px;
	}
	.ap-recent__list{gap: 7px;}
	.ap-recent__item,
	.ap-recent__trigger,
	.ap-recent__link{
		width: 34px;
		height: 34px;
		min-width: 34px;
	}
}

/* --- fix recent icons hover overflow --- */
.ap-recent__item,
.ap-recent__trigger,
.ap-recent__link,
.ap-recent__thumb{
	box-sizing: border-box;
}
.ap-recent__thumb{
	border-radius: 50%;
	overflow: hidden;
}
.ap-recent__trigger:hover,
.ap-recent__link:hover,
.ap-recent__trigger:focus-visible,
.ap-recent__link:focus-visible{
	transform: none;
	box-shadow: inset 0 0 0 2px var(--accent-primary);
	border-color: transparent;
}
.ap-recent__trigger.is-current,
.ap-recent__link.is-current{
	box-shadow: inset 0 0 0 2px var(--accent-primary);
	border-color: transparent;
}
@supports not (color: color-mix(in srgb, red 50%, transparent)) {
	.ap-recent__trigger.is-current,
	.ap-recent__link.is-current{
		box-shadow: inset 0 0 0 2px rgba(0,0,0,.12);
	}
}


/* --- mobile/tablet: quality under settings icon left of volume --- */
.wplayer .ap-settings{
	display: none;
}
@media screen and (max-width: 1024px){
	.wplayer .audioplayer{
		position: relative;
	}
	.wplayer .ap-settings{
		display: inline-flex !important;
		align-items: center;
		justify-content: center;
		width: 36px;
		height: 36px;
		min-width: 36px;
		padding: 0;
		border-radius: 50%;
		border: 1px solid var(--bdc);
		background: var(--bg-darker);
		color: var(--tt-fade);
		cursor: pointer;
		transition: background-color .18s ease, border-color .18s ease, color .18s ease, transform .18s ease;
		order: 17;
		margin-left: 0;
		font-size: 16px;
	}
	.wplayer .ap-settings:hover,
	.wplayer .ap-settings:focus-visible,
	.wplayer .ap-settings.is-active{
		color: var(--accent-primary);
		border-color: var(--accent-primary);
		background: color-mix(in srgb, var(--accent-primary) 10%, var(--bg));
	}
	.wplayer .audioplayer > .ap-info > .ap-btr{
		display: none !important;
	}
	.wplayer .audioplayer > .ap-btr{
		display: none;
		order: 18;
		flex: 0 0 auto;
		margin: 0 6px 0 0;
	}
	.wplayer .audioplayer > .ap-btr.is-active{
		display: block;
	}
	.wplayer .audioplayer > .audioplayer-volume{
		order: 19;
		display: inline-flex !important;
		align-items: center;
	}
	.wplayer .audioplayer > .ap-btr .ap-btr-select{
		height: 34px;
		min-width: 84px;
		max-width: 96px;
		padding: 0 28px 0 10px;
		font-size: 11px;
	}
}
@media screen and (max-width: 760px){
	.wplayer .ap-settings{
		width: 34px;
		height: 34px;
		min-width: 34px;
	}
}
@media screen and (min-width: 1025px){
	.wplayer .ap-settings{
		display: none !important;
	}
}

/* --- mobile/tablet: hide separate quality output, keep only settings icon control --- */
@media screen and (max-width: 1024px){
	.js-page-btr,
	.page__btr{
		display: none !important;
	}
	.wplayer .audioplayer > .ap-info > .ap-btr{
		display: none !important;
	}
}


/* --- mobile/tablet: quality only via settings popup --- */
@media screen and (max-width: 1024px){
	.js-page-btr,
	.page__btr{
		display: none !important;
	}
	.wplayer .audioplayer{
		position: relative;
	}
	.wplayer .audioplayer .ap-desc .ap-info > .ap-btr,
	.wplayer .audioplayer .ap-info > .ap-btr{
		display: none !important;
		position: absolute;
		right: 58px;
		bottom: calc(100% + 10px);
		z-index: 35;
		margin: 0;
		padding: 8px;
		border: 1px solid var(--bdc);
		border-radius: 16px;
		background: var(--bg);
		box-shadow: 0 12px 28px rgba(0,0,0,.14);
	}
	.wplayer .audioplayer .ap-desc .ap-info > .ap-btr.is-active,
	.wplayer .audioplayer .ap-info > .ap-btr.is-active{
		display: block !important;
	}
	.wplayer .audioplayer .ap-desc .ap-info > .ap-btr .ap-btr__select-wrap,
	.wplayer .audioplayer .ap-info > .ap-btr .ap-btr__select-wrap{
		display: block;
	}
	.wplayer .audioplayer .ap-desc .ap-info > .ap-btr .ap-btr-select,
	.wplayer .audioplayer .ap-info > .ap-btr .ap-btr-select{
		display: block;
		width: 100%;
		min-width: 116px;
		max-width: 132px;
		height: 36px;
		padding: 0 30px 0 12px;
		border-radius: 999px;
	}
	.wplayer .audioplayer > .ap-btr,
	.wplayer .audioplayer > .ap-info > .ap-btr{
		display: none !important;
	}
}
@media screen and (max-width: 760px){
	.wplayer .audioplayer .ap-desc .ap-info > .ap-btr,
	.wplayer .audioplayer .ap-info > .ap-btr{
		right: 52px;
		bottom: calc(100% + 8px);
		padding: 7px;
		border-radius: 14px;
	}
	.wplayer .audioplayer .ap-desc .ap-info > .ap-btr .ap-btr-select,
	.wplayer .audioplayer .ap-info > .ap-btr .ap-btr-select{
		min-width: 108px;
		max-width: 124px;
		height: 34px;
	}
}


/* --- final quality behavior: tablet like desktop, mobile via settings only --- */
@media screen and (min-width: 768px){
	.wplayer .ap-settings{
		display: none !important;
	}
	.wplayer .audioplayer > .ap-btr{
		display: none !important;
	}
	.wplayer .audioplayer > .ap-desc > .ap-info > .ap-btr,
	.wplayer .audioplayer .ap-info > .ap-btr{
		position: static !important;
		display: flex !important;
		align-items: center;
		margin: 4px 0 0 !important;
		padding: 0 !important;
		border: 0 !important;
		background: transparent !important;
		box-shadow: none !important;
		width: auto !important;
		left: auto !important;
		right: auto !important;
		bottom: auto !important;
	}
	.js-page-btr,
	.page__btr{
		display: flex !important;
	}
}

@media screen and (max-width: 767px){
	.js-page-btr,
	.page__btr{
		display: none !important;
	}
	.wplayer .ap-settings{
		display: inline-flex !important;
	}
	.wplayer .audioplayer > .ap-desc > .ap-info > .ap-btr,
	.wplayer .audioplayer .ap-info > .ap-btr{
		display: none !important;
	}
	.wplayer .audioplayer > .ap-btr{
		position: absolute !important;
		right: 52px !important;
		left: auto !important;
		bottom: calc(100% + 8px) !important;
		z-index: 35;
		display: none !important;
		margin: 0 !important;
		padding: 7px !important;
		width: auto !important;
		border: 1px solid var(--bdc) !important;
		border-radius: 14px !important;
		background: var(--bg) !important;
		box-shadow: 0 12px 28px rgba(0,0,0,.14) !important;
	}
	.wplayer .audioplayer > .ap-btr.is-active{
		display: block !important;
	}
	.wplayer .audioplayer > .ap-btr .ap-btr__select-wrap{
		display: block;
	}
	.wplayer .audioplayer > .ap-btr .ap-btr-select{
		display: block;
		width: 100%;
		min-width: 108px;
		max-width: 124px;
		height: 34px;
		padding: 0 30px 0 12px;
		border-radius: 999px;
	}
}


/* --- volume popup stability + tablet bitrate left align --- */
.wplayer .audioplayer-volume{
	position: relative;
}
.wplayer .audioplayer-volume::before{
	content: '';
	position: absolute;
	left: 50%;
	bottom: 100%;
	transform: translateX(-50%);
	width: 56px;
	height: 14px;
}
.wplayer .audioplayer-volume-adjust{
	display: block;
	bottom: calc(100% + 2px);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: translateX(-50%) translateY(4px);
	transition: opacity .16s ease, visibility .16s ease, transform .16s ease;
}
.wplayer .audioplayer-volume:hover .audioplayer-volume-adjust,
.wplayer .audioplayer-volume:focus-within .audioplayer-volume-adjust,
.wplayer .audioplayer-volume.is-open .audioplayer-volume-adjust{
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translateX(-50%) translateY(0);
}
@media screen and (min-width: 768px) and (max-width: 1024px){
	.wplayer .audioplayer > .ap-desc > .ap-info,
	.wplayer .audioplayer .ap-info{
		align-items: flex-start;
	}
	.wplayer .audioplayer > .ap-desc > .ap-info > .ap-btr,
	.wplayer .audioplayer .ap-info > .ap-btr,
	.wplayer .audioplayer .ap-btr__select-wrap{
		justify-content: flex-start !important;
		align-self: flex-start !important;
		text-align: left !important;
	}
}

/* --- final bitrate alignment hard-fix: keep control under title on tablet/desktop --- */
@media screen and (min-width: 768px){
	.wplayer .audioplayer{
		align-items: center;
	}
	.wplayer .audioplayer > .ap-desc{
		flex: 1 1 auto !important;
		min-width: 0 !important;
	}
	.wplayer .audioplayer > .ap-desc > .ap-info,
	.wplayer .audioplayer .ap-desc .ap-info{
		flex: 1 1 auto !important;
		min-width: 0 !important;
		align-items: flex-start !important;
		justify-content: center !important;
	}
	.wplayer .audioplayer > .ap-desc > .ap-info > .ap-meta,
	.wplayer .audioplayer .ap-desc .ap-info > .ap-meta{
		width: 100% !important;
		min-width: 0 !important;
	}
	.wplayer .audioplayer > .ap-desc > .ap-info > .ap-btr,
	.wplayer .audioplayer .ap-desc .ap-info > .ap-btr{
		display: block !important;
		position: static !important;
		align-self: flex-start !important;
		justify-content: flex-start !important;
		margin: 4px auto 0 0 !important;
		padding: 0 !important;
		width: auto !important;
		max-width: 100% !important;
		flex: 0 0 auto !important;
		text-align: left !important;
	}
	.wplayer .audioplayer > .ap-desc > .ap-info > .ap-btr .ap-btr__select-wrap,
	.wplayer .audioplayer .ap-desc .ap-info > .ap-btr .ap-btr__select-wrap{
		display: inline-flex !important;
		justify-content: flex-start !important;
		align-items: center !important;
		width: auto !important;
		max-width: 100% !important;
		margin: 0 !important;
	}
	.wplayer .audioplayer > .ap-desc > .ap-info > .ap-btr .ap-btr-select,
	.wplayer .audioplayer .ap-desc .ap-info > .ap-btr .ap-btr-select{
		margin: 0 !important;
	}
	.wplayer .audioplayer > .ap-btr{
		display: none !important;
	}
	.wplayer .ap-settings{
		display: none !important;
	}
}


/* --- bottom player title truncation --- */
.wplayer .ap-desc,
.wplayer .ap-info,
.wplayer .ap-meta{
	min-width: 0;
}
.wplayer .ap-desc{
	flex: 1 1 auto;
	overflow: hidden;
}
.wplayer .ap-info{
	flex: 1 1 auto;
	overflow: hidden;
}
.wplayer .ap-meta{
	display: flex;
	align-items: center;
	width: 100%;
	overflow: hidden;
}
.wplayer .ap-title,
.wplayer .ap-title-link{
	display: block;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* --- final responsive + Safari iPhone 15 Pro Max pass --- */
.wplayer{
	padding-left: max(env(safe-area-inset-left), 0px);
	padding-right: max(env(safe-area-inset-right), 0px);
	overflow: visible;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
}
.wplayer .audioplayer{
	width: min(1320px, calc(100% - 24px));
	min-width: 0;
}
.wplayer .ap-title,
.wplayer .ap-title-link,
.wplayer .ap-meta,
.wplayer .ap-info,
.wplayer .ap-desc{
	min-width: 0;
}
.wplayer .ap-settings,
.wplayer .audioplayer-volume-button a,
.wplayer .ap-fav,
.wplayer .audioplayer-playpause a,
.wplayer .ap-prev,
.wplayer .ap-next{
	touch-action: manipulation;
	-webkit-tap-highlight-color: transparent;
}
.wplayer .ap-btr-select{
	max-width: 100%;
}

@media screen and (min-width: 768px) and (max-width: 1024px){
	.wplayer .audioplayer{
		gap: 10px;
		width: calc(100% - 18px);
	}
	.wplayer .audioplayer > .ap-desc > .ap-info,
	.wplayer .audioplayer .ap-desc .ap-info{
		align-items: flex-start !important;
		justify-content: center !important;
	}
	.wplayer .audioplayer > .ap-desc > .ap-info > .ap-btr,
	.wplayer .audioplayer .ap-desc .ap-info > .ap-btr{
		display: block !important;
		position: static !important;
		margin: 4px auto 0 0 !important;
		padding: 0 !important;
		border: 0 !important;
		background: transparent !important;
		box-shadow: none !important;
		text-align: left !important;
	}
	.wplayer .audioplayer > .ap-desc > .ap-info > .ap-btr .ap-btr__select-wrap,
	.wplayer .audioplayer .ap-desc .ap-info > .ap-btr .ap-btr__select-wrap{
		display: inline-flex !important;
		justify-content: flex-start !important;
		align-items: center !important;
		margin: 0 !important;
	}
	.wplayer .audioplayer > .ap-btr,
	.wplayer .ap-settings{
		display: none !important;
	}
}

@media screen and (max-width: 767px){
	.js-page-btr,
	.page__btr,
	.wplayer .audioplayer > .ap-desc > .ap-info > .ap-btr,
	.wplayer .audioplayer .ap-desc .ap-info > .ap-btr,
	.wplayer .audioplayer .ap-info > .ap-btr{
		display: none !important;
	}
	.wplayer .audioplayer{
		position: relative;
		width: calc(100% - 12px);
		min-height: 58px;
		padding: 6px 0;
		gap: 6px;
	}
	.wplayer .ap-recent{
		display: none !important;
	}
	.wplayer .ap-settings{
		display: inline-flex !important;
		order: 17 !important;
		width: 36px;
		height: 36px;
		min-width: 36px;
		margin-left: 0;
	}
	.wplayer .audioplayer > .audioplayer-volume{
		display: inline-flex !important;
		order: 18 !important;
		margin-left: 0;
	}
	.wplayer .audioplayer > .ap-btr{
		position: absolute !important;
		right: 48px !important;
		left: auto !important;
		bottom: calc(100% + 8px) !important;
		z-index: 200 !important;
		display: none !important;
		margin: 0 !important;
		padding: 7px !important;
		width: auto !important;
		min-width: 0 !important;
		border: 1px solid var(--bdc) !important;
		border-radius: 14px !important;
		background: var(--bg) !important;
		box-shadow: 0 12px 28px rgba(0,0,0,.14) !important;
	}
	.wplayer .audioplayer > .ap-btr.is-active{
		display: block !important;
	}
	.wplayer .audioplayer > .ap-btr .ap-btr__select-wrap{
		display: block !important;
	}
	.wplayer .audioplayer > .ap-btr .ap-btr-select{
		display: block !important;
		width: 100%;
		min-width: 108px;
		max-width: 124px;
		height: 34px;
		padding: 0 30px 0 12px;
		border-radius: 999px;
	}
}

@media screen and (max-width: 430px){
	.wplayer{
		padding-bottom: max(env(safe-area-inset-bottom), 0px);
	}
	.wplayer .audioplayer{
		width: calc(100% - 10px);
		min-height: 56px;
		padding: 5px 0;
		gap: 5px;
	}
	.wplayer .ap-desc{
		gap: 8px;
	}
	.wplayer .ap-img{
		width: 36px;
		height: 36px;
		flex-basis: 36px;
	}
	.wplayer .ap-title{
		font-size: 13px;
	}
	.wplayer .ap-fav,
	.wplayer .ap-prev,
	.wplayer .ap-next,
	.wplayer .ap-settings,
	.wplayer .audioplayer-volume-button a{
		width: 36px;
		height: 36px;
		min-width: 36px;
	}
	.wplayer .audioplayer-playpause a{
		width: 42px;
		height: 42px;
		min-width: 42px;
		line-height: 42px;
	}
	.wplayer .audioplayer > .ap-btr{
		right: 44px !important;
		bottom: calc(100% + 6px) !important;
	}
}

@supports (-webkit-touch-callout: none){
	@media screen and (max-width: 767px){
		.wplayer{
			padding-bottom: max(env(safe-area-inset-bottom), 0px);
		}
		.wplayer .audioplayer > .ap-btr{
			-webkit-transform: translateZ(0);
			transform: translateZ(0);
		}
		.wplayer .ap-btr-select,
		.wplayer .ap-settings,
		.wplayer .audioplayer-volume-button a{
			font-size: 16px;
		}
	}
}


/* Lower player volume: hide only on smartphones; keep visible on desktops/tablets even in narrow windows */
html.ap-smartphone-device .wplayer .audioplayer > .audioplayer-volume {
  display: none !important;
}
html:not(.ap-smartphone-device) .wplayer .audioplayer > .audioplayer-volume {
  display: inline-flex !important;
}

/* === Mobile refinement: <=500px (player + fullstory favorites) === */
@media screen and (max-width: 500px){
	/* Fullstory controls */
	.page__ctrl{
		gap: 10px;
	}
	.page__actions{
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		align-items: stretch;
		gap: 10px;
		width: 100%;
	}
	.page__play{
		width: 100%;
		min-width: 0;
		min-height: 52px;
		justify-content: center;
	}
	.page__actions .page__fav{
		width: auto !important;
		margin-left: 0 !important;
		justify-content: center;
		align-self: stretch;
	}
	.page__fav a{
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 52px;
		height: 52px;
		padding: 0;
		border-radius: 999px;
		border: 1px solid var(--bdc);
		background: var(--bg-darker);
		color: var(--tt-fade);
	}
	.page__fav a:hover{
		border-color: var(--accent-primary);
		color: var(--accent-primary);
	}
	.page__fav .fas.fa-heart,
	.page__fav .fal.fa-heart{
		font-size: 18px;
	}
	.page__favlabel{
		display: none !important;
	}
	.page__vl-box{
		width: 100%;
		gap: 10px;
	}
	.page__vl{
		width: auto;
		flex: 1 1 auto;
		min-width: 0;
	}

	/* Bottom player */
	.audioplayer{
		width: calc(100% - 12px);
		min-height: 56px;
		padding: 6px 0;
		gap: 6px;
	}
	.ap-desc{
		gap: 8px;
		min-width: 0;
	}
	.ap-img{
		width: 38px;
		height: 38px;
		flex-basis: 38px;
	}
	.ap-info{
		min-width: 0;
	}
	.ap-title{
		font-size: 13px;
	}
	.ap-artist,
	.ap-btr,
	.ap-prev,
	.ap-next,
	.audioplayer-volume{
		display: none !important;
	}
	.ap-btns{
		gap: 4px;
	}
	.ap-fav,
	.audioplayer-playpause a{
		width: 36px;
		height: 36px;
		min-width: 36px;
		line-height: 36px;
	}
}

@media screen and (max-width: 380px){
	.page__actions{
		grid-template-columns: 1fr;
	}
	.page__actions .page__fav{
		width: 100% !important;
		justify-content: flex-start;
	}
	.page__fav a{
		width: 48px;
		height: 48px;
	}
	.audioplayer{
		width: calc(100% - 10px);
	}
	.ap-img{
		width: 34px;
		height: 34px;
		flex-basis: 34px;
	}
	.ap-title{
		font-size: 12px;
	}
}


/* --- City frequencies dropdown --- */
.city-freq {
  --city-freq-accent: var(--accent-primary);
  --city-freq-surface: var(--bg);
  --city-freq-surface-soft: var(--bg-darker);
  --city-freq-border: var(--bdc);
  --city-freq-text: var(--tt);
  --city-freq-text-muted: var(--tt-fade);
  --city-freq-hover-bg: color-mix(in srgb, var(--bdc) 44%, var(--bg));
  --city-freq-hover-border: color-mix(in srgb, var(--bdc) 72%, var(--tt) 10%);
  --city-freq-active-bg: color-mix(in srgb, var(--accent-primary) 10%, var(--bg));
  --city-freq-active-border: color-mix(in srgb, var(--accent-primary) 26%, var(--bdc));
  position: relative;
  width: 100%;
  max-width: 520px;
  margin-top: 16px;
  padding: 14px;
  border-radius: 22px;
  background: var(--city-freq-surface);
  background: color-mix(in srgb, var(--city-freq-surface) 86%, var(--city-freq-surface-soft));
  border: 1px solid var(--city-freq-border);
  box-shadow: 0 14px 34px rgba(18, 24, 40, 0.08);
}
.city-freq__summary {
  display: grid;
  grid-template-columns: minmax(0, 156px) minmax(0, 320px);
  gap: 10px;
  align-items: start;
  justify-content: start;
}
.city-freq__meta {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
  min-height: 70px;
  padding: 12px 14px;
  border-radius: 16px;
  background: var(--city-freq-surface);
  border: 1px solid var(--city-freq-border);
  box-shadow: 0 10px 24px rgba(18, 24, 40, 0.04);
}
.city-freq__eyebrow {
  font-size: 11px;
  line-height: 1.25;
  letter-spacing: 0;
  text-transform: none;
  color: var(--city-freq-text-muted);
}
.city-freq__main {
  font-size: 18px;
  line-height: 1.15;
  font-weight: 800;
  color: var(--city-freq-text);
}
.city-freq__control {
  position: relative;
  min-width: 0;
  width: 100%;
  max-width: 320px;
}
.city-freq__trigger {
  width: 100%;
  min-width: 0;
  height: auto;
  min-height: 70px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 16px;
  border: 1px solid var(--city-freq-border);
  background: var(--city-freq-surface);
  color: var(--city-freq-text);
  text-align: left;
  text-transform: none;
  font-size: 14px;
  font-weight: 500;
  white-space: normal;
  box-shadow: none;
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease, background-color .2s ease, color .2s ease;
}
.city-freq__trigger:hover,
.city-freq__trigger:focus-visible {
  background: var(--city-freq-hover-bg);
  border-color: var(--city-freq-hover-border);
  color: var(--city-freq-text);
  box-shadow: 0 8px 18px rgba(18, 24, 40, 0.08);
}
.city-freq__trigger:focus-visible {
  outline: none;
}
.city-freq.is-open .city-freq__trigger {
  background: var(--city-freq-surface);
  border-color: var(--city-freq-active-border);
  box-shadow: 0 10px 24px rgba(18, 24, 40, 0.10);
}
.city-freq__trigger-copy {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.city-freq__trigger-label {
  display: block;
  font-size: 11px;
  line-height: 1.2;
  letter-spacing: 0;
  text-transform: none !important;
  color: var(--city-freq-text-muted);
}
.city-freq__trigger-value {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.city-freq__trigger-city {
  display: block;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 14px !important;
  line-height: 1.3;
  font-weight: 700;
  text-transform: none !important;
  letter-spacing: 0;
  color: var(--city-freq-text);
}
.city-freq__trigger-frequency {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 11px !important;
  line-height: 1.3;
  text-transform: none !important;
  color: var(--city-freq-accent);
  font-weight: 600;
}
.city-freq__trigger-icon {
  flex: 0 0 auto;
  width: 34px;
  height: 34px;
  border-radius: 11px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--city-freq-surface-soft);
  background: color-mix(in srgb, var(--city-freq-accent) 10%, var(--city-freq-surface));
  color: var(--city-freq-text);
  font-size: 14px;
  transition: transform .2s ease, background-color .2s ease;
}
.city-freq__trigger:hover .city-freq__trigger-icon,
.city-freq__trigger:focus-visible .city-freq__trigger-icon {
  background: var(--city-freq-surface-soft);
  background: color-mix(in srgb, var(--bdc) 54%, var(--city-freq-surface));
}
.city-freq.is-open .city-freq__trigger-icon {
  transform: rotate(180deg);
  background: var(--city-freq-surface-soft);
  background: color-mix(in srgb, var(--city-freq-accent) 14%, var(--city-freq-surface));
}
.city-freq__dropdown {
  position: absolute;
  left: 0;
  right: auto;
  top: calc(100% + 8px);
  width: 100%;
  z-index: 30;
  padding: 10px;
  border-radius: 18px;
  background: var(--city-freq-surface);
  background: color-mix(in srgb, var(--city-freq-surface) 94%, transparent);
  border: 1px solid var(--city-freq-border);
  box-shadow: 0 18px 40px rgba(18, 24, 40, 0.16);
  backdrop-filter: blur(18px);
}
.city-freq__search {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 12px;
  height: 42px;
  border-radius: 999px;
  border: 1px solid var(--city-freq-border);
  background: var(--city-freq-surface-soft);
  transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}
.city-freq__search:focus-within {
  border-color: var(--city-freq-active-border);
  box-shadow: 0 0 0 3px rgba(18, 24, 40, 0.08);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--city-freq-accent) 14%, transparent);
}
.city-freq__search i {
  font-size: 16px;
  color: var(--city-freq-text-muted);
}
.city-freq__search-input {
  flex: 1 1 auto;
  min-width: 0;
  height: auto;
  line-height: 1.3;
  border: 0;
  padding: 0;
  background: transparent;
  box-shadow: none;
  font-size: 13px;
  font-weight: 500;
  color: var(--city-freq-text);
}
.city-freq__search-input::placeholder {
  color: var(--city-freq-text-muted);
}
.city-freq__search-input:focus {
  outline: none;
}
.city-freq__options {
  margin-top: 8px;
  max-height: 260px;
  overflow: auto;
  border-radius: 14px;
  background: var(--city-freq-surface);
}
.city-freq__option {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 12px;
  color: var(--city-freq-text);
  text-decoration: none !important;
  border-radius: 12px;
  transition: background-color .2s ease, transform .2s ease, color .2s ease;
}
.city-freq__option + .city-freq__option {
  margin-top: 2px;
}
.city-freq__option:hover,
.city-freq__option:focus {
  background: var(--city-freq-hover-bg);
  color: var(--city-freq-text);
}
.city-freq__option-main {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.city-freq__option-city {
  display: block;
  font-size: 14px;
  line-height: 1.25;
  font-weight: 600;
  text-transform: none;
}
.city-freq__option-frequency {
  font-size: 11px;
  line-height: 1.35;
  color: var(--city-freq-text-muted);
  text-transform: none;
}
.city-freq__option-check {
  opacity: 0;
  transform: scale(.9);
  transition: opacity .2s ease, transform .2s ease;
  font-size: 16px;
  color: var(--city-freq-accent);
}
.city-freq__option.is-active {
  background: var(--city-freq-active-bg);
}
.city-freq__option.is-active .city-freq__option-check {
  opacity: 1;
  transform: scale(1);
}
.city-freq__empty {
  display: none;
  padding: 16px 12px;
  font-size: 12px;
  color: var(--city-freq-text-muted);
}
@supports not (color: color-mix(in srgb, red 50%, transparent)) {
  .city-freq {
    --city-freq-hover-bg: var(--bg-darker);
    --city-freq-hover-border: var(--bdc);
    --city-freq-active-bg: var(--bg-darker);
    --city-freq-active-border: var(--accent-primary);
  }
  .city-freq__trigger-icon,
  .city-freq.is-open .city-freq__trigger-icon {
    background: var(--bg-darker);
  }
}
body.design4 .city-freq,
body.design5 .city-freq {
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.18);
}
body.design4 .city-freq__dropdown,
body.design5 .city-freq__dropdown {
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.3);
}
@media screen and (max-width: 760px) {
  .city-freq {
    max-width: 100%;
    padding: 13px;
    border-radius: 20px;
  }
  .city-freq__summary {
    grid-template-columns: 1fr;
  }
  .city-freq__control {
    max-width: 100%;
  }
  .city-freq__meta,
  .city-freq__trigger {
    min-height: 0;
  }
}
@media screen and (max-width: 500px) {
  .city-freq {
    padding: 12px;
    border-radius: 18px;
  }
  .city-freq__meta,
  .city-freq__trigger {
    padding: 10px 11px;
    border-radius: 14px;
  }
  .city-freq__main {
    font-size: 17px;
  }
  .city-freq__trigger-city {
    font-size: 13px !important;
  }
  .city-freq__trigger-frequency {
    font-size: 10px !important;
  }
  .city-freq__trigger-icon {
    width: 30px;
    height: 30px;
    border-radius: 10px;
  }
  .city-freq__dropdown {
    top: calc(100% + 6px);
    padding: 8px;
    border-radius: 16px;
  }
  .city-freq__search {
    height: 40px;
    padding: 0 11px;
  }
}

/* --- FAQ redesign --- */
.station-faq__heading {
  margin-top: 20px;
  margin-bottom: 10px;
}
.station-faq {
  --faq-accent: var(--accent-primary);
  --faq-surface: var(--bg);
  --faq-surface-soft: var(--bg-darker);
  --faq-border: var(--bdc);
  --faq-text: var(--tt);
  --faq-text-muted: var(--tt-fade);
  --faq-hover-bg: color-mix(in srgb, var(--bdc) 34%, var(--bg));
  --faq-open-bg: color-mix(in srgb, var(--faq-accent) 6%, var(--bg));
  --faq-open-border: color-mix(in srgb, var(--faq-accent) 22%, var(--bdc));
  display: grid;
  gap: 7px;
  margin-bottom: 20px;
}
.station-faq [itemprop="mainEntity"] {
  border-radius: 14px;
  border: 1px solid var(--faq-border);
  background: color-mix(in srgb, var(--faq-surface) 90%, var(--faq-surface-soft));
  overflow: hidden;
  box-shadow: 0 6px 18px rgba(18, 24, 40, 0.04);
  transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}
.station-faq [itemprop="mainEntity"]:hover {
  border-color: color-mix(in srgb, var(--faq-border) 70%, var(--tt) 8%);
  box-shadow: 0 10px 22px rgba(18, 24, 40, 0.06);
}
.station-faq [itemprop="mainEntity"].is-open {
  border-color: var(--faq-open-border);
  background: var(--faq-open-bg);
  box-shadow: 0 10px 24px rgba(18, 24, 40, 0.06);
}
.station-faq .title_spoiler {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  display: flex;
  align-items: stretch;
  gap: 0;
}
.station-faq .title_spoiler > a {
  text-decoration: none;
}
.station-faq .title_spoiler > a:first-child {
  flex: 0 0 auto;
  width: 44px;
  min-height: 46px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--faq-text);
}
.station-faq .title_spoiler > a:last-child {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  align-items: center;
  padding: 11px 14px 11px 0;
  color: var(--faq-text);
  font-size: 15px;
  line-height: 1.3;
  font-weight: 650;
}
.station-faq .title_spoiler:hover,
.station-faq .title_spoiler:focus-within {
  background: var(--faq-hover-bg);
}
.station-faq .title_spoiler svg {
  width: 16px;
  height: 16px;
  transition: transform .2s ease, color .2s ease;
}
.station-faq [itemprop="mainEntity"].is-open .title_spoiler svg {
  transform: rotate(180deg);
  color: var(--faq-accent);
}
.station-faq .title_spoiler span[itemprop="name"] {
  display: block;
}
.station-faq .text_spoiler {
  margin: 0;
  padding: 0 14px 14px 44px;
  border: 0;
  border-top: 1px solid color-mix(in srgb, var(--faq-border) 82%, transparent);
  background: transparent;
  text-align: left;
}
.station-faq .text_spoiler [itemprop="text"] {
  color: var(--faq-text-muted);
  font-size: 14px;
  line-height: 1.55;
}
.station-faq .text_spoiler [itemprop="text"] a {
  color: var(--faq-accent);
}
body.design4 .station-faq [itemprop="mainEntity"],
body.design5 .station-faq [itemprop="mainEntity"] {
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.14);
}
@supports not (color: color-mix(in srgb, red 50%, transparent)) {
  .station-faq {
    --faq-hover-bg: var(--bg-darker);
    --faq-open-bg: var(--bg-darker);
    --faq-open-border: var(--accent-primary);
  }
}
@media screen and (max-width: 760px) {
  .station-faq .title_spoiler > a:first-child {
    width: 42px;
    min-height: 44px;
  }
  .station-faq .title_spoiler > a:last-child {
    padding: 10px 13px 10px 0;
    font-size: 14px;
  }
  .station-faq .text_spoiler {
    padding: 0 13px 13px 42px;
  }
}
@media screen and (max-width: 500px) {
  .station-faq__heading {
    margin-top: 18px;
    margin-bottom: 9px;
  }
  .station-faq {
    gap: 6px;
  }
  .station-faq [itemprop="mainEntity"] {
    border-radius: 13px;
  }
  .station-faq .title_spoiler > a:first-child {
    width: 40px;
    min-height: 42px;
  }
  .station-faq .title_spoiler > a:last-child {
    padding: 9px 12px 9px 0;
    font-size: 13px;
    line-height: 1.28;
  }
  .station-faq .title_spoiler svg {
    width: 15px;
    height: 15px;
  }
  .station-faq .text_spoiler {
    padding: 0 12px 12px 40px;
  }
  .station-faq .text_spoiler [itemprop="text"] {
    font-size: 13px;
    line-height: 1.5;
  }
}

/* --- narrow windows: keep lower player controls on one line --- */
@media screen and (max-width: 680px){
	html:not(.ap-smartphone-device) .wplayer .audioplayer{
		flex-wrap: nowrap !important;
		width: calc(100% - 12px);
		gap: 6px;
		min-width: 0;
	}
	html:not(.ap-smartphone-device) .wplayer .ap-desc,
	html:not(.ap-smartphone-device) .wplayer .ap-info,
	html:not(.ap-smartphone-device) .wplayer .ap-meta{
		min-width: 0;
	}
	html:not(.ap-smartphone-device) .wplayer .ap-desc{
		flex: 1 1 auto;
		overflow: hidden;
	}
	html:not(.ap-smartphone-device) .wplayer .ap-btns{
		flex: 0 0 auto;
		gap: 4px;
	}
	html:not(.ap-smartphone-device) .wplayer .ap-fav,
	html:not(.ap-smartphone-device) .wplayer .audioplayer-playpause a{
		width: 36px;
		height: 36px;
		min-width: 36px;
		line-height: 36px;
	}
	html:not(.ap-smartphone-device) .wplayer .ap-prev,
	html:not(.ap-smartphone-device) .wplayer .ap-next,
	html:not(.ap-smartphone-device) .wplayer .ap-settings,
	html:not(.ap-smartphone-device) .wplayer .audioplayer > .audioplayer-volume,
	html:not(.ap-smartphone-device) .wplayer .audioplayer > .ap-btr{
		display: none !important;
	}
}

/* --- bottom player: keep all icons visible on narrow widths, shrink only title --- */
@media screen and (max-width: 680px){
	html:not(.ap-smartphone-device) .wplayer .audioplayer{
		flex-wrap: nowrap !important;
		align-items: center;
		gap: 6px;
		min-width: 0;
	}
	html:not(.ap-smartphone-device) .wplayer .ap-desc{
		flex: 1 1 1%;
		min-width: 0;
		max-width: none;
		overflow: hidden;
	}
	html:not(.ap-smartphone-device) .wplayer .ap-info,
	html:not(.ap-smartphone-device) .wplayer .ap-meta{
		min-width: 0;
		overflow: hidden;
	}
	html:not(.ap-smartphone-device) .wplayer .ap-title,
	html:not(.ap-smartphone-device) .wplayer .ap-title-link{
		font-size: 12px;
		line-height: 1.2;
		max-width: 100%;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	html:not(.ap-smartphone-device) .wplayer .ap-btns,
	html:not(.ap-smartphone-device) .wplayer .audioplayer > .audioplayer-volume,
	html:not(.ap-smartphone-device) .wplayer .audioplayer > .ap-btr{
		flex: 0 0 auto;
		min-width: auto;
	}
	html:not(.ap-smartphone-device) .wplayer .ap-prev,
	html:not(.ap-smartphone-device) .wplayer .ap-next,
	html:not(.ap-smartphone-device) .wplayer .ap-settings,
	html:not(.ap-smartphone-device) .wplayer .audioplayer > .audioplayer-volume,
	html:not(.ap-smartphone-device) .wplayer .audioplayer > .ap-btr{
		display: inline-flex !important;
	}
}

@media screen and (max-width: 500px){
	.wplayer .audioplayer{
		flex-wrap: nowrap !important;
		align-items: center;
		gap: 4px;
		width: calc(100% - 10px);
		min-width: 0;
	}
	.wplayer .ap-desc{
		flex: 1 1 1%;
		min-width: 0;
		overflow: hidden;
	}
	.wplayer .ap-info,
	.wplayer .ap-meta{
		min-width: 0;
		overflow: hidden;
	}
	.wplayer .ap-img{
		width: 32px;
		height: 32px;
		flex-basis: 32px;
	}
	.wplayer .ap-title,
	.wplayer .ap-title-link{
		font-size: 11px;
		line-height: 1.15;
		max-width: 100%;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	.wplayer .ap-artist{
		font-size: 10px;
		max-width: 100%;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	.wplayer .ap-btns,
	.wplayer .audioplayer > .audioplayer-volume,
	.wplayer .audioplayer > .ap-btr{
		flex: 0 0 auto;
		min-width: auto;
	}
	.wplayer .ap-prev,
	.wplayer .ap-next,
	.wplayer .audioplayer > .audioplayer-volume,
	.wplayer .audioplayer > .ap-btr{
		display: inline-flex !important;
	}
	.wplayer .ap-fav,
	.wplayer .ap-prev,
	.wplayer .ap-next,
	.wplayer .ap-settings,
	.wplayer .audioplayer-volume-button a{
		width: 32px;
		height: 32px;
		min-width: 32px;
		line-height: 32px;
	}
	.wplayer .audioplayer-playpause a{
		width: 36px;
		height: 36px;
		min-width: 36px;
		line-height: 36px;
	}
	.wplayer .ap-btr{
		gap: 2px;
		font-size: 9px;
		margin-top: 0;
	}
	.wplayer .ap-btr span{
		height: 16px;
		min-width: 18px;
		padding: 0 5px;
	}
}

@media screen and (max-width: 380px){
	.wplayer .ap-title,
	.wplayer .ap-title-link{
		font-size: 10px;
	}
	.wplayer .ap-artist{
		font-size: 9px;
	}
	.wplayer .ap-fav,
	.wplayer .ap-prev,
	.wplayer .ap-next,
	.wplayer .ap-settings,
	.wplayer .audioplayer-volume-button a{
		width: 30px;
		height: 30px;
		min-width: 30px;
		line-height: 30px;
	}
	.wplayer .audioplayer-playpause a{
		width: 34px;
		height: 34px;
		min-width: 34px;
		line-height: 34px;
	}
}

/* --- narrow windows: quality chooser only as popup under settings icon --- */
@media screen and (max-width: 680px){
	html:not(.ap-smartphone-device) .wplayer .ap-settings{
		display: inline-flex !important;
	}
	html:not(.ap-smartphone-device) .wplayer .audioplayer > .ap-btr{
		position: absolute !important;
		right: 48px !important;
		left: auto !important;
		bottom: calc(100% + 8px) !important;
		z-index: 200 !important;
		display: none !important;
		margin: 0 !important;
		padding: 7px !important;
		width: auto !important;
		min-width: 0 !important;
		border: 1px solid var(--bdc) !important;
		border-radius: 14px !important;
		background: var(--bg) !important;
		box-shadow: 0 12px 28px rgba(0,0,0,.14) !important;
	}
	html:not(.ap-smartphone-device) .wplayer .audioplayer > .ap-btr.is-active{
		display: block !important;
	}
	html:not(.ap-smartphone-device) .wplayer .audioplayer > .ap-btr .ap-btr__select-wrap{
		display: block !important;
	}
	html:not(.ap-smartphone-device) .wplayer .audioplayer > .ap-btr .ap-btr-select{
		display: block !important;
		width: 100% !important;
		min-width: 108px !important;
		max-width: 124px !important;
		height: 34px !important;
		padding: 0 30px 0 12px !important;
		border-radius: 999px !important;
	}
}

@media screen and (max-width: 500px){
	.wplayer .audioplayer > .ap-btr{
		right: 48px !important;
		display: none !important;
	}
	.wplayer .audioplayer > .ap-btr.is-active{
		display: block !important;
	}
}


/* === Fullstory bitrate select + alternative players === */
.page__btr{
	display:flex;
	align-items:center;
	gap:10px;
	flex-wrap:wrap;
	position:relative;
}
.page__btr-title{
	white-space:nowrap;
	color:var(--tt-fade);
}
.page__btr-select-wrap{
	display:inline-flex;
	align-items:center;
	position:relative;
	min-width:0;
}
.page__btr-select{
	appearance:none;
	-webkit-appearance:none;
	-moz-appearance:none;
	height:36px;
	padding:0 38px 0 14px;
	border:1px solid var(--bdc);
	border-radius:999px;
	background:var(--bg-darker);
	color:var(--tt);
	font-size:12px;
	font-weight:600;
	line-height:1;
	cursor:pointer;
	max-width:220px;
	outline:none;
	box-shadow:none;
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M5 7.5 10 12.5 15 7.5' stroke='%23999' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat:no-repeat;
	background-position:right 12px center;
	background-size:14px 14px;
}
.page__btr-select:hover,
.page__btr-select:focus{
	border-color:var(--accent-primary);
	color:var(--accent-primary);
}
.page__troubleshoot-toggle{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	height:36px;
	padding:0 14px;
	border:1px solid var(--bdc);
	border-radius:999px;
	background:var(--bg-darker);
	color:var(--tt);
	font-size:12px;
	font-weight:600;
	cursor:pointer;
	transition:border-color .18s ease, color .18s ease, background-color .18s ease;
}
.page__troubleshoot-toggle:hover,
.js-page-btr.is-open .page__troubleshoot-toggle{
	border-color:var(--accent-primary);
	color:var(--accent-primary);
}
.page__troubleshoot{
	position:absolute;
	left:0;
	top:calc(100% + 10px);
	z-index:35;
	width:min(720px, calc(100vw - 40px));
}
.page__troubleshoot[hidden]{display:none !important;}
.page__troubleshoot-box{
	padding:16px;
	border:1px solid var(--bdc);
	border-radius:18px;
	background:var(--bg);
	box-shadow:0 18px 40px rgba(0,0,0,.18);
}
.page__troubleshoot-head{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:10px;
	margin-bottom:12px;
}
.page__troubleshoot-title{
	font-size:14px;
	font-weight:700;
	color:var(--tt);
}
.page__troubleshoot-close{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:32px;
	height:32px;
	border:1px solid var(--bdc);
	border-radius:50%;
	background:var(--bg-darker);
	color:var(--tt);
	font-size:20px;
	line-height:1;
	cursor:pointer;
}
.page__troubleshoot-tabs{
	display:flex;
	flex-wrap:wrap;
	gap:8px;
	margin-bottom:14px;
}
.page__troubleshoot-tab{
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	justify-content:center;
	gap:2px;
	min-width:110px;
	padding:10px 12px;
	border:1px solid var(--bdc);
	border-radius:14px;
	background:var(--bg-darker);
	color:var(--tt);
	cursor:pointer;
	text-align:left;
}
.page__troubleshoot-tab span{font-size:12px;font-weight:700;line-height:1.2;}
.page__troubleshoot-tab small{font-size:11px;line-height:1.2;color:var(--tt-fade);}
.page__troubleshoot-tab.is-active{
	border-color:var(--accent-secondary);
	background:color-mix(in srgb, var(--accent-secondary) 16%, var(--bg));
	color:var(--accent-secondary);
}
.page__troubleshoot-panels{position:relative;}
.page__troubleshoot-panel{display:none;}
.page__troubleshoot-panel.is-active{display:block;}
.page__alt-head{margin-bottom:10px;}
.page__alt-title{font-size:14px;font-weight:700;color:var(--tt);margin-bottom:4px;}
.page__alt-desc{font-size:12px;line-height:1.45;color:var(--tt-fade);}
.page__alt-audio{width:100%;margin-bottom:10px;}
.page__alt-note{
	padding:12px 14px;
	border:1px dashed var(--bdc);
	border-radius:14px;
	background:var(--bg-darker);
	color:var(--tt-fade);
	font-size:12px;
	line-height:1.5;
	margin-bottom:10px;
}
.page__alt-status{
	font-size:12px;
	line-height:1.45;
	color:var(--tt-fade);
	margin-bottom:10px;
}
.page__alt-actions{
	display:flex;
	flex-wrap:wrap;
	gap:8px;
}
.page__alt-action{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	height:34px;
	padding:0 12px;
	border:1px solid var(--bdc);
	border-radius:999px;
	background:var(--bg-darker);
	color:var(--tt);
	font-size:12px;
	font-weight:600;
	cursor:pointer;
}
.page__alt-action:hover:not(:disabled){
	border-color:var(--accent-primary);
	color:var(--accent-primary);
}
.page__alt-action:disabled{
	opacity:.5;
	cursor:default;
}
.page__alt-iframe-wrap{
	width:100%;
	height:280px;
	border:1px solid var(--bdc);
	border-radius:14px;
	overflow:hidden;
	background:#000;
	margin-bottom:10px;
}
.page__alt-iframe{
	width:100%;
	height:100%;
	border:0;
	background:#000;
}
@media screen and (max-width: 767px){
	.page__btr{
		align-items:stretch;
	}
	.page__btr-title{
		flex:0 0 100%;
	}
	.page__btr-select-wrap,
	.page__troubleshoot-toggle{
		flex:1 1 auto;
	}
	.page__btr-select,
	.page__troubleshoot-toggle{
		width:100%;
		max-width:none;
	}
	.page__troubleshoot{
		left:0;
		right:0;
		width:100%;
	}
	.page__troubleshoot-box{
		padding:14px;
	}
	.page__troubleshoot-tab{
		flex:1 1 calc(50% - 8px);
		min-width:0;
	}
	.page__alt-iframe-wrap{
		height:220px;
	}
}

/* === Fullstory compact troubleshoot player overrides === */
.page__btr{
	gap:8px;
}
.page__btr-title{
	font-size:11px;
	line-height:1;
}
.page__btr-select{
	height:32px;
	padding:0 32px 0 12px;
	font-size:11px;
	font-weight:600;
	max-width:180px;
	background-position:right 10px center;
	background-size:12px 12px;
}
.page__troubleshoot-toggle{
	height:32px;
	padding:0 11px;
	font-size:11px;
	font-weight:500;
	text-transform:none;
	letter-spacing:0;
}
.page__troubleshoot{
	left:0;
	top:calc(100% + 6px);
	width:min(360px, calc(100vw - 40px));
}
.page__troubleshoot-box{
	padding:12px;
	border-radius:16px;
}
.page__troubleshoot-head,
.page__troubleshoot-tabs,
.page__alt-actions,
.page__troubleshoot-close,
.page__alt-iframe-wrap,
.page__alt-iframe{
	display:none !important;
}
.page__troubleshoot-playerpicker{
	margin-bottom:10px;
}
.page__troubleshoot-select{
	appearance:none;
	-webkit-appearance:none;
	-moz-appearance:none;
	width:100%;
	height:32px;
	padding:0 32px 0 12px;
	border:1px solid var(--bdc);
	border-radius:999px;
	background:var(--bg-darker);
	color:var(--tt);
	font-size:11px;
	font-weight:600;
	line-height:1;
	cursor:pointer;
	outline:none;
	box-shadow:none;
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M5 7.5 10 12.5 15 7.5' stroke='%23999' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat:no-repeat;
	background-position:right 10px center;
	background-size:12px 12px;
}
.page__troubleshoot-select:hover,
.page__troubleshoot-select:focus{
	border-color:var(--accent-primary);
	color:var(--accent-primary);
}
.page__troubleshoot-panels{
	position:static;
}
.page__troubleshoot-panel,
.page__troubleshoot-panel.is-active{
	display:block;
}
.page__alt-audio{
	width:100%;
	margin:0;
}
.page__alt-note{
	margin:0;
	padding:10px 12px;
	font-size:11px;
	line-height:1.45;
}
.page__alt-status{
	margin-top:8px;
	margin-bottom:0;
	font-size:11px;
	line-height:1.4;
}
@media screen and (max-width: 767px){
	.page__btr{
		gap:6px;
	}
	.page__btr-select,
	.page__troubleshoot-toggle{
		height:30px;
		font-size:11px;
	}
	.page__troubleshoot{
		left:0;
		right:0;
		width:100%;
	}
}

/* === Fullstory compact quality + persistent troubleshoot spoiler === */
.page__btr{
	align-items:center;
	gap:8px;
	flex-wrap:nowrap !important;
	overflow:visible;
}
.page__btr-title{
	flex:0 0 auto;
	font-size:12px;
}
.page__btr-select-wrap{
	flex:0 1 auto;
	min-width:0;
}
.page__btr-select{
	height:32px;
	padding:0 30px 0 10px;
	font-size:11px;
	font-weight:600;
	max-width:150px;
	background-position:right 10px center;
	background-size:12px 12px;
}
.page__troubleshoot-toggle{
	flex:0 0 auto;
	height:32px;
	padding:0 10px;
	font-size:11px;
	font-weight:500;
	white-space:nowrap;
	background:transparent;
	transition:border-color .18s ease, color .18s ease;
}
.page__troubleshoot-toggle:hover,
.page__troubleshoot-toggle:focus,
.js-page-btr.is-open .page__troubleshoot-toggle{
	background:transparent;
	border-color:var(--accent-primary);
	color:var(--accent-primary);
}
.page__troubleshoot{
	position:static;
	left:auto;
	top:auto;
	z-index:auto;
	width:100%;
	margin-top:8px;
}
.page__troubleshoot-box{
	padding:12px;
	border-radius:14px;
	box-shadow:none;
}
.page__troubleshoot-playerpicker{
	max-width:220px;
}
.page__troubleshoot-select{
	width:100%;
	height:34px;
	padding:0 34px 0 10px;
	border:1px solid var(--bdc);
	border-radius:12px;
	background:var(--bg-darker);
	color:var(--tt);
	font-size:12px;
	font-weight:600;
	appearance:none;
	-webkit-appearance:none;
	-moz-appearance:none;
	outline:none;
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M5 7.5 10 12.5 15 7.5' stroke='%23999' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat:no-repeat;
	background-position:right 10px center;
	background-size:14px 14px;
}
.page__troubleshoot-select:hover,
.page__troubleshoot-select:focus{
	border-color:var(--accent-primary);
	color:var(--accent-primary);
}
.page__alt-audio{
	margin-top:10px;
	margin-bottom:8px;
}
.page__alt-status{
	margin-bottom:0;
}
@media screen and (max-width: 767px){
	.page__btr{
		flex-wrap:nowrap !important;
		align-items:center;
	}
	.page__btr-title,
	.page__btr-select-wrap,
	.page__troubleshoot-toggle{
		flex:0 0 auto;
	}
	.page__btr-select,
	.page__troubleshoot-toggle{
		width:auto;
	}
	.page__troubleshoot-playerpicker{
		max-width:none;
	}
}

/* === Fullstory spoiler row + smooth scroll target === */
.page__btr{
	flex-wrap:wrap !important;
	align-items:center;
}
.page__btr-title,
.page__btr-select-wrap,
.page__troubleshoot-toggle{
	flex:0 0 auto;
}
.page__troubleshoot{
	position:static;
	left:auto;
	top:auto;
	z-index:auto;
	order:20;
	flex:0 0 100%;
	width:100%;
	margin-top:8px;
	scroll-margin-top:18px;
}
.page__troubleshoot-box{
	width:100%;
}
@media screen and (max-width: 767px){
	.page__btr{
		flex-wrap:wrap !important;
		align-items:center;
	}
	.page__btr-title,
	.page__btr-select-wrap,
	.page__troubleshoot-toggle{
		flex:0 0 auto;
	}
	.page__troubleshoot{
		width:100%;
	}
}

/* === Fullstory final row fix: bitrate + troubleshoot inline, spoiler below === */
.page__btr{
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	gap:8px;
}
.page__btr-row{
	display:flex;
	align-items:center;
	gap:8px;
	flex-wrap:nowrap;
	width:100%;
	min-width:0;
}
.page__btr-row > *{
	min-width:0;
}
.page__btr-title{
	flex:0 0 auto;
	white-space:nowrap;
	font-size:12px;
	line-height:1;
}
.page__btr-select-wrap{
	flex:0 0 auto;
}
.page__btr-select{
	width:140px;
	max-width:140px;
	height:30px;
	padding:0 28px 0 10px;
	font-size:11px;
	background-position:right 9px center;
	background-size:12px 12px;
}
.page__troubleshoot-toggle{
	flex:0 0 auto;
	height:30px;
	padding:0 10px;
	font-size:11px;
	white-space:nowrap;
	background:transparent;
}
.page__troubleshoot-toggle:hover,
.page__troubleshoot-toggle:focus,
.js-page-btr.is-open .page__troubleshoot-toggle{
	background:transparent;
}
.page__troubleshoot{
	order:initial;
	flex:0 0 auto;
	width:100%;
	margin-top:6px;
	scroll-margin-top:0;
}
@media screen and (max-width: 767px){
	.page__btr-row{
		gap:6px;
	}
	.page__btr-select{
		width:126px;
		max-width:126px;
	}
	.page__troubleshoot-toggle{
		padding:0 9px;
	}
}


/* === Fullstory troubleshoot copy + native audio timeline hide + CLS reserves === */
.page__btr-copy{display:none !important;}
.page__troubleshoot-copy{
	font-size:12px;
	line-height:1.5;
	color:var(--tt-fade);
}
.page__troubleshoot-copy--top{
	margin:0 0 10px;
}
.page__troubleshoot-copy--bottom{
	margin:10px 0 0;
}
.page__troubleshoot-copy--bottom a,
.page__troubleshoot-copy--bottom .complaint,
.page__troubleshoot-copy--bottom [data-complaint]{
	color:var(--accent-primary);
}
.page__troubleshoot-panel{overflow:hidden;}
.page__alt-audio{
	display:block;
	width:100%;
	min-height:54px;
}
.page__alt-audio::-webkit-media-controls-timeline,
.page__alt-audio::-webkit-media-controls-current-time-display,
.page__alt-audio::-webkit-media-controls-time-remaining-display{
	display:none !important;
}
.page__alt-audio::-webkit-media-controls-panel{
	padding-left:0;
	padding-right:0;
}
.page__alt-audio::-webkit-media-controls-seek-back-button,
.page__alt-audio::-webkit-media-controls-seek-forward-button{
	display:none !important;
}
.wplayer,
.wplayer .audioplayer{
	min-height:72px;
}
.wplayer .audioplayer{
	align-items:center;
}
.wplayer .ap-prev,
.wplayer .ap-next,
.wplayer .ap-settings,
.wplayer .ap-fav,
.wplayer .audioplayer-playpause,
.wplayer .audioplayer-volume{
	flex:0 0 auto;
}
.wplayer .ap-prev,
.wplayer .ap-next,
.wplayer .ap-settings,
.wplayer .ap-fav,
.wplayer .audioplayer-playpause a,
.wplayer .audioplayer-volume-button a{
	width:40px;
	min-width:40px;
	height:40px;
}
.wplayer .audioplayer-volume{
	min-width:40px;
	min-height:40px;
	justify-content:center;
}
.wplayer .ap-desc{
	min-height:44px;
}
.page__ctrl-left,
.page__vl-box{
	min-height:40px;
}
@media screen and (max-width: 767px){
	.page__troubleshoot-copy{
		font-size:11px;
	}
	.wplayer,
	.wplayer .audioplayer{
		min-height:64px;
	}
}


/* === Fullstory spacing tweak: a bit more space between player row and bitrate row === */
.page__btr{
	margin-top: 6px;
}


/* === CLS reserve for bitrate/troubleshoot row and fullstory volume === */
.page__btr-row--placeholder{
	opacity:1;
}
.page__btr-select--placeholder{
	display:inline-flex;
	align-items:center;
	width:140px;
	max-width:140px;
	pointer-events:none;
	user-select:none;
	color:var(--tt);
}
.page__troubleshoot-toggle--placeholder{
	pointer-events:none;
}
.page__vl-box{
	min-width:226px;
	min-height:34px;
	justify-content:flex-start;
}
.page__vl-mute{
	flex:0 0 34px;
	min-width:34px;
	min-height:34px;
}
.page__vl{
	flex:0 0 180px;
	min-width:180px;
}
@media screen and (max-width: 590px){
	.page__vl-box{
		min-width:186px;
	}
	.page__vl{
		flex-basis:140px;
		min-width:140px;
	}
}


/* === Player2 dropdown: keep only selected compact player visible === */
.page__troubleshoot-panel:not(.is-active){display:none!important;}
.page__troubleshoot-panel.is-active{display:block!important;}

/* === Player2 switch fix + improved compact extra-player UI === */
.page__troubleshoot-box--compact{
	max-width:640px;
	padding:22px 24px 24px;
	border-radius:24px;
	border:1px solid color-mix(in srgb, var(--bdc) 82%, transparent);
	background:linear-gradient(180deg, color-mix(in srgb, var(--bg) 96%, #fff 4%), var(--bg));
	box-shadow:0 10px 28px rgba(0,0,0,.06);
}
.page__troubleshoot-box--compact .page__troubleshoot-copy--top{
	margin:0 0 14px;
	font-size:17px;
	line-height:1.35;
	font-weight:500;
}
.page__troubleshoot-box--compact .page__troubleshoot-playerpicker{
	max-width:440px;
	margin:0 0 16px;
}
.page__troubleshoot-box--compact .page__troubleshoot-select{
	height:54px;
	padding:0 48px 0 20px;
	border-radius:18px;
	font-size:16px;
	font-weight:700;
	letter-spacing:-.01em;
	background-color:var(--bg);
	background-position:right 18px center;
	background-size:18px 18px;
	box-shadow:0 2px 10px rgba(0,0,0,.04);
}
.page__troubleshoot-box--compact .page__troubleshoot-select:hover,
.page__troubleshoot-box--compact .page__troubleshoot-select:focus{
	box-shadow:0 4px 16px rgba(0,0,0,.07);
}
.page__troubleshoot-box--compact .page__troubleshoot-panels{
	margin-top:4px;
}
.page__troubleshoot-box--compact .page__troubleshoot-panel:not(.is-active){
	display:none!important;
}
.page__troubleshoot-box--compact .page__troubleshoot-panel.is-active{
	display:block!important;
	padding:0;
	border:0;
	background:transparent;
}
.page__troubleshoot-box--compact .page__alt-audio{
	display:block;
	width:100%;
	height:64px;
	min-height:64px;
	margin:0;
	border-radius:999px;
	background:var(--bg-darker);
	box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--bdc) 65%, transparent);
}
.page__troubleshoot-box--compact .page__alt-audio::-webkit-media-controls-panel{
	background-color:var(--bg-darker);
}
.page__troubleshoot-box--compact .page__alt-status{
	margin:12px 2px 0;
	font-size:13px;
	line-height:1.45;
}
.page__troubleshoot-box--compact .page__troubleshoot-copy--bottom{
	margin:18px 0 0;
	font-size:15px;
	line-height:1.45;
}
@media screen and (max-width: 767px){
	.page__troubleshoot-box--compact{
		padding:18px 16px 20px;
		border-radius:20px;
	}
	.page__troubleshoot-box--compact .page__troubleshoot-copy--top{
		font-size:15px;
	}
	.page__troubleshoot-box--compact .page__troubleshoot-select{
		height:50px;
		font-size:15px;
		border-radius:16px;
	}
	.page__troubleshoot-box--compact .page__alt-audio{
		height:60px;
		min-height:60px;
	}
	.page__troubleshoot-box--compact .page__troubleshoot-copy--bottom{
		font-size:14px;
	}
}

/* === Player2 compact typography + native audio alignment fix === */
.page__troubleshoot-box--compact{
	max-width:560px;
	padding:18px 20px 20px;
	border-radius:20px;
}
.page__troubleshoot-box--compact .page__troubleshoot-copy{
	color:var(--tt-fade);
	font-weight:400;
	letter-spacing:0;
}
.page__troubleshoot-box--compact .page__troubleshoot-copy--top{
	margin:0 0 10px;
	font-size:14px;
	line-height:1.45;
	font-weight:400;
}
.page__troubleshoot-box--compact .page__troubleshoot-playerpicker{
	max-width:360px;
	margin:0 0 12px;
}
.page__troubleshoot-box--compact .page__troubleshoot-select{
	height:42px;
	min-height:42px;
	padding:0 38px 0 16px;
	border-radius:15px;
	font-size:14px;
	font-weight:600;
	line-height:42px;
	background-position:right 14px center;
	background-size:16px 16px;
}
.page__troubleshoot-box--compact .page__troubleshoot-panels{
	margin-top:2px;
}
.page__troubleshoot-box--compact .page__alt-audio{
	display:block;
	width:100%;
	height:50px!important;
	min-height:50px!important;
	max-height:50px!important;
	margin:0;
	padding:0 4px;
	box-sizing:border-box;
	border-radius:999px;
	overflow:hidden;
	line-height:50px;
	vertical-align:middle;
	background:var(--bg-darker);
}
.page__troubleshoot-box--compact .page__alt-audio::-webkit-media-controls-enclosure{
	height:50px;
	border-radius:999px;
	overflow:hidden;
}
.page__troubleshoot-box--compact .page__alt-audio::-webkit-media-controls-panel{
	height:50px;
	padding:0 8px 0 2px;
	box-sizing:border-box;
	align-items:center;
	background-color:var(--bg-darker);
}
.page__troubleshoot-box--compact .page__alt-audio::-webkit-media-controls-play-button,
.page__troubleshoot-box--compact .page__alt-audio::-webkit-media-controls-mute-button{
	width:30px;
	height:30px;
	margin-top:0;
	margin-bottom:0;
	transform:translateY(0);
}
.page__troubleshoot-box--compact .page__alt-status{
	margin:10px 2px 0;
	font-size:12px;
	line-height:1.45;
	font-weight:400;
}
.page__troubleshoot-box--compact .page__troubleshoot-copy--bottom{
	margin:14px 0 0;
	font-size:13px;
	line-height:1.45;
	font-weight:400;
}
@media screen and (max-width: 767px){
	.page__troubleshoot-box--compact{
		padding:16px 14px 18px;
		border-radius:18px;
	}
	.page__troubleshoot-box--compact .page__troubleshoot-copy--top{
		font-size:13px;
		line-height:1.4;
		margin-bottom:9px;
	}
	.page__troubleshoot-box--compact .page__troubleshoot-playerpicker{
		max-width:320px;
		margin-bottom:10px;
	}
	.page__troubleshoot-box--compact .page__troubleshoot-select{
		height:40px;
		min-height:40px;
		padding-left:14px;
		padding-right:36px;
		border-radius:14px;
		font-size:13px;
		line-height:40px;
	}
	.page__troubleshoot-box--compact .page__alt-audio{
		height:48px!important;
		min-height:48px!important;
		max-height:48px!important;
		line-height:48px;
	}
	.page__troubleshoot-box--compact .page__alt-audio::-webkit-media-controls-enclosure,
	.page__troubleshoot-box--compact .page__alt-audio::-webkit-media-controls-panel{
		height:48px;
	}
	.page__troubleshoot-box--compact .page__alt-status{
		font-size:11px;
	}
	.page__troubleshoot-box--compact .page__troubleshoot-copy--bottom{
		font-size:12px;
	}
}
