/* =========================================================
   RatedTunes — Custom UI Layer
   Production Patch / Clean Version
   Purpose:
   - dark premium background
   - compact track cards
   - clear title/artist/style hierarchy
   - stable hover / playing states
   - footer and tabs cleanup
   ========================================================= */

/* =========================================================
   1. GLOBAL CLEANUP
   ========================================================= */

/* Hide unwanted legacy/theme element */
.goat {
    display: none !important;
}

/* Remove bottom spacing artifacts */
.ms_index_secwrap:last-child,
.ms_songslist_main:last-child,
.ms_index_inner,
.ms_songslist_wrap {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

/* Hide unused homepage sections */
.section:has(.artist_nav),
.section:has(.album_inner_list),
.section:has(.ms_artist_slider) {
    display: none !important;
}

/* =========================================================
   2. GLOBAL BACKGROUND
   ========================================================= */

html body {
    min-height: 100%;
    background: radial-gradient(circle at 20% 0%, rgba(58, 167, 255, 0.18), transparent 50%), linear-gradient(120deg, #08121f 0%, #0f1f33 55%, #050b14 100%) !important;
    background-attachment: fixed !important;
}

/* =========================================================
   3. WAVEFORM NORMALIZATION
   ========================================================= */

.audioplayer_waveform,
.audioplayer_waveform_inner,
#waveform {
    height: 50px !important;
}

#waveform canvas {
    height: 50px !important;
}

/* =========================================================
   4. TABS UI — New Releases / Most Played / Top 100
   ========================================================= */

.ms_songslist_nav > li > a {
    transition:
        color 0.16s ease,
        opacity 0.16s ease;
}

/* Hover & Active tab */
.ms_songslist_nav > li > a:hover,
.ms_songslist_nav > li > a.active {
    color: #ff4d6d !important;
}

/* Active underline */
.ms_songslist_nav > li > a.active::after,
.ms_songslist_nav > li > a.active:after {
    background: #ff4d6d !important;
    box-shadow: 0 0 10px rgba(58, 167, 255, 0.45) !important;
}

/* Push Blue Light disabled
:root {
    --theme-color: #3aa7ff !important;
}

*/

/*Push Red Light*/
:root {
    --theme-color: #ff4d6d !important;
}

/* =========================================================
   5. TRACK CARD BASE LAYOUT
   ========================================================= */

.playlist-tabbed_track {
    position: relative;
    min-height: 74px;
    padding: 8px 10px !important;
    display: flex;
    align-items: center;
    border-radius: 10px;
    transition:
        background 0.18s ease,
        box-shadow 0.18s ease;
}

/* Left side: number + play + title block */
.ms_songslist_left {
    display: flex;
    align-items: center;
    min-width: 0;
    flex: 1;
}

/* Track number */
.songslist_number {
    width: 34px;
    min-width: 34px;
    text-align: center;
    height: 0 !important;
    justify-content: normal !important;
}

/* Text column */
.songslist_name {
    min-width: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    line-height: 1.1 !important;
}

/* Right side: favorite / time / menu */
.ms_songslist_right {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    min-width: 150px;
    margin-left: 16px;
}

/* =========================================================
   6. TRACK TYPOGRAPHY HIERARCHY
   Title = primary
   Artist = secondary
   Style = micro-chip
   ========================================================= */

/* Title */
.song_name,
.song_name a,
.songslist_name .song_name,
.songslist_name .song_name > a {
    display: block;
    margin-bottom: 2px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 18px !important;
    letter-spacing: 0.01em;
    color: #ffffff !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: color 0.16s ease;
}

/* Artist */
.song_artist,
.song_artist a,
.songslist_name .song_artist,
.songslist_name .song_artist a {
    display: inline-block;
    margin: 0 !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 15px !important;
    color: #8fa3b8 !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    transition: color 0.16s ease;
}

.playlist-tabbed_track:hover .song_artist a {
    color: #becedd !important;
}

/* Style micro-chip */
.track_style,
.songslist_name .track_style {
    display: inline-flex !important;
    align-items: center !important;
    width: fit-content !important;
    max-width: 100%;
    margin: 0 !important;
    padding: 2px 7px !important;
    border-radius: 999px !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #9fd8ff !important;
    background: rgba(58, 167, 255, 0.1) !important;
    border: 1px solid rgba(58, 167, 255, 0.2) !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition:
        background 0.16s ease,
        border-color 0.16s ease,
        color 0.16s ease;
}

/* =========================================================
   7. TRACK CARD HOVER
   Subtle hover only. Playing state is stronger.
   ========================================================= */

/* Base card */
.playlist-tabbed_track {
    position: relative;
    transition:
        background 0.22s cubic-bezier(0.22, 0.61, 0.36, 1),
        box-shadow 0.26s cubic-bezier(0.22, 0.61, 0.36, 1),
        border-color 0.22s ease;
}

/* Hover Fade out Smoke*/

/* Hover / Fade out / Smoke*/
.playlist-tabbed_track:hover {
    background: rgba(255, 255, 255, 0.03) !important;
    box-shadow:
        0 0 0 1px rgba(58, 167, 255, 0.35),
        0 0 18px rgba(58, 167, 255, 0.16) !important;
}

.playlist-tabbed_track:hover .song_name a {
    color: #3aa7ff !important;
}

.playlist-tabbed_track:hover .track_style {
    background: rgba(58, 167, 255, 0.16) !important;
    border-color: rgba(58, 167, 255, 0.35) !important;
}

/* Left accent line */
.playlist-tabbed_track::before {
    content: '';
    position: absolute;
    left: 0;
    top: 10%;
    width: 2px;
    height: 80%;
    background: transparent;
    border-radius: 2px;
    transition:
        background 0.22s cubic-bezier(0.22, 0.61, 0.36, 1),
        box-shadow 0.26s cubic-bezier(0.22, 0.61, 0.36, 1),
        opacity 0.22s ease;
}

/* =========================================================
   8. PLAY BUTTON
   ========================================================= */

.songslist_play-button {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px;
    margin: 0 12px 0 6px !important;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.05) !important;
    display: flex;
    align-items: center;
    justify-content: center;
    transition:
        background 0.18s ease,
        transform 0.18s ease;
}

.songslist_play-button svg {
    width: 12px;
    height: 12px;
}

.songslist_play-button svg path {
    fill: #ffffff !important;
}

.playlist-tabbed_track:hover .songslist_sn {
    color: #3aa7ff !important;
}

.ms_songslist_inner:hover .songslist_play {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* =========================================================
   10. RIGHT SIDE ACTIONS
   ========================================================= */

.ms_songslist_like {
    width: 22px;
    min-width: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #7f96ad !important;
    transition:
        color 0.18s ease,
        transform 0.18s ease;
}

.ms_songslist_like:hover {
    color: #ff4d6d !important;
    transform: scale(1.12);
}

.ms_songslist_like svg path {
    fill: currentColor !important;
}

/* More menu hidden until hover */
.ms_songslist_more {
    width: 16px;
    min-width: 16px;
}

.songslist_moreicon {
    opacity: 0;
    transition: opacity 0.15s ease;
}

.playlist-tabbed_track:hover .songslist_moreicon {
    opacity: 1;
}

.playlist-tabbed_track .songslist_moreicon,
.playlist-tabbed_track .songslist_moreicon svg,
.playlist-tabbed_track .songslist_moreicon svg path {
    color: #7f96ad !important;
    fill: #7f96ad !important;
}

/* Duration */
.ms_songslist_time {
    text-align: right;
    margin: 0 20px !important;
    font-size: 12px !important;
    color: #7f96ad;
}

.playlist-tabbed_track:hover .ms_songslist_time {
    color: #9fb7cf !important;
}

/* =========================================================
   11. RATING BADGE
   Top-right clean number.
   ========================================================= */

.rt-rating {
    position: absolute;
    top: 6px;
    right: 10px;
    z-index: 3;
    font-size: 25px;
    font-weight: 600;
    line-height: 1;
    color: #ffffff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
    pointer-events: none;
}

/* =========================================================
   12. TRACK MICRO METRICS
   Plays / Likes / Comments
   Location: bottom-right inside .playlist-tabbed_track
   Purpose:
   - compact engagement counters
   - no layout shift
   - muted by default, brighter on hover
   ========================================================= */

/* Main metrics container */
.rt-metrics {
    position: absolute;
    right: 10px;
    bottom: 6px;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 12px;
    font-weight: 500;
    line-height: 1;
    color: #7f96ad;
    pointer-events: none;
    white-space: nowrap;
}

/* Single metric item: plays / likes / comments */
.rt-plays,
.rt-like,
.rt-comment {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: inherit;
}

/* Generic metric SVG */
.rt-metric-svg {
    width: 12px;
    height: 12px;
    display: block;
    flex-shrink: 0;
    color: currentColor;
}

/* Force SVG paths to inherit metric color */
.rt-metric-svg path {
    fill: currentColor !important;
}

/* Plays icon fallback if it is still text-based */
.rt-metric-icon {
    font-size: 12px;
    opacity: 0.75;
}

/* Heart icon: slightly larger for better visual balance */
.rt-metric-heart {
    width: 14px !important;
    height: 14px !important;
    /* transform: translateY(0.5px);
    */
}

/* Comment icon: keep compact */
.rt-metric-comment-icon {
    width: 12px !important;
    height: 12px !important;
}

/* Hover state: brighten all metrics together */
.playlist-tabbed_track:hover .rt-metrics {
    color: #9fb7cf;
}

/* Active liked state */
.rt-like.is-liked,
.ms_songslist_like--liked ~ .rt-metrics .rt-like {
    color: #ff6b35 !important;
}

/* =========================================================
   13. FOOTER RESET
   ========================================================= */

.footer {
    display: none !important;
}

.rt-footer {
    display: none;
}

.ms_copyright {
    border-top: none !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
}

.footer_border {
    display: none !important;
}

/* =========================================================
   14. CUSTOM FOOTER
   ========================================================= */

.rt-footer {
    width: 100%;
    margin-top: 20px !important;
    margin-bottom: 80px !important;
    background: linear-gradient(180deg, #07111f 0%, #0b1828 100%);
    color: #8fa6c1;
    overflow: hidden;
}

.rt-footer-glow {
    height: 2px;
    width: 100%;
    background: linear-gradient(90deg, transparent, #3aa7ff, #8b5cf6, #3aa7ff, transparent);
    box-shadow: 0 0 22px rgba(58, 167, 255, 0.75);
}

.rt-footer-inner {
    max-width: 1180px;
    margin: 0 auto;
    padding: 18px 22px 14px !important;
}

.rt-footer-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    align-items: start;
    text-align: center;
}

.rt-footer h4 {
    color: #fff;
    font-size: 16px;
    margin: 0 0 14px;
}

.rt-footer p {
    margin: 7px 0;
    font-size: 14px;
    line-height: 1.5;
}

.rt-footer span {
    color: #d8e7f7;
    font-weight: 600;
}

.rt-footer a {
    display: block;
    margin-top: 8px;
    color: #62b7ff;
    text-decoration: none;
    font-size: 14px;
}

.rt-footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    margin-top: 12px;
    padding-top: 10px;
    text-align: center;
}

.rt-design {
    display: block;
    margin-top: 4px;
    font-size: 14px;
    color: #6f849c;
}

#rt-new-footer {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* =========================================================
   15. RESPONSIVE
   ========================================================= */

@media (max-width: 768px) {
    .playlist-tabbed_track {
        min-height: 68px;
        padding: 9px 6px !important;
    }

    .songslist_number {
        width: 28px;
        min-width: 96px;
    }

    .songslist_play-button {
        margin: 0 9px 0 4px !important;
    }

    .ms_songslist_right {
        gap: 8px;
        margin-left: 8px;
    }

    .ms_songslist_time {
        min-width: 38px;
    }

    .rt-footer-grid {
        grid-template-columns: 1fr;
        gap: 26px;
    }

    .rt-footer-bottom {
        margin-top: 5px !important;
        padding-top: 5px !important;
        text-align: left;
    }
}

/* =========================================================
   16. DEBUG OUTLINE MODE
   Enable by adding class="rt-debug" to body.
   ========================================================= */

body.rt-debug * {
    outline: 1px solid rgba(255, 255, 255, 0.04) !important;
}

body.rt-debug *:hover {
    outline: 1px solid rgba(255, 0, 0, 0.616) !important;
}

body.rt-debug button,
body.rt-debug a {
    outline: 1px solid rgba(0, 255, 255, 0.35) !important;
}

body.rt-debug img,
body.rt-debug svg,
body.rt-debug canvas,
body.rt-debug video {
    outline: 1px solid rgba(255, 0, 0, 0.616) !important;
}

/* =========================================================
   17. REMOVE DEFAULT BLUE HOVER IF NEEDED
   ========================================================= */

/* убираем фон при наведении */

/* если есть hover на внутреннем контейнере */

/* ссылки (чтобы не подсвечивались синим) */

/* кнопка play */

/* =========================================================
   18. HORIZONTAL TRACK GRID — AUTO FLEX ROW WRAP
   2–6 cards depending on screen width
   ========================================================= */

/* remove narrow theme limit */
.ms_index_wrapper .ms_index_secwrap .ms_songslist_main,
.ms_index_secwrap .ms_songslist_main,
.ms_songslist_main {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: 1 1 auto !important;
    margin: 0 !important;
}

/* parent list */
ul.ms_songlist.ms_index_songlist {
    display: flex !important;
    flex-flow: row wrap !important;
    align-items: stretch !important;
    gap: 14px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

/* each item: auto amount per row */
ul.ms_songlist.ms_index_songlist > li {
    display: flex !important;
    flex: 1 0 520px !important;
    min-width: 520px !important;
    /* max-width: 680px !important;
    */

    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

/* card itself */
ul.ms_songlist.ms_index_songlist > li > .playlist-tabbed_track {
    width: 100% !important;
    min-height: 80px !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    border-radius: 14px !important;
}

/* default row internals */
ul.ms_songlist.ms_index_songlist .ms_songslist_left,
ul.ms_songlist.ms_index_songlist .songslist_details {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    min-width: 0 !important;
}

ul.ms_songlist.ms_index_songlist .songslist_thumb {
    width: 60px !important;
    height: 60px !important;
    min-width: 60px !important;
    /* margin: 0 14px 0 0 !important;
    */
}

ul.ms_songlist.ms_index_songlist .songslist_thumb img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

/* mobile */
@media (max-width: 700px) {
    ul.ms_songlist.ms_index_songlist > li {
        flex-basis: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }
}

.ms_index_secwrap {
    display: flex;
    gap: 32px;
}

.ms_songslist_main {
    flex: 1;
}

.rt-right-sidebar {
    width: 420px;
    min-width: 420px;
}

/* RatedTunes: spacing for engagement metrics */
.ms_songslist_right .rt-metrics {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 0 12px !important;
    white-space: nowrap !important;
}

.ms_songslist_right .rt-plays,
.ms_songslist_right .rt-like,
.ms_songslist_right .rt-comment {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
}

.ms_songslist_right .rt-metric-icon,
.ms_songslist_right .rt-metric-svg {
    flex: 0 0 auto !important;
}

.ms_songslist_right .ms_songslist_time {
    margin-left: 10px !important;
}

/* =========================================================
   RatedTunes — Load More / Audio Player Safe Area
   FINAL CLEAN PATCH
   ========================================================= */

/* Anti-flicker: до запуска JS показываем только первые 20 li */
body:not(.rt-loadmore-ready) .tab-pane.active .ms_songlist > li:nth-child(n + 21),
body:not(.rt-loadmore-ready) .tab-pane.active .ms_index_songlist > li:nth-child(n + 21) {
    display: none !important;
}

/* Контейнеры должны расти по высоте, не резать карточки */
html,
body,
#root,
.ms_main_wrapper,
.ms_content_wrapper,
.ms_songslist_main,
.ms_songslist_wrap,
.ms_songslist_box,
.fetcher-wrapper,
.tab-content,
.tab-pane,
.tab-pane.active {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
}

body {
    overflow-x: hidden !important;
}

/* Список карточек: normal flow + safe area снизу */
ul.ms_songlist.ms_index_songlist {
    display: flex !important;
    flex-flow: row wrap !important;
    align-items: stretch !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    /* margin-bottom: 0 !important;
    padding-bottom: 260px !important;
    */
}

ul.ms_songlist.ms_index_songlist > li {
    position: relative !important;
    float: none !important;
}

/* Кнопка Load More — в потоке после списка */
.rt-loadmore-injected {
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    position: relative !important;
    z-index: 2 !important;
    flex: 0 0 100% !important;
    clear: both !important;
    margin: 36px auto 260px auto !important;
    padding: 0 !important;
    text-align: center !important;
}

/* Красная кнопка RatedTunes */
.rt-loadmore-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 180px !important;
    height: 46px !important;
    padding: 0 26px !important;
    border-radius: 14px !important;
    border: 1px solid rgba(255, 59, 92, 0.55) !important;
    background: linear-gradient(180deg, rgba(255, 59, 92, 0.18) 0%, rgba(130, 16, 38, 0.92) 100%) !important;
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    letter-spacing: 0.4px !important;
    cursor: pointer !important;
    box-shadow: 0 8px 24px rgba(120, 0, 24, 0.28) !important;
    transition: all 0.18s ease !important;
}

.rt-loadmore-btn:hover {
    transform: translateY(-1px) !important;
    border-color: rgba(255, 90, 120, 0.95) !important;
    background: linear-gradient(180deg, rgba(255, 80, 110, 0.28) 0%, rgba(150, 18, 46, 0.98) 100%) !important;
    box-shadow:
        0 0 18px rgba(255, 59, 92, 0.35),
        0 10px 30px rgba(120, 0, 24, 0.42) !important;
}

.rt-loadmore-btn:active {
    transform: scale(0.985) !important;
}

/* DevTools / низкая высота viewport */
@media (max-height: 900px) {
    ul.ms_songlist.ms_index_songlist {
        /* padding-bottom: 420px !important;
    */
    }

    .rt-loadmore-injected {
        margin-bottom: 420px !important;
    }
}

@media (max-height: 760px) {
    ul.ms_songlist.ms_index_songlist {
        /* padding-bottom: 520px !important; */
    }

    .rt-loadmore-injected {
        margin-bottom: 520px !important;
    }
}

/* 3 цифры у карточек */
.songslist_sn {
    font-size: 20px !important;
    color: #ff5a78 !important;
}

.songslist_play-button {
    position: absolute !important;
    overflow: hidden !important;
}

.playlist-tabbed_track.rt-loading .songslist_play-button > * {
    opacity: 0 !important;
    visibility: hidden !important;
}

@keyframes rtSpin {
    0% {
        rotate: 0deg;
    }
    100% {
        rotate: 360deg;
    }
}

.playlist-tabbed_track:not(.rt-playing) .player-animation {
    background: transparent !important;
    background-color: transparent !important;
    opacity: 0 !important;
}

.playlist-tabbed_track.rt-loading .songslist_play-button svg {
    opacity: 0 !important;
    visibility: hidden !important;
}

/* НЕ скрывать .playing через visibility/opacity */
/* bars должны оставаться видимыми */
.playlist-tabbed_track.rt-loading .songslist_play-button .playing {
    opacity: 1 !important;
    visibility: visible !important;
}

/* =========================================================
   RT CARD PLAY BUTTON — STABLE PAUSE STATE
   ========================================================= */

.playlist-tabbed_track.rt-loading .songslist_play-button svg,
.playlist-tabbed_track.rt-loading .songslist_play-button .playing,
.playlist-tabbed_track.rt-loading .songslist_play-button .player-animation {
    opacity: 0 !important;
    visibility: hidden !important;
}

.playlist-tabbed_track:not(.rt-loading) .songslist_play-button svg {
    opacity: 1 !important;
    visibility: visible !important;
}

.playlist-tabbed_track:not(.rt-loading) .songslist_play-button .playing,
.playlist-tabbed_track:not(.rt-loading) .songslist_play-button .player-animation {
    display: none !important;
}

.audioplayer_meta {
    display: grid !important;
    grid-template-columns: 56px 1fr auto !important;
    align-items: center !important;
    gap: 12px !important;
    min-width: 420px !important;
}

.audioplayer_meta_info {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    min-width: 0 !important;
}

.audioplayer_meta_artist {
    font-size: 11px !important;
    color: #35c7e8 !important;
    line-height: 1.25 !important;
    margin-top: 4px !important;
}

.audioplayer_meta_style {
    font-size: 11px !important;
    color: rgba(220, 231, 243, 0.72) !important;
    line-height: 1.25 !important;
    margin-top: 4px !important;
}

.rt-player-meta-stats {
    display: grid !important;
    grid-template-columns: auto auto auto !important;
    grid-template-rows: auto auto !important;
    column-gap: 10px !important;
    row-gap: 4px !important;
    align-items: center !important;
    min-width: 120px !important;
    padding-left: 10px !important;
}

.rt-player-current-time {
    color: #35c7e8 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    font-variant-numeric: tabular-nums !important;
}

.rt-player-time-separator {
    color: rgba(220, 231, 243, 0.35) !important;
    font-size: 14px !important;
}

.rt-player-duration {
    color: rgba(220, 231, 243, 0.72) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    font-variant-numeric: tabular-nums !important;
}

.rt-player-bpm {
    grid-column: 1 / 2 !important;
    color: #35c7e8 !important;
    font-size: 11px !important;
    font-weight: 600 !important;
}

.rt-player-bpm-label {
    color: rgba(220, 231, 243, 0.55) !important;
    font-size: 10px !important;
    margin-left: 3px !important;
}

.rt-player-year {
    grid-column: 3 / 4 !important;
    color: rgba(220, 231, 243, 0.72) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
}

/* ================================
   RT AUDIOPLAYER LEFT SIDE COMPACT
   current layout: thumbnail + title/artist/style + time/bpm/year-like slot
================================ */

.audioplayer_meta {
    display: grid !important;
    grid-template-columns: 72px 300px 115px !important;
    align-items: center !important;
    gap: 10px !important;
    min-width: 520px !important;
    height: 100% !important;
}

.audioplayer_meta_image {
    width: 72px !important;
    height: 72px !important;
    flex: 0 0 72px !important;
}

.audioplayer_meta_image img {
    width: 72px !important;
    height: 72px !important;
    object-fit: cover !important;
    border-radius: 0 !important;
}

.audioplayer_meta_title {
    min-width: 0 !important;
    max-width: 320px !important;
    padding: 0 !important;
}

.audioplayer_meta_title h2 {
    margin: 0 !important;
    color: #dce7f3 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.audioplayer_meta_title h2:hover {
    color: #35c7e8 !important;
}

.audioplayer_meta_title .song_artist {
    margin: 4px 0 0 0 !important;
    color: #35c7e8 !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    line-height: 1.25 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* пока style берём из старого n.type, если он выводится */
.audioplayer_meta_title::after {
    content: '' !important;
    display: none !important;
}

.audioplayer_meta_timer {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: flex-start !important;
    min-width: 145px !important;
    padding: 0 !important;
    padding-right: 65px !important;
}

.audioplayer_meta_timer_inner {
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
}

.audioplayer_meta_timer_inner:first-child {
    margin-bottom: 0px !important;
}

.audioplayer_meta_timer--entire {
    color: #35c7e8 !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    font-variant-numeric: tabular-nums !important;
}

.audioplayer_meta_timer_inner:first-child .px-3 {
    color: rgba(220, 231, 243, 0.35) !important;
    font-size: 14px !important;
    padding-left: 13px !important;
    padding-right: 5px !important;
}

.audioplayer_meta_timer--actual {
    color: rgba(220, 231, 243, 0.72) !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    font-variant-numeric: tabular-nums !important;
}

.audioplayer_meta_attribute {
    display: flex !important;
    flex-direction: row !important;
    align-items: baseline !important;
    margin-right: 24px !important;
    gap: 0px !important;
    width: auto;
}

.audioplayer_meta_attribute_inner {
    color: rgba(220, 231, 243, 0.58) !important;
    font-size: 10px !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
}

.audioplayer_meta_attribute_inner:first-child {
    color: #35c7e8 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

/* визуально второй слот под duration — временно style/type.
   Потом заменим JS на year. */
.audioplayer_meta_attribute:nth-child(2) .audioplayer_meta_attribute_inner {
    color: rgba(220, 231, 243, 0.72) !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    text-transform: none !important;
}

.song_style {
    margin: 3px 0 0 0 !important;
    color: rgba(220, 231, 243, 0.62) !important;
    font-size: 10px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    text-transform: none !important;
}

.audioplayer_meta_attribute_separator {
    margin: 0 8px !important;
    color: rgba(220, 231, 243, 0.35) !important;
    font-size: 12px !important;
    font-weight: 500 !important;
}

.audioplayer_meta_attribute_year {
    color: rgba(220, 231, 243, 0.72) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}

.audioplayer_waveform {
    padding: 10px 0px 0px 0px !important;
}

.player-modal_table td {
    padding: 11px 18px !important;
    color: rgba(220, 231, 243, 0.72) !important;
    font-size: 12px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
}

.player-modal_table code {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 52px !important;
    height: 28px !important;
    border-radius: 8px !important;
    background: rgba(53, 199, 232, 0.08) !important;
    border: 1px solid rgba(53, 199, 232, 0.2) !important;
    color: #35c7e8 !important;
    font-size: 13px !important;
    font-weight: 700 !important;
}

/* RT HOTKEYS FIXED ARROWS */
.player-modal_table tr:nth-child(3) code,
.player-modal_table tr:nth-child(4) code,
.player-modal_table tr:nth-child(5) code,
.player-modal_table tr:nth-child(6) code {
    font-size: 0 !important;
}

.player-modal_table tr:nth-child(3) code::before {
    content: '↑';
    font-size: 13px;
}

.player-modal_table tr:nth-child(4) code::before {
    content: '↓';
    font-size: 13px;
}

.player-modal_table tr:nth-child(5) code::before {
    content: '←';
    font-size: 13px;
}

.player-modal_table tr:nth-child(6) code::before {
    content: '→';
    font-size: 13px;
}

/* RT PLAYER FINAL CONTROLS */
.audioplayer_away {
    display: none !important;
}

.audioplayer_controls {
    display: flex !important;
    align-items: center !important;
    margin: 0 0 0 10px !important;
    /* gap: 10px !important;
    */
}

.audioplayer_controls_volume {
    order: 1 !important;
}

/* Hide hotkey labels */
.audioplayer_controls kbd,
.audioplayer_controls .rt-control-key,
.audioplayer_controls .player-control-key {
    display: none !important;
}

/* Small control buttons */
.audioplayer_controls_volume-button,
.rt-player-extra-btn,
.audioplayer_controls_play--previous,
.audioplayer_controls_play--next {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    border-radius: 12px !important;
    background: rgba(2, 15, 25, 0.55) !important;
    color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    line-height: 1 !important;
    transition: all 0.18s ease !important;
}

.rt-player-extra-btn:hover,
.audioplayer_controls_volume-button:hover,
.audioplayer_controls_play--previous:hover,
.audioplayer_controls_play--next:hover,
.rt-player-repeat:hover,
.rt-player-like:hover {
    color: #35c7e8 !important;
    transform: scale(1.08) !important;
}

.audioplayer_controls_play--play:hover svg {
    transform: scale(1.06) !important;
    stroke: #35c7e8 !important;
}

/* Main play button */
.audioplayer_controls_play--play {
    width: 60px !important;
    height: 60px !important;
    /* min-width: 70px !important;
    */
    border-radius: 50% !important;
    border: 2px solid #35d7ff !important;
    box-shadow: 0 0 20px rgba(53, 215, 255, 0.65) !important;
    background: rgba(2, 15, 25, 0.65) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* SVG icons */
.rt-player-svg {
    width: 50px !important;
    height: 50px !important;
    fill: currentColor !important;
    stroke: none !important;
}

.audioplayer_controls_play--play .rt-player-svg {
    width: 40px !important;
    height: 40px !important;
}

.rt-player-svg-fill,
.rt-player-svg-fill path,
.rt-player-svg-fill rect {
    fill: currentColor !important;
    stroke: none !important;
}

/* Extra buttons spacing */
.rt-player-repeat {
    margin-left: 0px !important;
    margin-right: -4px !important;
}

.rt-player-like {
    margin-left: 5px !important;
}

.player-button {
    font-size: 16px !important;
}

.audioplayer_controls_volume-button svg {
    max-height: 16px !important;
}

.audioplayer_controls_play > button svg {
    max-height: 22px;
}

.audioplayer_controls_modal {
    order: 1 !important;
}

.audioplayer_controls_volume:not(.rt-player-repeat-wrap):not(.rt-player-like-wrap):not(.rt-player-playlist-wrap) {
    order: 2 !important;
}

.rt-player-repeat-wrap {
    order: 3 !important;
}

.rt-player-like-wrap {
    order: 7 !important;
}

.rt-player-playlist-wrap {
    order: 8 !important;
}

.audioplayer_controls_play--previous {
    order: 1 !important;
}

.audioplayer_controls_play--play {
    order: 2 !important;
}

.audioplayer_controls_play--next {
    order: 3 !important;
}

.audioplayer_controls_play {
    order: 5 !important;
}

.rt-player-repeat:hover svg path {
    stroke: #35c7e8 !important;
}

.rt-player-repeat:hover {
    transform: scale(1.08) !important;
}

.rt-player-repeat:hover,
.rt-player-like:hover {
    transform: scale(1.08) !important;
}

.rt-player-repeat:hover svg path,
.rt-player-like:hover svg path {
    stroke: #35c7e8 !important;
}

.audioplayer_controls_play--previous:hover svg path,
.audioplayer_controls_play--next:hover svg path {
    fill: #35c7e8 !important;
    stroke: #35c7e8 !important;
}

.rt-player-repeat:hover,
.rt-player-like:hover,
.audioplayer_controls_play--previous:hover,
.audioplayer_controls_play--next:hover {
    transform: scale(1.08) !important;
}

.audioplayer_controls_play--previous:hover svg *,
.audioplayer_controls_play--next:hover svg * {
    fill: #35c7e8 !important;
    stroke: #35c7e8 !important;
}

.audioplayer_controls_play--previous:hover,
.audioplayer_controls_play--next:hover {
    transform: scale(1.08) !important;
}

.rt-repeat-active {
    transform: scale(1.08) !important;
}

.rt-repeat-active svg path {
    stroke: #35c7e8 !important;
}

.hover-debug .songslist_play-button {
    background: red !important;
}

.songslist_thumb .rt-thumb-bars {
    position: absolute !important;
    inset: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    pointer-events: none !important;
    z-index: 5 !important;
}

.songslist_thumb .rt-thumb-bars .playing {
    width: 46px !important;
    height: 42px !important;
    padding: 6px !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: flex-end !important;
    justify-content: center !important;
    gap: 3px !important;
    background: transparent !important;
}

.songslist_thumb .rt-thumb-bars .playing__bar {
    display: block !important;
    width: 4px !important;
    min-width: 4px !important;
    border-radius: 3px !important;
    background: var(--theme-color-blue) !important;
    transform: none !important;
    /* animation: rt-thumb-bar-height 1s ease-in-out infinite alternate !important;
    */
    animation: rt-thumb-bar-height 0.8s ease infinite alternate !important;
}

.songslist_thumb .rt-thumb-bars .playing__bar1 {
    animation-delay: -0.2s !important;
}

.songslist_thumb .rt-thumb-bars .playing__bar2 {
    animation-delay: -0.45s !important;
}

.songslist_thumb .rt-thumb-bars .playing__bar3 {
    animation-delay: -0.7s !important;
}

.songslist_thumb .rt-thumb-bars .playing__bar4 {
    animation-delay: -0.95s !important;
}

.songslist_thumb .rt-thumb-bars .playing__bar5 {
    animation-delay: -1.2s !important;
}

@keyframes rt-thumb-bar-height {
    0% {
        height: 9px;
    }
    10% {
        height: 30%;
    }

    30% {
        height: 80%;
    }
    60% {
        height: 50%;
    }
    80% {
        height: 75%;
    }
    100% {
        height: 60%;
    }
}

/* кад вражения */
.playlist-tabbed_track.rt-loading .songslist_play-button svg,
.playlist-tabbed_track.rt-loading .songslist_play-button .playing,
.playlist-tabbed_track.rt-loading .songslist_play-button .player-animation {
    opacity: 0 !important;
    visibility: hidden !important;
}

.playlist-tabbed_track.rt-loading .songslist_play-button::after {
    content: '' !important;
    display: block !important;
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    width: 16px !important;
    height: 16px !important;
    margin-left: -8px !important;
    margin-top: -8px !important;
    border-radius: 50% !important;
    border: 2px solid rgba(255, 255, 255, 0.18) !important;
    border-top-color: #ffffff !important;
    animation: rtSpin 0.5s linear infinite !important;
    pointer-events: none !important;
    z-index: 9999 !important;
}

.playlist-tabbed_track:not(.rt-loading) .songslist_play-button::after {
    content: none !important;
    display: none !important;
    animation: none !important;
}

.playlist-tabbed_track::before {
    content: '';
    position: absolute;
    left: 0;
    top: 10%;
    width: 2px;
    height: 80%;
    background: transparent;
    border-radius: 2px;
    transition:
        background 0.22s cubic-bezier(0.22, 0.61, 0.36, 1),
        box-shadow 0.26s cubic-bezier(0.22, 0.61, 0.36, 1),
        opacity 0.22s ease;
}

.playlist-tabbed_track:hover::before {
    background: rgb(255 0 0 / 8%) !important;
    box-shadow:
        inset 3px 0 0 #ff3a3a,
        inset 0 0 0 1px rgba(255, 58, 58, 0.28) !important;
}

.playlist-tabbed_track.rt-playing {
    background: rgba(255, 58, 91, 0.08) !important;
    box-shadow:
        inset 3px 0 0 #ff3a3a,
        inset 0 0 0 1px rgba(255, 58, 58, 0.28) !important;
}

/* Цвет карточки */
.playlist-tabbed_track.rt-playing {
    /* background: rgba(53, 199, 232, .12) !important;
    */
    /* background: rgb(53 98 232 / 21%) !important;
    */
    background: rgb(87 121 221 / 10%) !important;
    border: 2px solid #ff3a3a !important;
    box-shadow: 0 0 18px rgba(53, 199, 232, 0.2) !important;
}

/* Color Card Button Play/Pause*/
.playlist-tabbed_track:hover .songslist_play-button {
    background: #ff3a3a !important;
    transform: scale(1.12);
}

.playlist-tabbed_track.rt-playing .song_name a {
    color: #3aa7ff !important;
}

/* =========================================================
   RT PLAYHEAD + REAL ORB
   ========================================================= */

#waveform {
    position: relative !important;
    overflow: visible !important;
    width: 100% !important;
    min-width: 0 !important;
}

#rt-wave-playhead-orb {
    position: absolute !important;
    top: -10px !important;
    left: 0;
    width: 8px !important;
    height: 8px !important;
    transform: translate(-60%, -40%) !important;
    border-radius: 50% !important;
    background: #4ff3ff !important;
    border: 1px solid rgba(255, 255, 255, 0.55) !important;
    box-shadow:
        0 0 14px rgba(0, 229, 255, 1),
        0 0 34px rgba(0, 229, 255, 0.95),
        0 0 64px rgba(0, 229, 255, 0.62),
        0 0 96px rgba(0, 229, 255, 0.28);
    z-index: 1000000 !important;
    pointer-events: none !important;
}

#rt-wave-playhead {
    top: -12px !important;
    height: 84px !important;
}

/* RT WAVEFORM VISUAL OVERRIDE — PLAYED/UNPLAYED LOOK */

#waveform {
    position: relative !important;
    overflow: visible !important;
}

/* darken unplayed waveform area visually */
#waveform::before {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;
    z-index: 3 !important;
    background: rgba(5, 62, 112, 0.18) !important;
    mix-blend-mode: multiply !important;
}

/* soft cyan glow over active waveform area */
body.rt-player-active #waveform {
    filter: brightness(1.05) saturate(1.12) !important;
}

/* RT REAL WAVEFORM LAYER VISUAL TUNING */

#waveform > div:not(#rt-wave-playhead):not(#rt-wave-playhead-orb) {
    filter: brightness(1.12) contrast(1.18) saturate(1.35) !important;
    opacity: 0.92 !important;
}

#waveform > div:not(#rt-wave-playhead):not(#rt-wave-playhead-orb) {
    filter: brightness(1.16) contrast(1.2) saturate(1.45) drop-shadow(0 0 6px rgba(0, 229, 255, 0.18)) drop-shadow(0 0 14px rgba(0, 229, 255, 0.12)) !important;
}

/* Hide original AudioLibrary React SVG logo only */

/* #rt-sidebar-logo {
    position: relative;
    width: 100%;
    height: 150px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 10px;
    padding-bottom: 10px;
    box-sizing: border-box;
    z-index: 20;
} */

/* OLD LOGO REMOVE */
.ms_logo_inner,
.ms_logo,
.logo_inner {
    display: none !important;
}

/* REMOVE OLD SIDEBAR TOP GAP */
.ms_nav_wrapper {
    top: 160px !important;
}

/* metal frame */

/* .ms_sidemenu_wrapper::before {
    content: '';
    position: absolute;
    left: 8px;
    top: 12px;
    right: 8px;
    bottom: 12px;
    border-radius: 28px;
    border: 1px solid rgba(180, 220, 255, 0.16);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.05), transparent 24%, transparent 72%, rgba(0, 170, 255, 0.08));
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.025),
        inset 0 0 24px rgba(0, 150, 255, 0.04);
    pointer-events: none;
    z-index: 1;
} */

/* .ms_sidemenu_wrapper ul,
.ms_sidemenu_wrapper .side_heading,
#rt-sidebar-logo {
    position: relative !important;
    z-index: 5 !important;
} */

/* #rt-sidebar-logo a {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
} */

/* RatedTunes Cyber Metal Sidebar — Final */

/* .ms_sidemenu_wrapper {
    position: absolute !important;
    overflow: hidden !important;
    background: radial-gradient(circle at 18% 5%, rgba(0,210,255,.22), transparent 22%),
        radial-gradient(circle at 96% 36%, rgba(0,90,255,.18), transparent 30%),
        linear-gradient(180deg,#0b2138 0%,#071727 48%,#030c18 100%) !important;


    border-right: 1px solid rgba(85,190,255,.35) !important;

    
    box-shadow: inset 3px 0 0 rgba(0,220,255,.45),
        inset -2px 0 0 rgba(255,255,255,.08),
        0 0 24px rgba(0,150,255,.34),
        12px 0 40px rgba(0,0,0,.48) !important;
} */

/* Inner Glow */
.ms_sidemenu_wrapper {
    position: absolute !important;
    overflow: hidden !important;
    background: radial-gradient(circle at 18% 5%, rgba(0, 210, 255, 0.22), transparent 22%), radial-gradient(circle at 96% 36%, rgba(0, 90, 255, 0.18), transparent 30%), linear-gradient(180deg, transparent 0%, #5feeff 8%, #00a2ff 48%, #59ecff 92%, transparent 100%);

    border-right: 1px solid rgba(85, 190, 255, 0.35) !important;

    box-shadow:
        0 0 6px rgba(0, 220, 255, 1),
        0 0 18px rgba(0, 170, 255, 0.95),
        0 0 42px rgba(0, 120, 255, 0.82),
        0 0 78px rgba(0, 90, 255, 0.6),
        0 0 120px rgba(0, 90, 255, 0.34);
}

/* ===================================================== */
/* RatedTunes Ultra Dark Premium Metal Sidebar */
/* ===================================================== */

/* .ms_sidemenu_wrapper {
    position: absolute !important;
    overflow: hidden !important;
    background: radial-gradient(circle at 22% 4%, rgba(0, 90, 170, 0.1), transparent 24%), linear-gradient(180deg, #08111d 0%, #050c16 48%, #02060d 100%) !important;
    border-right: 1px solid rgba(70, 130, 190, 0.14) !important; */
    /* box-shadow:
        inset 3px 0 0 rgba(0, 130, 210, 0.14),
        inset -1px 0 0 rgba(255, 255, 255, 0.04),
        12px 0 44px rgba(0, 0, 0, 0.68),
        0 0 26px rgba(0, 80, 170, 0.08) !important; 
} */

/* ===================================================== */
/* outer metal frame */
/* ===================================================== */

.ms_sidemenu_wrapper::before {
    content: '';
    position: absolute;
    left: 12px;
    top: 14px;
    right: 10px;
    bottom: 14px;
    border-radius: 34px;
    border: 1px solid rgba(140, 190, 235, 0.14);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.035), transparent 18%, transparent 72%, rgba(0, 110, 210, 0.05));
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.02),
        inset 0 0 24px rgba(0, 100, 180, 0.03),
        0 0 14px rgba(0, 110, 190, 0.08);
    pointer-events: none;
    z-index: 1;
}

/* ===================================================== */
/* left glow accent */
/* ===================================================== */

/* .ms_sidemenu_wrapper::after {
    content: '';
    position: absolute;
    left: 13px;
    top: 30px;
    bottom: 30px;
    width: 8px;
    border-radius: 40px;
    background: linear-gradient(180deg, #8be8ff 0%, #1ca8ff 50%, #7ce4ff 100%);
    box-shadow:
        0 0 12px rgba(0, 4, 255, 0.95),
        0 0 26px rgba(0, 140, 255, 0.7),
        0 0 54px rgba(0, 90, 255, 0.42);
    z-index: 2;
} */

.ms_logo {
    display: none !important;
}

/* ===================================================== */
/* content layers */
/* ===================================================== */

#rt-sidebar-logo,
.ms_sidemenu_wrapper .side_heading,
.ms_sidemenu_wrapper ul {
    position: relative !important;
    z-index: 5 !important;
}

/* ===================================================== */
/* logo */
/* ===================================================== */

#rt-sidebar-logo {
    display: block !important;
    padding: 26px 0 34px !important;
    text-align: center !important;
}

#rt-sidebar-logo img {
    width: 158px !important;
    max-width: 82% !important;
    height: auto !important;
    display: block !important;
    margin: 0 auto !important;
    opacity: 1 !important;
    visibility: visible !important;
    filter: brightness(1.04) contrast(1.08) drop-shadow(0 0 12px rgba(0, 180, 255, 0.34)) !important;
}

/* ===================================================== */
/* menu */
/* ===================================================== */

.ms_sidemenu_wrapper ul {
    padding: 0 16px 0 32px !important;
}

.ms_sidemenu_wrapper ul li {
    margin: 0 0 12px 0 !important;
}

/* ===================================================== */
/* buttons */
/* ===================================================== */

/* .ms_sidemenu_wrapper ul li a {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    min-height: 56px !important;
    padding: 13px 42px 13px 42px !important;
    border-radius: 15px !important;
    color: #8799ad !important;
    font-size: 16px !important;
    font-weight: 650 !important;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.018), rgba(0, 60, 120, 0.018)) !important;

    background: linear-gradient(180deg, #8be8ff 0%, #1ca8ff 50%, #7ce4ff 100%);
    box-shadow:
        0 0 12px rgba(0, 4, 255, 0.95),
        0 0 26px rgba(0, 140, 255, 0.7),
        0 0 54px rgba(0, 90, 255, 0.42);
    z-index: 2;
    border: 1px solid rgba(70, 130, 210, 0.08) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.03),
        inset 0 -1px 0 rgba(0, 0, 0, 0.34),
        0 0 10px rgba(0, 80, 150, 0.03) !important;
    transition: all 0.18s ease !important;
} */

/* ===================================================== */
/* hover */
/* ===================================================== */

/* .ms_sidemenu_wrapper ul li a:hover,
.ms_sidemenu_wrapper ul li.active a {
    color: #ffffff !important;
    background: linear-gradient(135deg, rgba(18, 120, 190, 0.26), rgba(0, 55, 120, 0.14)) !important;
    border-color: rgba(90, 190, 255, 0.42) !important;
    box-shadow:
        inset 5px 0 0 #53d6ff,
        inset 0 1px 0 rgba(255, 255, 255, 0.18),
        inset 0 -1px 0 rgba(0, 0, 0, 0.44),
        0 0 18px rgba(0, 170, 255, 0.38),
        0 0 38px rgba(0, 90, 210, 0.24) !important;
    transform: translateX(1px) !important;
} */


.ms_sidemenu_wrapper ul li a:hover,
.ms_sidemenu_wrapper ul li.active a {

    color: #ffffff !important;

    background:
        linear-gradient(
            90deg,
            rgba(0,140,255,.24) 0%,
            rgba(0,120,255,.12) 34%,
            rgba(0,0,0,0) 100%
        ) !important;

    border-color:
        rgba(90,190,255,.52) !important;

    box-shadow:

    0 0 12px rgba(0,240,255,1),

    0 0 34px rgba(0,220,255,1),

    0 0 84px rgba(0,190,255,.92),

    0 0 160px rgba(0,140,255,.72),

    0 0 320px rgba(0,120,255,.42),

    0 0 520px rgba(0,90,255,.22),

    0 0 720px rgba(0,90,255,.42);

    backdrop-filter:
        blur(4px);

    -webkit-backdrop-filter:
        blur(4px);

    transform:
        translateX(1px) !important;
}

/* ===================================================== */
/* hover accents */
/* ===================================================== */

.ms_sidemenu_wrapper ul li a:hover::before,
.ms_sidemenu_wrapper ul li.active a::before {
    background: #7de4ff;
    box-shadow: 0 0 12px rgba(0, 220, 255, 0.75);
}

.ms_sidemenu_wrapper ul li a:hover::after,
.ms_sidemenu_wrapper ul li.active a::after {
    color: #8ce7ff;
    opacity: 1;
    text-shadow: 0 0 12px rgba(0, 220, 255, 0.62);
}

#rt-sidebar-logo {
    padding: 26px 0 58px !important;
}

/* Удаление Nav Bar */
.ms_sidemenu_wrapper .nav_heading {
    display: none !important;
}

#rt-wave-playhead {
    position: absolute !important;
    top: -12px !important;
    left: 0;

    width: 2px !important;
    height: 84px !important;

    transform: translateX(-2px);

    background: #4ff3ff !important;

    box-shadow:
        0 0 12px rgba(0, 229, 255, 1),
        0 0 28px rgba(0, 229, 255, 0.92),
        0 0 52px rgba(0, 229, 255, 0.55),
        0 0 84px rgba(0, 229, 255, 0.22) !important;

    z-index: 999999 !important;
    pointer-events: none !important;
}

.songslist_play-button {
    transition: background 0.18s ease !important;
}

.playlist-tabbed_track:hover .songslist_play-button,
.playlist-tabbed_track.rt-loading .songslist_play-button,
.playlist-tabbed_track.rt-playing .songslist_play-button {
    transform: none !important;
}

.songslist_play-button,
.playlist-tabbed_track,
.playlist-tabbed_track::before {
    transition: none !important;
}

/* ======================================
RT Sidebar v1 — Neon Metal Panel
====================================== */

.ms_sidemenu_wrapper {
    position: absolute !important;
    overflow: hidden !important;
    width: 250px !important;
    min-height: calc(100vh - 28px) !important;
    margin: 14px 0 14px 18px !important;
    border-radius: 42px !important;
    background: radial-gradient(circle at 22% 8%, rgba(0, 190, 255, 0.14), transparent 28%), linear-gradient(180deg, #071626 0%, #03101d 52%, #020913 100%) !important;
    border: 1px solid rgba(155, 210, 255, 0.34) !important;

    /* box-shadow:
        inset 0 0 0 2px rgba(255, 255, 255, 0.05),
        inset 0 0 36px rgba(0, 120, 255, 0.1),
        0 0 0 1px rgba(0, 190, 255, 0.18),
        0 0 34px rgba(0, 160, 255, 0.35),
        18px 0 44px rgba(0, 0, 0, 0.65) !important;  */
}

/* inner metal frame */
.ms_sidemenu_wrapper::before {
    content: '';
    position: absolute;
    inset: 18px 14px 18px 14px;
    border-radius: 34px;
    border: 1px solid rgba(180, 220, 255, 0.34);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.08), transparent 22%, transparent 76%, rgba(0, 170, 255, 0.08));
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.04),
        inset 0 0 28px rgba(0, 80, 160, 0.08),
        0 0 20px rgba(0, 150, 255, 0.16);
    pointer-events: none;
    z-index: 1;
}

.ms_sidemenu_wrapper::before {
    content: '';

    position: absolute;

    inset: 18px 14px 18px 14px;

    border-radius: 34px;

    border:
        1px solid rgba(180,220,255,.24);

    background:
        linear-gradient(
            135deg,
            rgba(255,255,255,.06),
            transparent 22%,
            transparent 76%,
            rgba(0,170,255,.08)
        );

    box-shadow:

        inset 0 0 0 1px rgba(255,255,255,.04),

        inset 0 0 42px rgba(0,120,255,.18),

        inset 0 0 84px rgba(0,90,255,.12),

        inset 0 0 220px rgba(0,70,255,.14),

        0 0 34px rgba(0,150,255,.22),

        0 0 160px rgba(0,120,255,.22);

    filter:
        brightness(1.08)
        saturate(1.18);

    pointer-events: none;

    z-index: 1;
}



/* hide old logo */
.ms_logo,
.ms_logo_inner,
.logo_inner {
    display: none !important;
}

/* nav wrapper placement move up&down*/
.ms_nav_wrapper {
    top: 250px !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 5 !important;
}

/* RT Sidebar v1 — refined neon rails + top/bottom logo glow */

/* two neon strips on the left with shadow*/
.ms_sidemenu_wrapper::after {
    content: '';
    position: absolute;
    left: 18px;
    top: 34px;
    bottom: 34px;
    width: 9px;
    border-radius: 999px;
    background: linear-gradient(180deg, #6ff6ff 0%, #009dff 48%, #38ecff 100%);
    box-shadow:
        0 0 8px rgba(0, 230, 255, 1),
        0 0 22px rgba(0, 145, 255, 0.82),
        0 0 54px rgba(0, 100, 255, 0.45);
    z-index: 3;
}

/* Remove Sidebar HideButton */
.ms_nav_close{
    display: none;
}