YouTube Music Tweaks by tech-how

/* ==UserStyle==
@name           YouTube Music Tweaks
@author         Tristian Dedinas (https://github.com/Tech-How)
@namespace      Tech-How
@version        2.1
@description    A series of UI tweaks for YouTube Music
@supportURL     https://github.com/Tech-How/Light-Theme-for-YouTube-Music/issues/new?assignees=&labels=&projects=&template=tweak_variant.md&title=
@preprocessor   stylus
@var    text        info1       "INFO: The 'Enable Redesign' toggle controls most of this style. Disabling it will remove most color changes."     "Ok"
@var    text        info2       "INFO: The 'ThemeSong Compatibility Mode' toggle allows you to control some additional elements of the ThemeSong browser extension that are otherwise not configurable. This implementation was possible due to the awesome developer of TS and the nature of open-source code. Check out their GitHub page and extension here: https://github.com/KristofferTroncoso"     "Ok"
@var    checkbox        userYTMLogo       "New Logo"       1
@var    checkbox        userYTMAnimations       "Animations"       1
@var    checkbox        userYTMTransitions     "Transition Improvements"        1
@var    checkbox        userYTMTextTransform    "Normal Text Casing"        1
@var    checkbox        userYTMNoStickyHeader     "Allow Album Cover Scroll"  0
@var    checkbox        userYTMStickyBackdrop     "Don't Scroll Album Backdrop"   1
@var    checkbox        userYTMRedesign         "Enable Redesign"       1
@var    color       userYTMAccent       "  Accent Color"      #f00
@var    checkbox        userYTMBackdrop         "  Hide Backdrop Images"        1
@var    checkbox        userYTMShadow           "  Shadowing"         1
@var    checkbox        userYTMRound            "  Rounded Corners"           1
@var    checkbox        userTSCompat           "ThemeSong Compatibility Mode (Requires ThemeSong Extension. Disable this style's redesign to use ThemeSong's.)"   0
@var    checkbox        userTSLogoPatch        "  Fix Logo Conflict"  1
@var    checkbox        userTSBetterPBHead "  Better Player Page Header"  1
@var    checkbox        userTSSaturation       "  Allow Saturated Backdrop"  1
@var    checkbox        userTSWhiteProgress    "  Allow White Progress Bar"  1
@var    checkbox        userTSWideSB           "  Allow Widened Sidebar"  1
@var    checkbox        userTSCollapsedScroll  "  Allow Collapsed Scrollbars"     1
@var    checkbox        userTSCompactLB        "  Allow Compact Right-click"  1
@var    checkbox        userTSLargePBArt       "  Allow Larger Player Bar Art"  1
@var    checkbox        userTSInject           "  Allow ThemeSong UI"    1
==/UserStyle== */

@-moz-document domain("music.youtube.com") {
/* Global Site */

/* Variables */
:root {
    --ytm-bg-app: #0f0f0f;
    --ytm-bg-content: #191919;
    --ytm-content: #f4f4f4;
    --ytm-hover: #262626;
    --ytm-hover-app: #191919;
    --ytm-hover-invert: #ccc;
    --ytm-selected: #333;
    --ytm-seperator: #383838;
    --ytm-seperator-invert: #383838;
    --ytm-text: #fff;
    --ytm-text-invert: #fff;
    --ytm-placeholder: rgba(255,255,255,.5);
    --ytm-btn-mono: #fff;
    --ytm-btn-mono-invert: #000;
    --ytm-btn-tonal: var(--ytm-selected);
    --ytm-accent: userYTMAccent;
    --ytm-accent-invert: var(--ytm-accent); /* Used when the background is black instead of white. */
    --ytm-toggle: #3387ce;
    --ytm-toggle-bg: #3ea6ff;
    --ytm-progress-primary: var(--ytm-accent);
    --ytm-progress-secondary: #555;
    --ytm-progress-tertiary: #333;
    --ytm-scrollbar: #aaa;
}

/* TWEAK_INS?section=colorsDefine&type=begin */
:root {
    --ytm-text-invert-override: #000;
    --ytm-btn-mono-invert-override: #fff;
}
/* TWEAK_INS?section=colorsDefine&type=end */

if userTSCompat {
    if userTSLogoPatch {
        if userYTMLogo {
            #ts-logo-container {
                display: none !important;
            }
        }
    }
    
    if not userTSSaturation {
        .immersive-background ytmusic-fullbleed-thumbnail-renderer, ytmusic-player-page[is-mweb-modernization-enabled] .background-thumbnail.ytmusic-player-page {
            filter: blur(80px) !important;
        }
        
        ytmusic-browse-response[has-background]:not([disable-gradient])[page-type="MUSIC_PAGE_TYPE_PODCAST_SHOW_DETAIL_PAGE"] .background-gradient.ytmusic-browse-response, ytmusic-browse-response[has-background]:not([disable-gradient])[page-type="MUSIC_PAGE_TYPE_NON_MUSIC_AUDIO_TRACK_PAGE"] .background-gradient.ytmusic-browse-response, ytmusic-browse-response[has-background]:not([disable-gradient])[is-bauhaus-web-playlist-detail-page-redesign-enabled] .background-gradient.ytmusic-browse-response, ytmusic-browse-response[has-background]:not([disable-gradient])[is-bauhaus-web-album-detail-page-redesign-enabled] .background-gradient.ytmusic-browse-response, ytmusic-browse-response[has-background]:not([disable-gradient]) .background-gradient.ytmusic-browse-response {
            background-image: linear-gradient(to bottom,rgba(0,0,0,.6),var(--ytmusic-background)) !important;
        }
        
        ytmusic-search-box[is-bauhaus-sidenav-enabled]:not([opened]):not([has-query]) .search-box.ytmusic-search-box {
            background: rgba(255,255,255,.15) !important;
        }
    }
    
    if not userTSWhiteProgress {
        #progress-bar.ytmusic-player-bar[focused], ytmusic-player-bar:hover #progress-bar.ytmusic-player-bar {
            --paper-slider-knob-color: var(--ytm-progress-primary) !important;
            --paper-slider-knob-start-color: var(--ytm-progress-primary) !important;
            --paper-slider-knob-start-border-color: var(--ytm-progress-primary) !important;
        }

        #primaryProgress.tp-yt-paper-progress {
            background: var(--ytm-progress-primary) !important;
        }

        #secondaryProgress.tp-yt-paper-progress {
            background: var(--ytm-progress-secondary) !important;
        }

        #progressContainer.tp-yt-paper-progress, .indeterminate.tp-yt-paper-progress::after {
            background: var(--ytm-progress-tertiary) !important;
        }
    }
    
    if not userTSWideSB {
        ytmusic-app[is-bauhaus-sidenav-enabled]:not([guide-collapsed]) ytmusic-guide-renderer {
            width: 240px !important;
        }

        ytmusic-app[is-bauhaus-sidenav-enabled]:not([guide-collapsed]) {
            --ytmusic-guide-width: 240px !important;
        }
    }
    
    if not userTSCollapsedScroll {
        #items.ytmusic-guide-section-renderer {
            scrollbar-width: auto !important;
        }
    }
    
    if not userTSCompactLB {
        tp-yt-paper-listbox.ytmusic-menu-popup-renderer {
            padding: 16px 0 !important;
        }
        
        .yt-simple-endpoint.ytmusic-menu-navigation-item-renderer, ytmusic-menu-service-item-renderer, ytmusic-toggle-menu-service-item-renderer {
            height: 48px !important;
        }
        
        tp-yt-paper-listbox yt-icon, tp-yt-paper-listbox .yt-icon-container.yt-icon {
            width: var(--iron-icon-width, 24px) !important;
            height: var(--iron-icon-height, 24px) !important;
        }
        
        tp-yt-paper-item.ytmusic-menu-service-item-download-renderer {
            --paper-item-min-height: 48px !important;
            padding: 0 36px 0 16px !important;
        }
        
        yt-icon.ytmusic-menu-service-item-download-renderer {
            margin-right: 16px !important;
        }
    }
    
    if not userTSLargePBArt {
        .thumbnail-image-wrapper.ytmusic-player-bar {
            height: 40px !important;
        }

        .image.ytmusic-player-bar {
            height: 40px !important;
            border-radius: var(--ytm-radius-mini) !important;
        }
    }
    
    
    if not userTSInject {
        #ts-panel-container, #themesongControlButtonsContainer {
            display: none !important;
        }
    }
}

if userYTMTextTransform {
    #tabsContent.tp-yt-paper-tabs, yt-button-renderer yt-formatted-string.yt-button-renderer, .tab-content.tp-yt-paper-tab, tp-yt-paper-button.ytmusic-playlist-form, .tab.ytmusic-item-section-tab-renderer, .tab.selected.ytmusic-item-section-tab-renderer, .more-button.ytmusic-shelf-renderer tp-yt-paper-button.ytmusic-shelf-renderer, tp-yt-paper-button.ytmusic-toggle-button-renderer yt-icon.ytmusic-toggle-button-renderer~yt-formatted-string.ytmusic-toggle-button-renderer, .style-scope.ytmusic-subscribe-button-renderer, .sign-in-link.ytmusic-nav-bar, .done-button.ytmusic-uploads-complete, .library-button.ytmusic-uploads-complete, .stop-button.ytmusic-upload-progression {
        text-transform: none;
    }

    .tab.ytmusic-tabs {
        text-transform: capitalize;
    }

    .style-scope.yt-button-renderer.style-text {
        text-transform: none;
    }
}

if userYTMShadow {
    :root {
        --ytm-shadow-big: 3px 3px 15px rgba(0, 0, 0, .5);
        --ytm-shadow-medium: 0px 0px 4px 2px rgba(0,0,0,0.3);
        --ytm-shadow-small: 0px 0px 3px 2px rgba(0,0,0,0.3);
        --ytm-shadow-mini: 0px 0px 3px 1px rgba(0,0,0,0.3);
        --ytm-shadow-browse: 1px 2px 8px 3px rgba(0,0,0,0.27);
        --ytm-shadow-search: 0px 6px 6px 1px rgba(0, 0, 0, 0.26);
        --ytm-shadow-dropdown: 0px 0px 10px -4px rgba(0,0,0,0.60);
        --ytm-shadow-dialog: 1px 1px 8px 0px rgba(0,0,0,0.3);
        --ytm-shadow-toast: 7px 7px 10px rgba(0, 0, 0, .5);
    }
}

if userYTMRound {
    :root {
        --ytm-radius-big: 10px;
        --ytm-radius-small: 7px;
        --ytm-radius-mini: 3px;
    }
}

/* Animations */
@keyframes fluentDown {
    0% {
        opacity: 0;
        transform: translateY(0px);
    }
    100% {
        opacity: 1;
        transform: translateY(6px);
    }
}

@keyframes fluentUp {
    0% {
        opacity: 0;
  ...