Soundcloud Hyper Dark by junki

Imported from https://raw.githubusercontent.com/JunkiEDM/scultradark/master/SC-HyperDark.user.css

Mirrored from https://raw.githubusercontent.com/JunkiEDM/scultradark/master/SC-HyperDark.user.css

Soundcloud Hyper Dark screenshot
Homepage Install Get Stylus Write a review

Details

Authorjunki

LicenseBSD 2-Clause

Created atApril 09, 2021 23:34

Updated atNovember 22, 2021 09:00

Applies tosoundcloud.com

Statistics

Learn how we calculate statistics in the FAQ.

Total views302

Total installs1106

Weekly installs65

Weekly updates84

Description

A functional, modern redesign of the outdated Soundcloud UX.

History

Daily snapshots of style statistics.

2021-07-072021-07-212021-08-032021-08-172021-08-302021-09-122021-09-262021-10-092021-10-222021-11-052021-11-182021-12-01Date0.008.9017.8026.7035.5044.4053.3062.2071.00Daily countDaily installsDaily updatesDaily views
2021-07-072021-07-222021-08-062021-08-212021-09-042021-09-192021-10-042021-10-182021-11-022021-11-172021-12-01Date0.00140.00280.00420.00550.00690.00830.00970.001100.00Total countTotal installsTotal views

Source code

Source code has over 100k characters, so we truncated it. You can inspect the full source code on install link.
/* ==UserStyle==
@name         Soundcloud Hyper Dark
@description  A functional, modern redesign of the outdated Soundcloud UX.
@namespace    JunkiEDM
@version      0.9.154
@homepageURL  https://github.com/JunkiEDM/scultradark
@supportURL   https://github.com/JunkiEDM/scultradark/issues
@updateURL    https://raw.githubusercontent.com/JunkiEDM/scultradark/master/SC-HyperDark.user.css
@license      BSD 2-Clause
@author       JunkiEDM, IgChi, pawelos076232
@preprocessor uso
@advanced text hue "Orange Hue" "-20"
@advanced text blu "Blue Hue" "15"
@advanced text font "Font" "Inter"
@advanced select widget "Style embeds?" {
    "Yes": "\/**\/",
    "No": "\/*"
}
@advanced select sin "Insights on sidebar?" {
    "Show": "height:100%;",
    "Hide": "height:0;"
}
@advanced select gdpr "Cookie Notice?" {
    "Show": "display:inherit;",
    "Hide": "display:none;"
}
==/UserStyle== *//* --- REMOVE THIS LINE TO SHOW ADVANCED FILTERS ---
@advanced dropdown adv "Enable Advanced Filters?" {
    adv-off "Disabled" <<<EOT /* ---[ Disabled ]--- *\/ EOT;
    adv-on "Enabled" <<<EOT /*[[fil]]*\/ EOT;
}
@advanced text fil "Advanced CSS Filters" "brightness(100%) contrast(100%) saturate(100%)"
==/UserStyle== */

@-moz-document regexp("http(?:s)?:\/\/(?:|www\.)?(?:|secure\.)?soundcloud\.com\/?(?:(?!jobs|settings\/connections)(?:.|[\?\&=\-_\/+])*)") {
    :root {
        --fil: /*[[adv]]*/;
        --hue: /*[[hue]]*/;
        --blu: /*[[blu]]*/;
        --sin: /*[[sin]]*/;
        --gdpr: /*[[gdpr]]*/;
        --font: /*[[font]]*/;
        
        --orange: hsl(calc(20deg + /*[[hue]]*/deg) 100% 61%);
        --blue: hsl(calc(203deg + /*[[blu]]*/deg) 100% 65%);
    }
    /*----------------------------------------------------------------- IMPORT INTER FONT (https://rsms.me/inter) -----------------------------------------------------------------*/
    /*@import url('https://rsms.me/inter/inter.css');*/
    /*@import url('https://rsms.me/inter/inter-display.css');*/
    /*------------------------- static ------------------------- */
    @font-face {
        font-family: 'Inter';
        font-style:  normal;
        font-weight: 100;
        font-display: swap;
        src: url("https://rsms.me/inter/font-files/Inter-Thin.woff2?v=3.18") format("woff2"),
            url("https://rsms.me/inter/font-files/Inter-Thin.woff?v=3.18") format("woff");
    }
    @font-face {
        font-family: 'Inter';
        font-style:  italic;
        font-weight: 100;
        font-display: swap;
        src: url("https://rsms.me/inter/font-files/Inter-ThinItalic.woff2?v=3.18") format("woff2"),
            url("https://rsms.me/inter/font-files/Inter-ThinItalic.woff?v=3.18") format("woff");
    }

    @font-face {
        font-family: 'Inter';
        font-style:  normal;
        font-weight: 200;
        font-display: swap;
        src: url("https://rsms.me/inter/font-files/Inter-ExtraLight.woff2?v=3.18") format("woff2"),
            url("https://rsms.me/inter/font-files/Inter-ExtraLight.woff?v=3.18") format("woff");
    }
    @font-face {
        font-family: 'Inter';
        font-style:  italic;
        font-weight: 200;
        font-display: swap;
        src: url("https://rsms.me/inter/font-files/Inter-ExtraLightItalic.woff2?v=3.18") format("woff2"),
            url("https://rsms.me/inter/font-files/Inter-ExtraLightItalic.woff?v=3.18") format("woff");
    }

    @font-face {
        font-family: 'Inter';
        font-style:  normal;
        font-weight: 300;
        font-display: swap;
        src: url("https://rsms.me/inter/font-files/Inter-Light.woff2?v=3.18") format("woff2"),
            url("https://rsms.me/inter/font-files/Inter-Light.woff?v=3.18") format("woff");
    }
    @font-face {
        font-family: 'Inter';
        font-style:  italic;
        font-weight: 300;
        font-display: swap;
        src: url("https://rsms.me/inter/font-files/Inter-LightItalic.woff2?v=3.18") format("woff2"),
            url("https://rsms.me/inter/font-files/Inter-LightItalic.woff?v=3.18") format("woff");
    }

    @font-face {
        font-family: 'Inter';
        font-style:  normal;
        font-weight: 400;
        font-display: swap;
        src: url("https://rsms.me/inter/font-files/Inter-Regular.woff2?v=3.18") format("woff2"),
            url("https://rsms.me/inter/font-files/Inter-Regular.woff?v=3.18") format("woff");
    }
    @font-face {
        font-family: 'Inter';
        font-style:  italic;
        font-weight: 400;
        font-display: swap;
        src: url("https://rsms.me/inter/font-files/Inter-Italic.woff2?v=3.18") format("woff2"),
            url("https://rsms.me/inter/font-files/Inter-Italic.woff?v=3.18") format("woff");
    }

    @font-face {
        font-family: 'Inter';
        font-style:  normal;
        font-weight: 500;
        font-display: swap;
        src: url("https://rsms.me/inter/font-files/Inter-Medium.woff2?v=3.18") format("woff2"),
            url("https://rsms.me/inter/font-files/Inter-Medium.woff?v=3.18") format("woff");
    }
    @font-face {
        font-family: 'Inter';
        font-style:  italic;
        font-weight: 500;
        font-display: swap;
        src: url("https://rsms.me/inter/font-files/Inter-MediumItalic.woff2?v=3.18") format("woff2"),
            url("https://rsms.me/inter/font-files/Inter-MediumItalic.woff?v=3.18") format("woff");
    }

    @font-face {
        font-family: 'Inter';
        font-style:  normal;
        font-weight: 600;
        font-display: swap;
        src: url("https://rsms.me/inter/font-files/Inter-SemiBold.woff2?v=3.18") format("woff2"),
            url("https://rsms.me/inter/font-files/Inter-SemiBold.woff?v=3.18") format("woff");
    }
    @font-face {
        font-family: 'Inter';
        font-style:  italic;
        font-weight: 600;
        font-display: swap;
        src: url("https://rsms.me/inter/font-files/Inter-SemiBoldItalic.woff2?v=3.18") format("woff2"),
            url("https://rsms.me/inter/font-files/Inter-SemiBoldItalic.woff?v=3.18") format("woff");
    }

    @font-face {
        font-family: 'Inter';
        font-style:  normal;
        font-weight: 700;
        font-display: swap;
        src: url("https://rsms.me/inter/font-files/Inter-Bold.woff2?v=3.18") format("woff2"),
            url("https://rsms.me/inter/font-files/Inter-Bold.woff?v=3.18") format("woff");
    }
    @font-face {
        font-family: 'Inter';
        font-style:  italic;
        font-weight: 700;
        font-display: swap;
        src: url("https://rsms.me/inter/font-files/Inter-BoldItalic.woff2?v=3.18") format("woff2"),
            url("https://rsms.me/inter/font-files/Inter-BoldItalic.woff?v=3.18") format("woff");
    }

    @font-face {
        font-family: 'Inter';
        font-style:  normal;
        font-weight: 800;
        font-display: swap;
        src: url("https://rsms.me/inter/font-files/Inter-ExtraBold.woff2?v=3.18") format("woff2"),
            url("https://rsms.me/inter/font-files/Inter-ExtraBold.woff?v=3.18") format("woff");
    }
    @font-face {
        font-family: 'Inter';
        font-style:  italic;
        font-weight: 800;
        font-display: swap;
        src: url("https://rsms.me/inter/font-files/Inter-ExtraBoldItalic.woff2?v=3.18") format("woff2"),
            url("https://rsms.me/inter/font-files/Inter-ExtraBoldItalic.woff?v=3.18") format("woff");
    }

    @font-face {
        font-family: 'Inter';
        font-style:  normal;
        font-weight: 900;
        font-display: swap;
        src: url("https://rsms.me/inter/font-files/Inter-Black.woff2?v=3.18") format("woff2"),
            url("https://rsms.me/inter/font-files/Inter-Black.woff?v=3.18") format("woff");
    }
    @font-face {
        font-family: 'Inter';
        font-style:  italic;
        font-weight: 900;
        font-display: swap;
        src: url("https://rsms.me/inter/font-files/Inter-BlackItalic.woff2?v=3.18") format("woff2"),
            url("https://rsms.me/inter/font-files/Inter-BlackItalic.woff?v=3.18") format("woff");
    }


    /* ----------------------- variable ----------------------- */

    @font-face {
        font-family: 'Inter var';
        font-style: normal;
        font-weight: 100 900;
        font-display: swap;
        src: url('https://rsms.me/inter/font-files/Inter-roman.var.woff2?v=3.18') format('woff2');
        font-named-instance: 'Regular';
    }

    @font-face {
        font-family: 'Inter var';
        font-style: italic;
        font-weight: 100 900;
        font-display: swap;
        src: url('https://rsms.me/inter/font-files/Inter-italic.var.woff2?v=3.18') format('woff2');
        font-named-instance: 'Italic';
    }

    /* ----------- experimental multi-axis variable -----------

    Slant axis is not yet widely supported (as of February 2019) and thus this
    multi-axis single-file variable font is opt-in rather than the default.
    When using this, you will likely need to set font-variation-settings explicitly, e.g:
      * { font-variation-settings: "slnt" 0deg }
        .italic { font-variation-settings: "slnt" 10deg }
    */

    @font-face {
        font-family: 'Inter var experimental';
        font-style: oblique 0deg 10deg;
        font-weight: 100 900;
        font-display: swap;
        src: url('https://rsms.me/inter/font-files/Inter.var.woff2?v=3.18') format('woff2');
    }

    /* Legacy name (became legacy on Feb 2, 2019) */
    @font-face {
        font-family: 'Inter var alt';
        font-weight: 100 900;
        font-style: normal;
        font-named-instance: 'Regular';
        font-display: swap;
        src: url("https://rsms.me/inter/font-files/Inter-roman.var.woff2?v=3.18") format("woff2");
    }
    @font-face {
        font-family: 'Inter var alt';
        font-weight: 100 900;
        font-style: italic;
        font-named-instance: 'Italic';
        font-display: swap;
        src: url("https://rsms.me/inter/font-files/Inter-italic.var.woff2?v=3.18") format("woff2");
    }
    
    /*----------------------------------------------------------------- IMPORT ULTRA DARK (https://33kk.github.io/uso-archive/?style=176264) -----------------------------------------------------------------*/
    /* Modification of SoundCloud Ultra Dark by IgChi: userstyles.org/styles/176264 */
    .l-collection,
    .listenNetwork {
        margin-left: 15px;
        margin-right: 15px
    }
    #app:not(body[marginwidth="0"][marginheight="0"] #app),
    #app header:not(.g-flex-row-spread) {
        height: calc(100vh - 90px)
    }
    .g-z-index-header-menu[style] {
        border: 1px solid #fff!important;
        box-shadow: 0 0 10px #0d0d0d!important
    }
    @font-face {
        font-family: glue1-spoticon;
        src: url(https://open.scdn.co/fonts/spoticon_regular_2.woff2) format("woff2"), url(https://open.scdn.co/fonts/spoticon_regular_2.woff) format("woff"), url(https://open.scdn.co/fonts/spoticon_regular_2.ttf) format("truetype");
        font-weight: 400;
        font-style: normal
    }
    @font-face {
        font-family: spotify-circular;
        src: url(https://open.scdn.co/fonts/CircularSpUIv3T-Light.woff2) format("woff2"), url(https://open.scdn.co/fonts/CircularSpUIv3T-Light.woff) format("woff"), url(https://open.scdn.co/fonts/CircularSpUIv3T-Light.ttf) format("truetype");
        font-weight: 200;
        font-style: normal;
        font-display: swap
    }
    @font-face {
        font-family: spotify-circular;
        src: url(https://open.scdn.co/fonts/CircularSpUIv3T-Book.woff2) format("woff2"), url(https://open.scdn.co/fonts/CircularSpUIv3T-Book.woff) format("woff"), url(https://open.scdn.co/fonts/CircularSpUIv3T-Book.ttf) format("truetype");
        font-weight: 400;
        font-style: normal;
        font-display: swap
    }
    @font-face {
        font-family: spotify-circular;
        src: url(https://open.scdn.co/fonts/CircularSpUIv3T-Bold.woff2) format("woff2"), url(https://open.scdn.co/fonts/CircularSpUIv3T-Bold.woff) format("woff"), url(https://open.scdn.co/fonts/CircularSpUIv3T-Bold.ttf) format("truetype");
        font-weight: 600;
        font-style: normal;
        font-display: swap
    }
    @font-face {
        font-family: spotify-circular-arabic;
        src: url(https://open.scdn.co/fonts/CircularSpUIAraOnly-Light.woff2) format("woff2"), url(https://open.scdn.co/fonts/CircularSpUIAraOnly-Light.woff) format("woff"), url(https://open.scdn.co/fonts/CircularSpUIAraOnly-Light.otf) format("opentype");
        font-weight: 200;
        font-style: normal;
        font-display: swap
    }
    @font-face {
        font-family: spotify-circular-arabic;
        src: url(https://open.scdn.co/fonts/CircularSpUIAraOnly-Book.woff2) format("woff2"), url(https://open.scdn.co/fonts/CircularSpUIAraOnly-Book.woff) format("woff"), url(https://open.scdn.co/fonts/CircularSpUIAraOnly-Book.otf) format("opentype");
        font-weight: 400;
        font-style: normal;
        font-display: swap
    }
    @font-face {
        font-family: spotify-circular-arabic;
        src: url(https://open.scdn.co/fonts/CircularSpUIAraOnly-Bold.woff2) format("woff2"), url(https://open.scdn.co/fonts/CircularSpUIAraOnly-Bold.woff) format("woff"), url(https://open.scdn.co/fonts/CircularSpUIAraOnly-Bold.otf) format("opentype");
        font-weight: 600;
        font-style: normal;
        font-display: swap
    }
    @font-face {
        font-family: spotify-circular-hebrew;
        src: url(https://open.scdn.co/fonts/CircularSpUIHbrOnly-Light.woff2) format("woff2"), url(https://open.scdn.co/fonts/CircularSpUIHbrOnly-Light.woff) format("woff"), url(https://open.scdn.co/fonts/CircularSpUIHbrOnly-Light.otf) format("opentype");
        font-weight: 200;
        font-style: normal;
        font-display: swap
    }
    @font-face {
        font-family: spotify-circular-hebrew;
        src: url(https://open.scdn.co/fonts/CircularSpUIHbrOnly-Book.woff2) format("woff2"), url(https://open.scdn.co/fonts/CircularSpUIHbrOnly-Book.woff) format("woff"), url(https://open.scdn.co/fonts/CircularSpUIHbrOnly-Book.otf) format("opentype");
        font-weight: 400;
        font-style: normal;
        font-display: swap
    }
    @font-face {
        font-family: spotify-circular-hebrew;
        src: url(https://open.scdn.co/fonts/CircularSpUIHbrOnly-Bold.woff2) format("woff2"), url(https://open.scdn.co/fonts/CircularSpUIHbrOnly-Bold.woff) format("woff"), url(https://open.scdn.co/fonts/CircularSpUIHbrOnly-Bold.otf) format("opentype");
        font-weight: 600;
        font-style: normal;
        font-display: swap
    }
    @font-face {
        font-family: spotify-circular-cyrillic;
        src: url(https://open.scdn.co/fonts/CircularSpUICyrOnly-Light.woff2) format("woff2"), url(https://open.scdn.co/fonts/CircularSpUICyrOnly-Light.woff) format("woff"), url(https://open.scdn.co/fonts/CircularSpUICyrOnly-Light.otf) format("opentype");
        font-weight: 200;
        font-style: normal;
        font-display: swap
    }
    @font-face {
        font-family: spotify-circular-cyrillic;
        src: url(https://open.scdn.co/fonts/CircularSpUICyrOnly-Book.woff2) format("woff2"), url(https://open.scdn.co/fonts/CircularSpUICyrOnly-Book.woff) format("woff"), url(https://open.scdn.co/fonts/CircularSpUICyrOnly-Book.otf) format("opentype");
        font-weight: 400;
        font-style: normal;
        font-display: swap
    }
    @font-face {
        font-family: spotify-circular-cyrillic;
        src: url(https://open.scdn.co/fonts/CircularSpUICyrOnly-Bold.woff2) format("woff2"), url(https://open.scdn.co/fonts/CircularSpUICyrOnly-Bold.woff) format("woff"), url(https://open.scdn.co/fonts/CircularSpUICyrOnly-Bold.otf) format("opentype");
        font-weight: 600;
        font-style: normal;
        font-display: swap
    }
    html {
        min-height: 100vh
    }
    body, body.sc-classic {
        background: #111!important;
        overflow: auto
    }
    ::-webkit-scrollbar,
    div::-webkit-scrollbar {
        width: 10px
    }
    ::-webkit-scrollbar-track,
    div::-webkit-scrollbar-track {
        background: #0d0d0d
    }
    ::-webkit-scrollbar-thumb,
    div::-webkit-scrollbar-thumb {
        background: #222
    }
    ::-webkit-scrollbar-thumb:hover,
    div::-webkit-scrollbar-thumb:hover {
        background: #444
    }
    #dropdown-button-53 ul:last-child {
        border-bottom: 0
    }
    .loading {
        background: url(https://a-v2.sndcdn.com/assets/images/loader-db80c58.gif) center center no-repeat;
        filter: invert(1)
    }
    h2.selectionModule__titleText {
        font-size: 28px;
        font-weight: 600;
        color: #fff
    }
    .playableTile {
        width: 120px;
        padding-bottom: 60px
    }
    .userBadge__usernameLink,
    a.playableTile__heading {
        text-align: center;
        font-weight: 400;
        font-size: 14px;
        color: #fff!important
    }
    .userBadge__usernameLink:hover,
    a.playableTile__heading:hover {
        text-align: center;
        font-size: 14px;
        color: #fff
    }
    .sc-classic .badgeList__item, .badgeList__item {
        width: 150px
    }
    .l-collection {
        margin-right: 15px
    }
    .playableTile__usernameHeading,
    a.playableTile__usernameHeading {
        color: #fff;
        opacity: .6;
        font-weight: 200;
        text-align: center;
    }
    .playableTile__usernameHeadingContainer {
        width: 100%;
        text-align: center;
        display: flex;
        flex-direction: row;
        justify-content: center;
    }
    #app header,
    .header__inner {
        width: 230px;
        box-sizing: border-box
    }
    a.playableTile__usernameHeading:hover {
        opacity: 1;
        color: #fff;
        text-decoration: underline
    }
    .sc-border-light-bottom,
    .sc-border-light-right,
    .sc-border-light-top,
    .selectionModule {
        border: 0
    }
    .image__lightOutline .image__full {
        box-shadow: 0 0 10px rgba(0, 0, 0, .3)
    }
    .listenArtworkWrapper__artwork .image__lightOutline .image__full {
        box-shadow: 0 0 20px 0 #0008; /*box-shadow: 0 0 15px 0 #000*/
    }
    .moreActions, .imageEditDropdown,
    .sc-classic .moreActions, .sc-classic .imageEditDropdown {
        /*border: 1px solid rgba(0, 0, 0, .15);*/
        border: 1px solid #6663;
        border-radius: .5rem;
        background: #1119;
        backdrop-filter: blur(32px);
        padding: 5px 0;
        box-shadow: 2px 2px 12px #0006;
    }
    .moreActions .moreActions__button.sc-button-medium, .imageEditDropdown .sc-button {
        border: 0;
        background: 0 0;
        color: #b3b3b3;
        cursor: default;
        font-size: 14px!important
    }
    .moreActions .moreActions__button.sc-button-medium:before {
        filter: brightness(3)
    }
    .moreActions .moreActions__button.sc-button-medium:hover, .imageEditDropdown .sc-button:hover {
        color: #fff;
        background: #333
    }
    .moreActions .moreActions__button.sc-button-medium:hover:before {
        filter: brightness(6)
    }
    #app {
        display: flex
    }
    #app header {
        background: 0
    }
    .header__inner {
        background: #111;
        display: flex;
        flex-direction: column;
        height: 100%
    }
    .header__inner .header__logo {
        width: 100%;
        background: 0
    }
    .header__inner .header__logo .header__logoLink {
        width: 20%;
        margin-left: 100px;
        background: #f40;
        /*background: linear-gradient(#f70,#f00);*/
        background: linear-gradient(#f80,#f10);
        /*-webkit-mask-size: contain;*/
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-position: center;
        -webkit-mask-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAWCAQAAAAs/tcnAAABMUlEQVR4Ac3UJfQUARTGUaxnrBHpPeDu7u7uTg/QO/SK9q1U3KHg2i7fH4exNeSdc9/ZNL/RHfRfjdHOuOajt246b7Fh/T38WO/9OnfM7s+hx3gUh5XNWYN7D4wnTlOe6OGsv/6eQlQFmNX9WScTs4jqwD3DOr/j04gJxHyiOsCiTgITibnEdGIJURc410lgJrGYmE+sIuoCz1301BstGwxueqQLiVXEMmI9cVp7c9WIYmAqkUysIjYQa4mtRAJtJwb//kgXEdOJTcR2Yiuxi2g/wIYfgTnEBmIFsYvYS+whDhCdBFo/ApuJvcRO4hBxhDhMHCU6Cbz5EThKHCe+7BNEcXceKFxB/e7yFs0h1hP1u/OHXHiL6nfnr2nhO6jfR3r50L5cR9O+oX5+/FX8vfkElmh0Xu+KRLEAAAAASUVORK5CYII=)
    }
    .header__inner .header__right {
        /*box-shadow: 2px 2px 2px #0d0d0d;*/
        box-shadow: 2px 2px 24px #0003;
        border-radius: 8px;
        position: absolute;
        left: 10px;
        height: 90px;
        /*background: linear-gradient(30deg, #401702 -200%, transparent);*/
        background: linear-gradient(30deg, #401702 -200%, #1a181890);
        border: 1px solid #35333355;
        transition-duration: 3s
    }
    .header__inner .header__right:hover {
        box-shadow: 2px 2px 12px #0009;
        transition-duration: 0.5s
    }
    .header__inner .header__right div.header__userNav {
        position: absolute;
        bottom: 0;
        width: 100%
    }
    .creatorsNavigation {
        margin: 15px
    }
    .header__soundInput .left {
        z-index: 1;
        position: absolute;
        top: 40px;
        left: 110px
    }
    .header__inner .header__right div.header__userNav .header__userNavUsernameButton {
        width: 100%
    }
    .header__inner .header__right div.header__userNav .header__userNavUsernameButton .header__userNavUsername {
        display: block
    }
    .header__inner .header__right ul.header__navMenu {
        position: absolute;
        bottom: 0;
        right: 0
    }
    .header__navWrapper {
        width: 90%
    }
    .header__navWrapper .header__navMenu {
        width: 100%;
        display: flex;
        flex-direction: column
    }
    .header__navWrapper .header__navMenu li {
        width: 100%
    }
    #app .l-container:not(.siteTakeoverOverlay) {
        padding: 0;
        margin: 0;
        width: 100%;
        box-sizing: border-box
    }
    #app .l-container.l-content:not(.siteTakeoverOverlay) {
        width: calc(100% - 230px);
        position: relative;
        left: 230px
    }
    #app .l-container.l-content .l-fluid-fixed {
        padding: 0 15px;
        min-height: 130vh
    }
    #app .l-container.l-content .l-fluid-fixed .l-main {
        margin-right: 330px
    }
    #app .l-container.l-content .l-fluid-fixed .l-sidebar-right {
        right: 15px;
        transition: right .2s, background .2s
    }
    @media(max-width:1000px) {
        #app .l-container.l-content .l-fluid-fixed .l-main {
            margin-right: 50px
        }
        #app .l-container.l-content .l-fluid-fixed .l-sidebar-right {
            right: -260px!important;
            z-index: 9;
            padding: 0 15px;
            background: #181818
        }
        #app .l-container.l-content .l-fluid-fixed .l-sidebar-right:hover {
            right: 0!important
        }
    }
    #app .l-container #content {
        overflow: hidden;
        box-sizing: border-box;
        position: relative;
        margin-bottom: 90px;
        padding-bottom: 40px;
    }
    #app .l-container #content .l-about-rows,
    #app .l-container #content .listenEngagement {
        border: 0;
        margin-left: 15px
    }
    #app .l-container #content .truncatedAudioInfo.m-collapsed.m-overflow .truncatedAudioInfo__wrapper {
        -webkit-mask-image: linear-gradient(to top, transparent 0, #000 40px)
    }
    #app .l-container #content .truncatedAudioInfo.m-collapsed.m-overflow .truncatedAudioInfo__wrapper::after {
        background: 0
    }
    #app .l-container #content .sc-button.sc-button-small:not(.sc-button-follow).sc-button-selected:before {
        filter: hue-rotate(360deg)
    }
    #app .l-container #content .sc-button.sc-button-small:not(.sc-button-follow):before {
        filter: brightness(10)
    }
    #app .l-container #content .sc-button.sc-button-small:not(.sc-button-follow).sc-button-repost:not(.sc-button-selected):before {
        background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48dGl0bGU+c3RhdHNfcmVwb3N0PC90aXRsZT48cGF0aCBkPSJNMiA2djVjMCAxLjEwNS45MDIgMiAyLjAwOSAyaDYuOTg3SDEwbC0yLTJINFY2aC0uNUg2TDMgMyAwIDZoMnptNC0zaC0uOTk2IDYuOTg3QzEzLjA5OCAzIDE0IDMuODk1IDE0IDV2NWgtMlY1SDhMNiAzem0xMCA3aC02bDMgMyAzLTN6IiBmaWxsPSIjMjIyIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=)
    }
    #app .l-container #content .truncatedUserDescription.m-overflow.m-collapsed .truncatedUserDescription__wrapper::after {
        background: linear-gradient(rgba(255, 255, 255, 0), #111)
    }
    #app .l-container #content .dropbar {
        width: calc(100% - 230px);
        transform: translate3d(15px, -120px, 0)
    }
    #app .l-container #content .dropbar .dropbar__content {
        width: 100%;
        box-sizing: border-box;
        background: linear-gradient(#0d0d0d, 80%, #1110)
    }
    #app .l-container #content .statsOverview .dropbar .dropbar__content {
        height: 50px
    }
    #app .l-container #content .statsOverview .dropbar .dropbar__content .statsDropbarTabs__tab {
        padding: 10px 0
    }
    #app .l-container #content .dropbar .dropbar__content .userDropbar {
        padding: 14px 0
    }
    #app .l-container #content .dropbar.m-active {
        transform: translate3d(15px, -46px, 0)
    }
    #app .l-container #content .statsOverview .dropbar.m-active {
        transform: translate3d(-15px, -46px, 0)
    }
    #app .l-container #content .l-vertical-bar .userInfoBar .userInfoBar__buttons .sc-button-edit:hover,
    #app .l-container #content .l-vertical-bar .userInfoBar .userInfoBar__buttons .sc-button-message:hover,
    #app .l-container #content .l-vertical-bar .userInfoBar .userInfoBar__buttons .sc-button-more:hover,
    #app .l-container #content .l-vertical-bar .userInfoBar .userInfoBar__buttons .sc-button-share:hover {
        transform: scale(1.06)
    }
    /*#app .l-container #content .l-vertical-bar .userInfoBar .userInfoBar__buttons .sc-button-follow:hover {
        box-shadow: inset 0 0 0 2px #f50
    }*/
    #app .l-container #content .l-user-hero {
        z-index: 9998;
        min-height: 0px
    }
    #app .l-container #content .l-user-hero:after {
        z-index: -1;
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        bottom: 0;
        background: #111
    }
    #app .l-container #content .l-user-hero .profileHeader {
        min-height: 250px;
        margin: 0
    }
    #app .l-container #content .l-user-hero .profileHeader .profileHeaderInfo,
    #app .l-container #content .l-user-hero .profileHeader .profileHeader__info {
        height: 100%
    }
    #app .l-container #content .l-user-hero .profileHeader .profileHeaderInfo__avatar.sc-media-image {
        position: absolute;
        left: 40px;
        top: 40px;
        /* filter: drop-shadow(5px 5px 3px #090909);*/
        z-index: 9;
        transform: scale(1.075);
    }
    .imageContent h2 {
        color: #ccc
    }
    #app .l-container #content .l-user-hero .profileHeader .profileHeaderInfo__content {
        height: 100%;
        display: inline-flex;
        justify-content: center;
        flex-direction: column;
        align-items: flex-end;
        z-index: 2;
        position: relative;
        margin-right: 360px;
        float: right;
        bottom: 16px;
        /*bottom: 45px;
        left: 87%;*/
        filter: drop-shadow(2px 6px 12px #0006);
    }
    /*#app .l-container #content .l-user-hero .profileHeader .profileHeaderInfo__content h2, */#app .l-container #content .l-user-hero .profileHeader .profileHeaderInfo__content .profileHeaderInfo__userName {
        margin-top: 0px;
        background: 0;
        font-size: 6em;
        line-height: 82px;
        letter-spacing: -.005em;
        font-weight: 700; /* 900 */
        color: #fff;
        margin-right: 30px;
        text-align: right;
    }
    #app .l-container #content .l-user-hero .profileHeader .profileHeaderInfo__content h4 {
        margin-top: -10px
    }
    #app .l-container #content .l-user-hero .profileHeader .profileHeaderInfo__content br {
        display: none;
    }
    #app .l-container #content .l-user-hero .profileHeader .profileHeaderInfo__content h2 {
        margin-top: -8px
    }
    #app .l-container #content .l-user-hero .profileHeader .profileHeaderBackground {
        min-height: 405px;
        background: #111
    }
    /*#app .l-container #content .l-user-hero .profileHeader .profileHeaderBackground .profileHeaderBackground__visual {
        background-size: cover;
        background-position: center;
        min-height: 405px;
        position: relative
    }*/
    #app .l-container #content .l-user-hero .profileHeader .profileHeaderBackground .profileHeaderBackground__visual:before {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        bottom: 0;
        /*background: linear-gradient(transparent 80%, #1112 90%, #111 100%);*/
    }
    #app .l-container #content .commentForm__wrapper {
        border: 0;
        background: #0d0d0d
    }
    #app .l-container #content .commentForm__wrapper input {
        color: #fff;
        background: #0d0d0d;
        border: 0
    }
    #app .l-container #content .l-vertical-bar {
        /*z-index: 9;*/
        position: absolute;
        top: 290px;
        width: 100%;
        padding-bottom: 40px;
    }
    #app .l-container #content .l-vertical-bar .userInfoBar {
        position: unset
    }
    #app .l-container #content .l-vertical-bar .userInfoBar .userInfoBar__buttons {
        margin-right: 340px;
        /*left: calc(100vw - 875px);*/
        /*left: 25%;*/
        /*width: 50%;*/
        height: 40px;
        bottom: 84px;
        display: flex;
        justify-content: flex-end;
        z-index: 9;
        filter: drop-shadow(2px 6px 8px #0006);
    }
    #app .l-container #content .l-vertical-bar .userInfoBar .userInfoBar__buttons .sc-button-more:before {
        background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iNCIgdmlld0JveD0iMCAwIDE0IDQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHRpdGxlPm1vcmU8L3RpdGxlPjxnIGZpbGw9IiMyMjIiIGZpbGwtcnVsZT0iZXZlbm9kZCI+PGNpcmNsZSBjeD0iMiIgY3k9IjIiIHI9IjIiLz48Y2lyY2xlIGN4PSI3IiBjeT0iMiIgcj0iMiIvPjxjaXJjbGUgY3g9IjEyIiBjeT0iMiIgcj0iMiIvPjwvZz48L3N2Zz4=)
    }
    #app .l-container #content .l-vertical-bar .userInfoBar .userInfoBar__buttons .sc-button-edit,
    #app .l-container #content .l-vertical-bar .userInfoBar .userInfoBar__buttons .sc-button-message,
    #app .l-container #content .l-vertical-bar .userInfoBar .userInfoBar__buttons .sc-button-more,
    #app .l-container #content .l-vertical-bar .userInfoBar .userInfoBar__buttons .sc-button-share {
        width: 39px;
        height: 39px;
        text-indent: 100px;
        overflow: hidden;
        background: 0 0;
        border: 0;
        filter: brightness(10);
        cursor: default
    }
    #app .l-container #content .l-vertical-bar .userInfoBar .userInfoBar__buttons .sc-button-follow,
    #app .l-container #content .l-vertical-bar .userInfoBar .userInfoBar__buttons .sc-button-startstation,
    #app .l-container #content .l-vertical-bar .userInfoBar .userInfoBar__buttons .sc-button-insights {
        border: 0;
        min-width: 130px;
        white-space: normal;
        padding: 11px 44px;
        will-change: transform;
        line-height: 1.6;
        vertical-align: middle;
        font-size: 11px;
        font-weight: 400;
        text-align: center;
        height: auto;
        margin: 0 15px 0 0;
        text-transform: uppercase;
        letter-spacing: .16em;
        cursor: default
    }
    #app .l-container #content .l-vertical-bar .userInfoBar .userInfoBar__buttons .sc-button-edit:before,
    #app .l-container #content .l-vertical-bar .userInfoBar .userInfoBar__buttons .sc-button-message:before,
    #app .l-container #content .l-vertical-bar .userInfoBar .userInfoBar__buttons .sc-button-more:before,
    #app .l-container #content .l-vertical-bar .userInfoBar .userInfoBar__buttons .sc-button-share:before {
        background-size: contain
    }
    #app .l-container #content .l-vertical-bar .userInfoBar .userInfoBar__buttons .sc-button-follow {
        background: rgba(24, 24, 24, .7);
        color: #fff;
        /*box-shadow: inset 0 0 0 2px #b3b3b3*/
    }
    #app .l-container #content .l-vertical-bar .userInfoBar .userInfoBar__buttons .sc-button-follow.sc-button-selected {
        color: #f50
    }
    #app .l-container #content .l-vertical-bar .userInfoBar .userInfoBar__buttons .sc-button-startstation,
    #app .l-container #content .l-vertical-bar .userInfoBar .userInfoBar__buttons .sc-button-insights {
        background: #f50;
        background: linear-gradient(#f60,#f40);
        box-shadow: inset 0px 0px 0px #c200;
        filter: brightness(1) contrast(1) hue-rotate(/*[[hue]]*/deg);
        transition-duration: 0.7s;
        border-radius: 500px;
        color: #fff;
    }
    #app .l-container #content .l-vertical-bar .userInfoBar .userInfoBar__buttons .sc-button-startstation:hover,
    #app .l-container #content .l-vertical-bar .userInfoBar .userInfoBar__buttons .sc-button-insights:hover {
        background: #ff3d00;
        background: linear-gradient(#f60,#f40);
        box-shadow: inset -2px -8px 16px #c20c;
        filter: brightness(0.9) contrast(1.3) hue-rotate(/*[[hue]]*/deg) hue-rotate(-2deg);
        transition-duration: 0.2s;
    }
    #app .l-container #content .l-vertical-bar .userInfoBar .userInfoBar__buttons .sc-button-startstation:before,
    #app .l-container #content .l-vertical-bar .userInfoBar .userInfoBar__buttons .sc-button-insights:before {
        left: 36px;
        background-position: center;
        background-size: 16px 12px;
        filter: brightness(10)
    }
    #app .l-container #content .l-vertical-bar .userInfoBar .profileTabs.g-tabs.g-tabs-medium {
        display: flex;
        justify-content: space-evenly;
        align-items: center;
        border: 0;
        padding-right: calc(109vw - 100%);
        padding-left: 10px;
        margin-top: -80px;
        flex-flow: wrap;
    }
    #app .l-container #content .l-vertical-bar .userInfoBar .profileTabs.g-tabs.g-tabs-medium .g-tabs-link {
        font-size: 12px;
        line-height: 16px;
        font-weight: var(--glue-font-weight-bold);
        font-weight: 330;
        text-transform: uppercase;
        letter-spacing: .16em;
        color: #fff!important;
        opacity: .6;
        position: relative;
        border: 0;
        display: inline-block;
        margin: 10px;
        padding: 5px 10px;
        text-decoration: none;
        -webkit-transition: opacity .2s linear;
        transition: opacity .2s linear
    }
    #app .l-container #content .l-vertical-bar .userInfoBar .profileTabs.g-tabs.g-tabs-medium .g-tabs-link.active,
    #app .l-container #content .l-vertical-bar .userInfoBar .profileTabs.g-tabs.g-tabs-medium .g-tabs-link:hover {
        opacity: 1;
        font-weight: 600; /* alongside navfix */
        padding: 6px 4.7%!important;
    }
    #app .l-container #content .l-vertical-bar .userInfoBar .profileTabs.g-tabs.g-tabs-medium .g-tabs-link.active:before {
        content: "";
        height: 2px;
        background: #f50;
        width: 30px;
        position: absolute;
        display: block;
        left: 50%;
        bottom: 0;
        margin-left: -15px
    }
    #app .l-container #content .sound__soundActions {
        background: 0 0;
        overflow: unset
    }
    #app .l-container #content .sc-background-light {
        background: 0 0;
        border: 0
    }
    #app .l-container #content a:not(.sc-button-startstation),
    #app .l-container #content h1,
    #app .l-container #content h2,
    #app .l-container #content h3 {
        color: #fff
    }
    #app .l-container #content .compactTrackListItem__trackTitle,
    #app .l-container #content p {
        color: #b3b3b3
    }
    #app .l-container #content .l-inner-fullwidth {
        margin-left: 0;
        margin-right: 0
    }
    #app .l-container #content .selectionModule__description {
        color: #fff;
        opacity: .6;
        font-weight: 200
    }

    /*follow button*/
    #app .l-container #content .userBadge__actions .sc-button:not(.sc-button-selected), .sc-button-follow:not(.sc-button-cta):not(.sc-button-selected):not(.playbackSoundBadge__follow):not(.playableTile__actionButton) {
        border: 0;
        border-radius: 120px;
        background: #f50 !important;
        color: #fff !important;
        padding: 0 15px;
        transition-duration: 0.25s;
    }
    #app .l-container #content .userBadge__actions .sc-button:not(.sc-button-selected):hover, .sc-button-follow:not(.sc-button-cta):not(.sc-button-selected):not(.playbackSoundBadge__follow):not(.playableTile__actionButton):not(.m-boldIcon):hover {
        background: #f30 !important;
        filter: drop-shadow(2px 2px 6px #000) hue-rotate(/*[[hue]]*/deg);
        transition-duration: 0.25s;
    }

    #app .l-container #content .systemPlaylistDetails {
        padding: 0 0 0 15px
    }
    #app .l-container #content .l-sidebar-right {
        right: 15px
    }
    #app .l-container #content .sc-border-light {
        border: 0
    }
    #app .l-container #content .sc-border-light .compactTrackListItem.clickToPlay:hover {
        background: rgba(0, 0, 0, .2)
    }
    #app .l-container #content .sc-border-light .compactTrackListItem.clickToPlay:hover .compactTrackListItem__additional {
        background: 0
    }
    #app .l-container #content .soundBadge__additional {
        background: linear-gradient(to right, transparent, #111 17px);
        top: 0
    }
    #app .l-container #content .soundBadge__additional .sc-button {
        background: 0 0;
        border: 0
    }
    #app .l-container #content .soundBadge__additional .sc-button-small.sc-button-more:before {
        filter: brightness(3)
    }
    #app .l-container #content .soundBadge__additional .sc-button-small.sc-button-active.sc-button-more:before {
        background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iNCIgdmlld0JveD0iMCAwIDE0IDQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHRpdGxlPm1vcmU8L3RpdGxlPjxnIGZpbGw9IiMyMjIiIGZpbGwtcnVsZT0iZXZlbm9kZCI+PGNpcmNsZSBjeD0iMiIgY3k9IjIiIHI9IjIiLz48Y2lyY2xlIGN4PSI3IiBjeT0iMiIgcj0iMiIvPjxjaXJjbGUgY3g9IjEyIiBjeT0iMiIgcj0iMiIvPjwvZz48L3N2Zz4=)
    }
    #app .l-container #content .soundTitle__usernameTitleContainer {
        display: flex;
        flex-direction: column-reverse;
        align-items: flex-start
    }
    .l-search .l-fixed-top,
    .searchOptions__footer {
        display: none
    }
    #app .l-container #content .soundTitle__usernameTitleContainer .soundTitle__title {
        font-size: 14px;
        line-height: 16px;
        /*letter-spacing: .015em;*/
        color: #eee;
        transition-duration: 0.2s!important;
        transition-property: color, font-weight, filter, opacity;
    }
    .searchOptions__container {
        width: 220px
    }
    .search__listWrapper {
        padding-right: 15px
    }
    .l-search .l-main {
        margin: 0 0 0 15px;
        padding-top: 0
    }
    .compactTrackList__moreLink:focus,
    .compactTrackList__moreLink:hover {
        background: #0d0d0d
    }
    .sound__trackList {
        margin-top: 0;
        border-radius: 5px
    }
    .g-dark input[type=search] {
        padding-right: 28px;
        box-shadow: 2px 2px 24px #0003;
        transition-duration: 3s
    }
    .g-dark input[type=search]:focus, 
    .sc-classic .frontContent__actions input[type=search]:focus {
        box-shadow: 2px 2px 12px 2px #0a0a0a;
        z-index: 99999;
        background: #0a0a0a;
        transition-duration: 0.25s!important
    }
    .g-dark input[type=search]:hover {
        box-shadow: 2px 2px 16px #0009;
        z-index: 99999;
        transition-duration: 1s!important
    }
    #app .l-container #content .soundTitle__usernameTitleContainer .soundTitle__title:hover {
        text-decoration: none;
        color: #fff!important;
        filter: drop-shadow(0px 0px 6px #fff8);
        transition-duration: 0.12s!important;
    }
    #app .l-container #content .soundTitle__usernameTitleContainer .soundTitle__username {
        font-size: 12px;
        line-height: 20px;
        /*letter-spacing: .015em;*/
        color: #b3b3b3;
        width: auto;
        flex: 0;
        transition-duration: 0.2s;
    }
    #app .l-container #content .soundTitle__usernameTitleContainer .soundTitle__username:hover {
        text-decoration: none;
        color: #fff!important;
        transition-duration: 0.1s;
    }
    #app .l-container #content .playableTile__playButton {
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, .6)
    }
    #app .l-container #content .playableTile__playButton .playButton {
        border: 4px solid #fff;
        transform: scale(.5);
        background: 0 0
    }
    .playControls__inner {
        height: 90px;
        position: relative
    }
    .playControls__inner .playControls__wrapper {
        margin: 0;
        min-width: 100%
    }
    .playControls__inner .playControls__wrapper .playControls__elements {
        position: unset
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__soundBadge {
        position: absolute;
        padding: 0 0 0 16px;
        height: 90px;
        box-sizing: border-box
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__soundBadge .playbackSoundBadge__avatar {
        height: 55px;
        min-width: 55px;
        margin: 0;
        box-shadow: 0 0 10px rgba(0, 0, 0, .3)
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__soundBadge .playbackSoundBadge__avatar .sc-artwork {
        margin: 0;
        width: 100%!important;
        height: 100%!important
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__soundBadge .playbackSoundBadge__titleContextContainer {
        display: flex;
        margin: 0 16px;
        flex: 0;
        flex-direction: column-reverse;
        align-items: flex-start;
        width: auto;
        max-width: 270px
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__soundBadge .playbackSoundBadge__titleContextContainer .playbackSoundBadge__lightLink {
        font-size: 12px;
        line-height: 16px;
        /*letter-spacing: .015em;*/
        color: #b3b3b3;
        width: auto;
        flex: 0;
        /* background: #0a0a0a; */
        padding: 5px;
        background-color: #0006;
        /* backdrop-filter: blur(6px); */
        border-radius: 8px;
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__soundBadge .playbackSoundBadge__titleContextContainer .playbackSoundBadge__lightLink:hover {
        text-decoration: underline;
        color: #fff
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__soundBadge .playbackSoundBadge__titleContextContainer .playbackSoundBadge__title {
        margin-bottom: unset;
        width: auto;
        max-width: 100%;
        flex: 0
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__soundBadge .playbackSoundBadge__titleContextContainer .playbackSoundBadge__title a {
        font-size: 14px;
        line-height: 20px;
        /*letter-spacing: .015em;*/
        color: #fff;
        /* background: #0a0a0a; */
        padding: 5px;
        margin-bottom: 3px;
        background-color: #0006;
        /* backdrop-filter: blur(6px); */
        border-radius: 8px;
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__soundBadge .playbackSoundBadge__titleContextContainer .playbackSoundBadge__title a:hover {
        text-decoration: underline
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__soundBadge .playbackSoundBadge__actions {
        position: relative;
        background: #0006;
        border-radius: 5px;
        top: -2px
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControl {
        background: 0 0;
        border: 0;
        color: #b3b3b3;
        width: 32px;
        min-width: 32px;
        height: 32px;
        position: relative
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__control,
    .playControls__inner .playControls__wrapper .playControls__elements .sc-ir {
        cursor: default;
        position: absolute;
        margin: 0;
        width: 32px;
        height: 32px;
        background-image: unset;
        color: #b3b3b3
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__control:hover,
    .playControls__inner .playControls__wrapper .playControls__elements .sc-ir:hover {
        color: #fff
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__control:before,
    .playControls__inner .playControls__wrapper .playControls__elements .sc-ir:before {
        position: relative;
        top: 16px;
        left: 1px;
        width: 32px;
        height: 32px;
        font-size: 16px;
        font-family: glue1-spoticon;
        font-style: normal;
        font-weight: 400;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        line-height: inherit;
        vertical-align: bottom;
        display: inline-block;
        text-decoration: inherit
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__control.playControls__play.playing:before,
    .playControls__inner .playControls__wrapper .playControls__elements .sc-ir.playControls__play.playing:before {
        content: "\f130"
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__control.playControls__play:hover,
    .playControls__inner .playControls__wrapper .playControls__elements .sc-ir.playControls__play:hover {
        transform: scale(1.08)
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__control.playControls__play:hover:after,
    .playControls__inner .playControls__wrapper .playControls__elements .sc-ir.playControls__play:hover:after {
        border: 1px solid #fff
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__control.playControls__play:after,
    .playControls__inner .playControls__wrapper .playControls__elements .sc-ir.playControls__play:after {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        border-radius: 500px;
        border: 1px solid rgba(255, 255, 255, .6)
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__control.playControls__play:before,
    .playControls__inner .playControls__wrapper .playControls__elements .sc-ir.playControls__play:before {
        left: 0;
        content: "\f132"
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__control.playControls__shuffle,
    .playControls__inner .playControls__wrapper .playControls__elements .sc-ir.playControls__shuffle {
        top: 15px;
        left: 41.71%
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__control.playControls__prev,
    .playControls__inner .playControls__wrapper .playControls__elements .sc-ir.playControls__prev {
        top: 15px;
        left: 45.3%;
        transform: scale(1.5)!important
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__control.playControls__play,
    .playControls__inner .playControls__wrapper .playControls__elements .sc-ir.playControls__play {
        top: 15px;
        left: 49.2%;
        transform: scale(1.5)!important
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__control.playControls__prev:before,
    .playControls__inner .playControls__wrapper .playControls__elements .sc-ir.playControls__prev:before {
        content: "\f146"
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__control.playControls__next,
    .playControls__inner .playControls__wrapper .playControls__elements .sc-ir.playControls__next {
        top: 15px;
        left: 52.8%;
        transform: scale(1.5)!important
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__control.playControls__next:before,
    .playControls__inner .playControls__wrapper .playControls__elements .sc-ir.playControls__next:before {
        content: "\f148"
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__control.playControls__repeat,
    .playControls__inner .playControls__wrapper .playControls__elements .sc-ir.playControls__repeat {
        top: 15px;
        left: 56%
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__control.playControls__repeat .repeatControl:before,
    .playControls__inner .playControls__wrapper .playControls__elements .sc-ir.playControls__repeat .repeatControl:before {
        background-image: none;
        content: "\f13e";
        opacity: 1
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__control.playControls__repeat .repeatControl:after,
    .playControls__inner .playControls__wrapper .playControls__elements .sc-ir.playControls__repeat .repeatControl:after {
        background-image: none;
        cursor: default
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__control.playControls__repeat .repeatControl.m-one:before,
    .playControls__inner .playControls__wrapper .playControls__elements .sc-ir.playControls__repeat .repeatControl.m-one:before {
        content: "\f200"
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__control.playControls__repeat .repeatControl.m-all:before,
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__control.playControls__repeat .repeatControl.m-one:before,
    .playControls__inner .playControls__wrapper .playControls__elements .sc-ir.playControls__repeat .repeatControl.m-all:before,
    .playControls__inner .playControls__wrapper .playControls__elements .sc-ir.playControls__repeat .repeatControl.m-one:before {
        cursor: default;
        color: #f50!important;
        opacity: 1
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__control.playControls__repeat .repeatControl.m-all:after,
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__control.playControls__repeat .repeatControl.m-one:after,
    .playControls__inner .playControls__wrapper .playControls__elements .sc-ir.playControls__repeat .repeatControl.m-all:after,
    .playControls__inner .playControls__wrapper .playControls__elements .sc-ir.playControls__repeat .repeatControl.m-one:after {
        background: #f50!important;
        opacity: 1;
        border-radius: 50px;
        width: 4px;
        height: 4px;
        top: 28px;
        left: 14px
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__control.playControls__shuffle .shuffleControl:before,
    .playControls__inner .playControls__wrapper .playControls__elements .sc-ir.playControls__shuffle .shuffleControl:before {
        background-image: none;
        content: "\f144"
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__control.playControls__shuffle .shuffleControl:after,
    .playControls__inner .playControls__wrapper .playControls__elements .sc-ir.playControls__shuffle .shuffleControl:after {
        background-image: none
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__control.playControls__shuffle .shuffleControl.m-shuffling:before,
    .playControls__inner .playControls__wrapper .playControls__elements .sc-ir.playControls__shuffle .shuffleControl.m-shuffling:before {
        color: #f50!important;
        opacity: 1
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__control.playControls__shuffle .shuffleControl.m-shuffling:after,
    .playControls__inner .playControls__wrapper .playControls__elements .sc-ir.playControls__shuffle .shuffleControl.m-shuffling:after {
        background: #1db954!important;
        border-radius: 50px;
        width: 4px;
        height: 4px;
        top: 28px;
        left: 14px
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__control.volume__button,
    .playControls__inner .playControls__wrapper .playControls__elements .sc-ir.volume__button {
        top: 15px;
        transform: scale(1.5)
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__control.volume__button:before,
    .playControls__inner .playControls__wrapper .playControls__elements .sc-ir.volume__button:before {
        top: 14px;
        left: -5px;
        background-image: none;
        content: "\f15e"
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__timeline {
        position: absolute;
        width: 50%;
        top: 45px;
        left: 25%
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__timeline .playbackTimeline__duration,
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__timeline .playbackTimeline__timePassed {
        color: #b3b3b3
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__timeline .playbackTimeline__progressWrapper {
        top: -1px;
        cursor: default
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__timeline .playbackTimeline__progressWrapper:hover .playbackTimeline__progressBar {
        background: #f50
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__timeline .playbackTimeline__progressWrapper .playbackTimeline__progressHandle {
        background: #c84200;
        box-shadow: 2px 2px 2px #0d0d0d;
        position: relative;
        top: -4px;
        transform: translateX(-6px);
        height: 12px;
        width: 12px
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__timeline .playbackTimeline__progressWrapper .playbackTimeline__progressBackground {
        background: #404040
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__timeline .playbackTimeline__progressWrapper .playbackTimeline__progressBar {
        background: #b3b3b3
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__timeline .playbackTimeline__progressWrapper .playbackTimeline__progressBackground,
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__timeline .playbackTimeline__progressWrapper .playbackTimeline__progressBar {
        height: 4px;
        border-radius: 5px
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__volume {
        position: absolute;
        top: 15px;
        right: 40px
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__volume .volume__sliderWrapper {
        width: 40px;
        border: 0;
        transform-origin: center bottom;
        bottom: -5px;
        left: -5px;
        background: #000000cc;
        border-radius: 5px;
        box-shadow: 0 0 5px #0d0d0d
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__volume .volume__sliderWrapper:hover .volume__sliderProgress {
        background: #f50!important
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__volume .volume__sliderWrapper:hover .volume__sliderHandle {
        opacity: 1
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__volume .volume__sliderWrapper:after,
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__volume .volume__sliderWrapper:before {
        border: 0
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__volume .volume__sliderWrapper .volume__sliderBackground,
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__volume .volume__sliderWrapper .volume__sliderProgress {
        width: 4px;
        left: 5px;
        border-radius: 0
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__volume .volume__sliderWrapper .volume__sliderProgress {
        background: #f50
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__volume .volume__sliderWrapper .volume__sliderBackground {
        background: #1d1d1d
    }
    .playControls__inner .playControls__wrapper .playControls__elements .playControls__volume .volume__sliderWrapper .volume__sliderHandle {
        width: 10px;
        border-radius: 0;
        height: 4px;
        left: 5px;
        background: #fff;
        opacity: 0
    }
    .sc-browsers-enable-gpu,
    .userNetworkInfo .userNetworkTabs {
        width: 100%
    }
    .playControls__bg,
    .playControls__inner {
        width: 100%;
        border: 0;
        background: #1119;
        border-top: 1px solid #222c;
        box-shadow: 0 0 5px #111;
    }
    input,
    select,
    textarea {
        background: #111;
        border-color: #333
    }
    .g-dark input[type=password],
    .g-dark input[type=search],
    .g-dark input[type=text],
    .g-dark select,
    .g-dark textarea,
    .sc-classic .frontContent__actions input[type=search]{
        color: #999;
        background: #1a1a1a;
        transition: 3s
    }
    .collectionSection__filters {
        position: absolute;
        right: 120px
    }
    .sc-input {
        display: inline-block;
        font-family: /*[[font]]*/, Interstate, "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Garuda, Verdana, Tahoma, sans-serif;
        font-weight: 400;
        font-size: 14px;
        line-height: 20px;
        padding: 2px 7px;
        border-radius: 4px;
        border: 1px solid #222;
        transition: border-color .1s
    }
    .sc-button-active:not(.sc-button-nostyle):not(:hover):not(.sc-button-transparent):not(.sc-button-like):not(.sc-button-repost):not(.sc-button-more):not(.addToPlaylistButton):not(.sc-button-queue):not(.imageEditDropdownButton):not(.sc-button-dropdown):not(.sc-button-queue):not(.createPlaylistSuggestion__add):not(.hintButton),
    .sc-button-selected:not(.sc-button-nostyle):not(.playbackSoundBadge__like):not(:hover):not(.sc-button-transparent):not(.sc-button-like):not(.sc-button-repost):not(.addToPlaylistButton):not(.playbackSoundBadge__follow):not(.sc-button-queue):not(.createPlaylistSuggestion__add):not(.hintButton):not(.sc-button-dropdown) {
        border-color: #1a1a1a;
        /*background: #111;*/
        border: 0;
        border-radius: 120px;
        background: #f50 !important;
        box-shadow: inset -1px -2px 8px #f40c;
        color: #fff !important;
        padding: 0 15px;
        transition-duration: 0.5s;
        filter: hue-rotate(/*[[hue]]*/deg);
    }
    .sc-button-active:not(.sc-button-nostyle):not(:hover):not(.sc-button-transparent):not(.sc-button-like):not(.sc-button-repost):not(.sc-button-more):not(.addToPlaylistButton):not(.sc-button-queue):not(.imageEditDropdownButton):not(.sc-button-dropdown):not(.sc-button-queue):not(.createPlaylistSuggestion__add):not(.hintButton),
    .sc-button-selected:not(.sc-button-nostyle):not(.playbackSoundBadge__like):not(.sc-button-transparent):not(.sc-button-like):not(.sc-button-repost):not(.addToPlaylistButton):not(.playbackSoundBadge__follow):not(.sc-button-queue):not(.createPlaylistSuggestion__add):not(.hintButton):not(.sc-button-dropdown) {
        border-color: #fff;
        /*background: #111*/
        border: 0;
        border-radius: 120px;
        /* background: #f30 !important; */
        /* box-shadow: inset -2px -5px 12px #c20; */
        background: #f50 !important;
        box-shadow: inset -1px -2px 8px #f40c;
        color: #fff !important;
        padding: 0 15px;
        transition-duration: 0.2s;
        filter: hue-rotate(/*[[hue]]*/deg);
    }
    .sc-button-selected:not(.sc-button-like):not(.sc-button-repost):not(.playbackSoundBadge__follow):not(.sc-button-queue):not(.m-boldIcon):before {
        background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNCIgaGVpZ2h0PSIxNCIgdmlld0JveD0iMCAwIDE0IDE0Ij4KICA8cGF0aCBmaWxsPSJyZ2IoMjU1LCAyNTUsIDI1NSkiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZD0iTTUuNTQyIDEuMTY3YzIuMTA3IDAgMi43OTUgMi4yNDYgMS42MSA1LjMzMi0uNDQ0Ljc5My4wMyAxLjIxMS4zMjIgMS4zMzIgMi4wMjYuODM2IDIuODc1IDIuMjEzIDMuMDI2IDMuODM2di41ODNILjU4M3YtLjU4M2MuMTUxLTEuNjIzIDEtMyAzLjAyNi0zLjgzNi4yOTItLjEyLjc2Ni0uNTQuMzIyLTEuMzMxLTEuMTg0LTMuMDk1LS40OTctNS4zMzMgMS42MS01LjMzM3pNMTMuNDcgMy4xOGwuMDU4LjA1LjIzLjIyOGEuNDE1LjQxNSAwIDAgMSAuMDU3LjUyNmwtLjA1My4wNjUtMi43MTQgMi43MTRhLjQwOS40MDkgMCAwIDEtLjUuMDY2bC0uMDQ1LS4wMy0uMDQzLS4wMzgtMS40NzItMS40NzJhLjQyMi40MjIgMCAwIDEtLjA1MS0uNTI3bC4wNTQtLjA2Ni4yMjktLjIzYS40MTUuNDE1IDAgMCAxIC41MjgtLjA1NWwuMDY1LjA1My45NDIuOTQzIDIuMTgyLTIuMTgzYS40MS40MSAwIDAgMSAuNTMzLS4wNDR6Ii8+Cjwvc3ZnPgo=) !important;
    }
    .sc-button-selected:not(.sc-button-like):not(.sc-button-repost):not(.playbackSoundBadge__follow):not(.sc-button-queue):before {
        filter: invert(0)!important
    }
    .chartsMain_listHeader, .sc-classic .chartsMain_listHeader,
    .collection.m-overview .collection__section:not(:last-child), .sc-classic .collection.m-overview .collection__section:not(:last-child),
    .g-form-section-head, .sc-classic .g-form-section-head,
    .g-modal-title-h1, .sc-classic .g-modal-title-h1,
    .g-tabs, .sc-classic .g-tabs,
    .mixedSelectionModule, .sc-classic .mixedSelectionModule,
    .sc-border-dark-bottom, .sc-classic .sc-border-dark-bottom,
    .sc-border-light-bottom, .sc-classic .sc-border-light-bottom,
    .searchTitle__text, .sc-classic .searchTitle__text,
    .selectionModule, .sc-classic .selectionModule,
    .statsOverview__main:before, .sc-classic .statsOverview__main:before,
    .statsOverview__top:before, .sc-classic .statsOverview__top:before {
        border-bottom-color: #181818
    }
    .collection.m-overview .collection__section:not(:last-child) {
        margin-bottom: 10px
    }
    .collection__oneRowSection {
        min-height: unset
    }
    .mixedSelectionModule, .sc-classic .mixedSelectionModule {
        margin-bottom: 20px
    }
    .selectionPlaylistBanner {
        height: 415px
    }
    .selectionPlaylistBanner {
        background: linear-gradient(to right, #1d0101, #200122)
    }
    .queue__scrollableInner.g-scrollable-inner {
        background: 0 0
    }
    .l-fluid-fixed .l-main, .sc-classic .l-fluid-fixed .l-main {
        padding: 15px 15px 0 0
    }
    .l-fluid-fixed .l-sidebar-right {
        /*top: 15px*/
        top: 0;
    }
    .g-tabs-link:focus,
    .g-tabs-link:hover {
        border-color: #f50
    }
    .paging-eof:before, .sc-classic .paging-eof:before {
        display: none
    }
    .trackItem:active,
    .trackItem:hover {
        background: #000
    }
    .trackItem:not(.m-disabled).active .trackItem__additional,
    .trackItem:not(.m-disabled).hover .trackItem__additional {
        background: 0 0;
        right: 12px
    }
    .playbackSoundBadge .playbackSoundBadge__like {
        background: #131313
    }
    .playControls .g-z-index-control-bar .m-visible,
    .playControls.m-visible .playControls__inner {
        z-index: 9999
    }
    .l-sidebar-right:first-child[style] {
        top: 15px!important
    }
    .l-footer.standard {
        padding: 0;
        font-size: 10px;
        z-index: 1;
        top: -15px
    }
    .playControls {
        z-index: 9999
    }
    .dialog {
        z-index: 9999999;
        background: #111;
        box-shadow: 0 0 15px #000
    }
    a.sc-link-dark,
    a.sc-link-medium {
        color: #eee
    }
    a.sc-link-dark:hover,
    a.sc-link-medium:hover {
        color: #fff
    }
    .soundList__item {
        margin-bottom: 12px
    }
    .sound.streamContext .commentForm.visible.m-small {
        margin-top: 20px
    }
    .sc-tag,
    .sc-tag:visited {
        color: #ccc!important;
        background: #2d2d2d;
        box-shadow: inset 0 0 2px #000;
        border: none
    }
    .queueItemView.m-active,
    .queueItemView:hover a.sc-link-light:hover,
    .queue__title,
    .sc-ministats {
        color: #fff
    }
    .queueFallback__stationMode,
    .queue__panel {
        border-color: #333
    }
    .sc-tag:hover {
        background: #222
    }
    .backgroundGradient__buffer[style] {
        /*background: #200122!important;
        background: -webkit-linear-gradient(to right, #1d0101, #200122)!important;
        background: linear-gradient(to right, #1d0101, #200122)!important*/
        filter: saturate(2) contrast(0.75) brightness(0.5);
    }
    .commentItem.m-creatorComment {
        background: #151515
    }
    /* brighten buttons */
    .sc-button-medium.sc-button-more:before,
    .sc-button-medium.sc-button-repost:before,
    .sc-button-medium.sc-button-share:before,
    .sc-button-queue:before,
    .sc-button-small.sc-button-cta.sc-button-follow:before,
    .sc-ministats-small.sc-ministats-sounds:before,
    .sc-button-medium.sc-button-mastering:before,
    .sc-button-small.sc-button-download:before,
    .sc-button-small.sc-button-upload:before,
    .sc-button-medium.sc-button-delete:before,
    .sc-button-medium.sc-button-download:before,
    .sc-button-medium.sc-button-copylink:before {
        filter: brightness(7.5)
    }
    /*.gritter-close,*/
    .queueItemView__more.sc-button-small.sc-button-more,
    .queueItemView__remove.sc-button-small.sc-button-icon:not(.sc-button-stretch-icon),
    .queue__hide,
    .queue__hide:focus,
    .queue__hide:hover,
    .quotaMeter__dropdownButton:after,
    .sc-button-medium.sc-button-camera:before,
    .sc-button-medium.sc-button-edit:before,
    .sc-button-medium.sc-button-message:before,
    .sc-button-medium.sc-button-startstation:before,
    .sc-button-small.sc-button-follow:before {
        filter: invert(1)
    }
    .playControls__queue {
        bottom: 100px;
        right: unset;
        left: 240px
    }
    .queue__fallback.queue__itemWrapper {
        height: 70px;
        padding-top: 67px
    }
    .queue__itemsHeight {
        background: 0 0
    }
    .queueItemView,
    .queue__fallback.queue__itemWrapper {
        background: #151515f3
    }
    .queue__panel {
        background: #151515
    }
    .queueItemView.m-active,
    .queueItemView:hover {
        background: #0d0d0d;
        box-shadow: 0 0 5px #111
    }
    .g-z-index-header-menu {
        z-index: 11000
    }
    a.playableTile__heading,
    a.playableTile__heading:hover,
    .sc-classic .playableTile__mainHeading 
    .sc-classic .playableTile__mainHeading:hover {
        font-size: 14px
    }
    .linkMenu, .sc-classic .linkMenu {
        box-shadow: 0 1px 8px #0d0d0d;
        background: #111;
        border: 1px solid #3338;
        border-radius: 4px;
    }
    .sc-button-dropdown:focus:not(.sc-button-disabled):not(:disabled) {
        box-shadow: 0 0 2px 1px #ccc6;
    }
    .modal.modalWhiteout, .sc-classic .modal.modalWhiteout {
        background: hsla(0, 0%, 0%, .9)
    }
    .g-modal-section, .sc-classic .g-modal-section,
    .tabs__headingContainer, .tabs__tabs, .sc-classic .tabs__headingContainer, .sc-classic .tabs__tabs {
        background: #0d0d0d
    }
    .embedPanel__tabLink,
    .embedPanel__upsellTabLink {
        background: inherit
    }
    .composeMessage__bottomWrapper {
        border: 0
    }
    .userNetwork {
        margin: 40px 15px 15px
    }
    .l-fixed-top-one-column > .l-top {
        background: #111;
        top: 0;
        width: calc(100% - 235px)
    }
    .l-one-column > .l-main {
        padding: 30px 15px 15px
    }
    .stationHeader {
        height: 560px
    }
    .coverFlow__item {
        margin-top: 30px
    }
    .stationHeader__tracks {
        bottom: 360px
    }
    .stationCoverFlow.g-box-full .playableTile {
        width: unset
    }
    .compactTrackListItem.clickToPlay.active,
    .compactTrackListItem.clickToPlay:focus,
    .compactTrackListItem.clickToPlay:hover {
        background: #0d0d0d;
        color: #999
    }
    .compactTrackListItem.clickToPlay.active .compactTrackListItem__additional,
    .compactTrackListItem.clickToPlay:focus .compactTrackListItem__additional,
    .compactTrackListItem.clickToPlay:hover .compactTrackListItem__additional {
        background: 0
    }
    .profileUploadFooter {
        background: inherit;
        padding-bottom: 100px
    }
    .inboxItem.active,
    .inboxItem.unread,
    .inboxItem:focus,
    .inboxItem:hover,
    .inbox__item:before,
    .modal__modal/*:not(#overlay_634 .modal__modal)*/,
    .sc-button-disabled,
    .sc-button-disabled:focus,
    .sc-button-disabled:hover,
    .sc-button.sc-pending,
    .sc-button.sc-pending:focus,
    .sc-button.sc-pending:hover,
    .sc-button:disabled,
    .sc-button:disabled:hover {
        background: #0d0d0d
    }
    .suggestedUserList__item {
        width: 10%
    }
    .conversation__actions, .sc-classic .conversation__actions {
        width: calc(100% - 245px);
        height: 55px;
        background: #111;
        padding-top: 15px;
        padding-left: 0;
        margin-left: 0;
        box-shadow: none;
    }
    .conversationActions__userActions {
        margin-left: 15px
    }
    .l-messages-left {
        width: 220px;
        top: 410px;
        left: 10px;
        bottom: 95px;
        z-index: 1000
    }
    .l-messages-main {
        padding: 0 15px
    }
    .conversationParticipant {
        font-size: 32px;
        color: #fff
    }
    .conversation__messages {
        padding-right: 15px
    }
    .ownActivity.large .ownActivity__user {
        width: 100%;
        border: none
    }
    .ownActivity.large .ownActivity__action,
    .ownActivity.large .ownActivity__additional {
        right: 120px
    }
    .readMoreTile__countWrapper {
        background: #111
    }
    .localeSelectorContent {
        background: #0d0d0d
    }
    .fullHero {
        background: linear-gradient(to right, #1d0101, #200122)!important
    }
    .queue {
        background: 0 0;
        box-shadow: 0 0 15px #0a0a0a
    }
    .sc-button .collectionSection__action {
        position: absolute;
        right: 100px
    }
    .trackItem.active,
    .trackItem.hover {
        background: #0d0d0d
    }
    .gritter-item-wrapper {
        background: #222;
        color: #fff;
        border: none;
        box-shadow: 0 0 5px #000
    }
    .queueItemView:hover.m-active,
    .uploadMain__chooserContainer,
    .uploadMain__foot {
        background: #131313;
        border: 1px solid #1d1d1d!important
    }
    /* .removeFromNextUp {
        filter: invert(1) brightness(2.2)
    }
    .removeFromNextUp:hover {
        filter: none
    } */
    .sc-button-medium.sc-button-like:before/*,
    .sc-toggle:not(.toggleFormControl__toggle),
    .sc-toggle:not(.toggleFormControl__toggle):before*/ {
        filter: invert(1)
    }
    /*.queueFallback__toggle .sc-toggle, .queueFallback__toggle .sc-toggle:before {
        filter: none;
    }*/
    .searchOptions__scrollable {
        width: 220px!important;
        height: 465px!important
    }
    .header__left {
        position: absolute;
        top: 160px;
        width: 100%
    }
    .header__middle {
        position: absolute;
        top: 340px;
        width: 98%
    }
    .header__right {
        position: absolute;
        top: 65px;
        width: 90%
    }
    .header__logo {
        position: absolute;
        top: -150px;
        width: 100%
    }
    .header__soundInput {
        position: absolute;
        top: 45px;
        left: 95px;
        z-index: 2
    }
    .sc-background-white {
        background: #111
    }
    .accountConnectionControl__displayName,
    .accountEmailsControl__list,
    .accountSettings__accountInfo,
    .accountSocialItem__name,
    .sc-select,
    .settingsMain,
    .settingsMain input,
    .uploadMain__hqNote {
        color: #ccc
    }
    .notificationsPreferences__table .sc-border-light-bottom {
        border-bottom: 1px solid #ccc
    }
    .statsOverview {
        margin: 15px
    }
    .sc-button-selected.sc-button-medium.sc-button-like:before {
        filter: none
    }
    .image__whiteOutline .image__full {
        border: none;
        box-shadow: 0 0 10px rgba(0, 0, 0, .3)
    }
    .inbox__listWrapper {
        top: 100px;
        bottom: 0
    }
    .inbox .send-message-button {
        margin-top: 15px
    }
    .header__goUpsell,
    .header__proUpsell {
        z-index: 501;
        font-size: 10px;
        color: #777!important;
        position: absolute;
        top: 35px;
        left: -2px;
        padding: 0 10px
    }
    .emptyNetworkPage.emptyReposts .emptyNetworkPage__image {
        filter: invert(1)
    }
    .sc-button-active.sc-button-queue:before,
    .sc-button-selected.sc-button-medium.sc-button-repost:before,
    .sc-button-selected.sc-button-queue:before {
        filter: brightness(1)
    }
    .sc-button-small.sc-button-active.sc-button-more:before,
    .sc-button-small.sc-button-selected.sc-button-more:before {
        filter: invert(0)!important
    }
    .sc-button-small.sc-button-icon:not(.sc-button-stretch-icon),
    .sc-button-small.sc-button-responsive:not(.sc-button-stretch-icon) {
        background: initial
    }
    .playableTile__actions {
        z-index: 100
    }
    .sc-button-medium.sc-button-addtoset:before {
        filter: brightness(10)
    }
    .tileGallery {
        margin: 0 auto;
        width: 90%
    }
    .tileGallery .playableTile {
        width: 150px
    }
    .queue__itemWrapper {
        background: #fff0
    }
    .featuredProfiles {
        background: #0000
    }
    .dropdownMenu.g-z-index-overlay {
        z-index: 9999
    }
    .soundTitle__title.sc-font.g-type-shrinkwrap-inline.g-type-shrinkwrap-large-primary span {
        font-size: 20px
    }
    #app .l-container #content .soundTitle__usernameTitleContainer .soundTitle__username.g-opacity-transition-500.g-type-shrinkwrap-inline.g-type-shrinkwrap-large-secondary.soundTitle__usernameHero.sc-type-medium {
        font-size: 14px
    }
    .playControls.m-queueVisible.m-visible .playControls__queue {
        border: 1px solid #6668;
    }
    .spotlight h3, .userstream__header h3 {
        font-size: 20px
    }
    .userNetworkComments__item.sc-border-light-top {
        border-top: 1px solid #333
    }
    .userNetworkComments__item .commentBadge__body {
        color: #ccc;
        font-size: 16px;
        margin: 10px 35px
    }
    .emptyNetworkPage__image {
        filter: invert(1) brightness(1.5) drop-shadow(2px 2px 0 #0d0d0d)
    }
    .backgroundGradient.m-imageOverlay .backgroundGradient__imageOverlay {
        filter: blur(15px) brightness(.3);
        transform: none
    }
    .sc-button-small.sc-button-selected.sc-button-follow:before {
        filter: invert(0) brightness(.5)
    }
    .headerImageEditDropdown {
        background: #000
    }
    .headerImageEditDropdown__button {
        color: #fff
    }
    .headerImageEditDropdown__button:focus,
    .headerImageEditDropdown__button:hover {
        color: #f50;
        background: #000;
        outline: 0
    }
    .sc-button.sc-button-translucent.sc-button-active:not(.sc-button-cta),
    .sc-button.sc-button-translucent:not(.sc-button-cta):focus,
    .sc-button.sc-button-translucent:not(.sc-button-cta):hover {
        background: #000;
        color: #f50
    }
    .activeUpload__form,
    .activeUpload__hqNote,
    .activeUpload__shareContainer,
    .editAccessTab__quietTeaser.g-upsell-container,
    .quotaMeterWrapper,
    .statsOverview__separator,
    .tokenInput__wrapper.tagInput__wrapper.sc-input.sc-input-medium,
    .trackManager__upsellWrapper {
        background: #111
    }
    .activeUpload__savedFieldsSharingContainer,
    .activeUpload__shareContainer input,
    .dialog__content div,
    .quotaMeter__percentage,
    .soundEditTabs,
    .soundEditTabs input,
    .statsOverview__titleRow.g-flex-row-centered-spread,
    .statsOverview__titleRow.g-flex-row-centered-spread input,
    .statsSummary.g-flex-row-centered {
        color: #ccc
    }
    .quotaMeter__background.sc-background-dark {
        background: #321100
    }
    .quotaMeter__minutesUsed[style] {
        background: #f50!important
    }
    .sc-classic .uploadButton.selected, .uploadButton.selected {
        background: #0000;
    }
    .quotaMeter__link {
        color: gray!important
    }
    .soundBadge.active:not(.compact),
    .soundBadge.hover:not(.compact),
    .soundBadge.selected:not(.compact),
    .soundBadge:hover:not(.compact),
    .topStats__wrapperEligible:focus,
    .topStats__wrapperEligible:hover,
    .uploadTarget__frame {
        background: #0d0d0d
    }
    .topStatsModule__header.l-container.sc-background-light .g-flex-row-spread {
        padding: 20px
    }
    .tokenInput__wrapper.tagInput__wrapper.sc-input.sc-input-large,
    .topStatsModule__item,
    .topStatsModule__item:last-child,
    .topStatsModule__upsell.sc-border-dark.sc-background-white.sc-type-small {
        border-color: #1d1d1d;
        background: #131313
    }
    .topStatsItemPlaceholder__text {
        filter: invert(.95)
    }
    .statsOverview__main.l-container {
        border: 1px solid #1d1d1d;
        background: #131313;
        padding: 15px!important;
        margin-top: 15px!important
    }
    .userStatsLegend.sc-border-dark-top {
        border-color: #1d1d1d
    }
    .topStatsList__emptyText,
    .topStatsList__upsell {
        -webkit-flex-grow: 1.2;
        flex-grow: 1.2
    }
    .statsChartHeader__count.sc-type-medium {
        color: #ccc;
        font-size: 20px
    }
    .commentBadgeList__item.sc-border-light-top,
    .conversationMessage__from.sc-type-h3.sc-truncate,
    .dateSelectStats.g-flex-row input,
    .g-flex-row-centered-spread,
    .newMessageForm.sc-clearfix,
    .newMessageForm.sc-clearfix input,
    .quotaMeter__boldLine,
    .sc-font-light.medium.profileUploadFooter__text,
    .soundBadge__extraItem.soundBadge__duration,
    .statsEmptyGraphTips.sc-type-large.sc-text,
    .topStatsFullItem__text.sc-type-large.sc-truncate,
    .topStatsHeader__title.g-modal-title-h1,
    .topStatsModule__upsell.sc-border-dark.sc-background-white.sc-type-small,
    .uploadMain__content {
        color: #ccc
    }
    .stats__xAxis text {
        fill: #fff
    }
    .commentBadge__body {
        padding-left: 15px;
        padding-top: 5px;
        padding-bottom: 10px
    }
    .sc-button-medium.sc-button-pageleft:before,
    .sc-button-medium.sc-button-pageright:before {
        filter: invert(1)
    }
    .recipientChooser .tokenInput__wrapper {
        background: 0 0
    }
    .quotaMeterWrapper.sc-border-light {
        border: 1px solid #1d1d1d!important;
        background: #131313
    }
    .dashbox,
    .statsBadge .statsBadge__upsell.sc-border-light-top {
        display: none
    }
    .tokenInput__token {
        background: #131313
    }
    .spotlight__item {
        padding: 0
    }
    .conversation__form {
        padding-left: 5px
    }
    .sidebarHeader.g-flex-row-centered-spread.sc-link-light.sc-border-light-bottom {
        border-bottom: 1px solid #181818
    }
    .userSuggestionList__item {
        padding: 5px 0
    }
    .historicalPlays.m-soundBadge .historicalPlays__item,
    .soundBadgeList.compact .soundBadgeList__item {
        padding: 3px 0
    }
    .sidebarContent[style] {
        min-height: unset!important
    }
    .sidebarModule {
        margin-bottom: 15px
    }
    .statsBadge__recent {
        margin: 0
    }
    .l-fluid-fixed .l-sidebar-right .l-footer {
        top: 0;
        padding-bottom: 95px
    }
    .l-front {
        position: relative;
        margin: auto!important;
        width: 85%;
        color: #fff
    }
    .frontMobileTeaser__device {
        filter: invert(.982) hue-rotate(180deg);
    }
    .frontMobileTeaser {
        background: #111;
    }
    .header__loginMenu {
        padding: 16px 6px 2px;
    }
    .header__loginMenu .loginButton {
        margin-right: 5px;
    }
    .header__loginMenu .signupButton {
        margin-left: 5px;
    }
    .g-opacity-transition.sc-button.sc-button-medium.loginButton {
        border-color: #666!important;
        background-color: transparent!important;
        color: #fff!important
    }
    .uploadLoggedOut__testimonials {
        background-color: #111!important
    }
    a.soundActions__purchaseLink {
        color: #ccc!important;
        font-size: 1em;
        top: 1.5px;
        transition: color 0.25s;
    }
    a.soundActions__purchaseLink:hover {
        color: #fff!important;
        transition: color 0.25s;
    }
    
    /*----------------------------------------------------------------- IMPORT QUITE DARK (https://33kk.github.io/uso-archive/?style=143738) -----------------------------------------------------------------*/
    /* Snippets from 'SoundCloud - Quite Dark' by pawelos076232: userstyles.org/styles/143738 */
    .g-dark-bg,
    .g-dark-list,
    .unreadConversations,
    .profileMenu__list {
        background-color: #222
    }
    .sc-classic .headerMenu.m-light, .headerMenu.m-light {  /*modified*/
        background-color: #111;
        border-color: #333;
        transition-duration: 1s;
        box-shadow: none;
    }
    .m-light .headerMenu__link:focus,
    .m-light .headerMenu__link:hover,
    .sc-classic .m-light .headerMenu__link:focus,
    .sc-classic .m-light .headerMenu__link:hover {
        background-color: #0d0d0d80;
        transition-duration: 0.25s;
        box-shadow: 16px -4px 12px #1114 inset;
    }
    .m-light .headerMenu__link, /*unmodified*/
    .m-light .headerMenu__link:focus,
    .m-light .headerMenu__link:hover,
    .sc-classic .m-light .headerMenu__link,
    .sc-classic .m-light .headerMenu__link:focus,
    .sc-classic .m-light .headerMenu__link:hover {
        color: #ccc
    }
    .m-light a[class*="profileMenu__"]:after {
        filter: invert(1)
    }
    .m-light .headerMenu__list, .sc-classic .m-light .headerMenu__list {
        border-color: #1c1c1c
    }
    .dropdownContent__container {
        background-color: #111;
        border-color: #333
    }
    .dropdownContent__listItem,
    .dropdownContent__header,
    .dropdownContent__main, 
    .sc-classic .dropdownContent__listItem,
    .sc-classic .dropdownContent__header,
    .sc-classic .dropdownContent__main {
        border-bottom-color: #6664
    }
    .notificationBadge__link:focus {
        border-color: #333
    }
    .notificationBadge__main {
        color: #999
    }
    /*.header__navMenu > li > a.selected,
    .header > li > a:focus,
    .userNav__item.selected,
    .userNav__button.selected,
    .header__navMenu > li > a.header__moreButton.selected {
        background-color: #222
    }*/
    body,
    textarea,
    select,
    button,
    input,
    .sc-text,
    a:hover,
    a.sc-ministats:hover,
    a.sc-link-dark,
    a.sc-link-light:hover,
    .sc-buylink,
    .sc-buylink:visited,
    .commentPopover.darkText .commentPopover__body,
    .moreActions__group .moreActions__link,
    .blockCheckbox__title,
    .truncatedAudioInfo__collapse:focus,
    .statsBadge__upsell-text > span,
    .localeSelector__body,
    .localeSelectorContent__link:hover,
    .sc-button-nostyle,
    .commentBadge:hover .commentBadge__title a
    .sc-classic textarea,
    .sc-classic select,
    .sc-classic button,
    .sc-classic input,
    .sc-classic .sc-text,
    .sc-classic a:hover,
    .sc-classic a.sc-ministats:hover,
    .sc-classic a.sc-link-dark,
    .sc-classic a.sc-link-light:hover,
    .sc-classic .sc-buylink,
    .sc-classic .sc-buylink:visited,
    .sc-classic .commentPopover.darkText .commentPopover__body,
    .sc-classic .moreActions__group .moreActions__link,
    .sc-classic .blockCheckbox__title,
    .sc-classic .truncatedAudioInfo__collapse:focus,
    .sc-classic .statsBadge__upsell-text > span,
    .sc-classic .localeSelector__body,
    .sc-classic .localeSelectorContent__link:hover,
    .sc-classic .sc-button-nostyle,
    .sc-classic .commentBadge:hover .commentBadge__title a {
        color: #ccc
    }
    a.sc-link-dark:hover,
    a.sc-link-medium:hover,
    .sc-buylink:hover {
        color: white
    }


    
    /*----------------------------------------------------------------- BEGIN CUSTOM STYLING -----------------------------------------------------------------*/
    
    
    
    .g-z-index-header-menu[style] {
        border-radius: 32px!important;
        border: none!important;
    }
    /*.sc-button-icon-light {
        border: 0!important;
        border-radius: 120px;
        background: #0AF!important;
        color: #000!important;
        font-weight: bold;
        padding: 0 15px!important;
        filter: invert(1)brightness(105%)contrast(150%)hue-rotate(-20deg)!important;
    }*/
    .activitiesListFull__item + .activitiesListFull__item {
        border: none
    }
    a.sc-link-verylight, .localeSelector {
        color: #ccc!important;
        transition-duration: 0.25s
    }
    .localeSelector > .sc-text {
        color: #999;
        transition-duration: 0.25s
    }
    a.sc-link-verylight:hover, .localeSelector:hover {
        color: #fff!important;
        transition-duration: 0.25s
    }
    .localeSelector > .sc-text:hover {
        color: #ccc;
        transition-duration: 0.25s
    }
    .notificationBadge--unread {
        background: linear-gradient(220deg, rgb(255 0 35 / 15%) 0%, rgb(255 0 141 / 0.05) 30%, #1110 75%)!important;
    }
    .notificationBadge__link:hover {
        box-shadow: 12px 8px 18px #000c;
        transition-duration: 0.25s;
    }
    .notificationBadge__link {
        transition-duration: 1s;
    }
    .latestActivities__container:hover, .unreadConversations__container:hover, .profileMenu:hover, .moreMenu:hover, .dialog:hover {
        box-shadow: 2px 1px 16px #000;
        transition: top 0s, left 0s, box-shadow 0.25s;
    }
    .latestActivities__container, .unreadConversations__container, .profileMenu, .moreMenu, .dialog {
        box-shadow: 8px 4px 32px #000a;
        transition: top 0s, left 0s, box-shadow 1s;
    }
    .visualSound.listenContext .visualSound__wrapper {
        background: #111;
    }
    /* queue and dropdowns */
    .sc-classic .dropdownContent__container, .dropdownContent__container, .sc-classic .headerMenu.m-light, .headerMenu.m-light, .sc-classic .dialog, .dialog, .playControls__queue, .sc-classic .playControls__queue {
        border-radius: 12px;
        border: 1px solid #4448;
        background-color: #191919aa;
        backdrop-filter: blur(32px);
    }
    .sc-classic .m-light .headerMenu__list:first-child li:first-child .headerMenu__link {
        border-radius: 12px 12px 0 0;
    }
    .sc-classic .m-light .headerMenu__list:last-child li:last-child .headerMenu__link {
        border-radius: 0 0 12px 12px;
    }
    .dropdownContent__listItem:hover, .queueItemView:hover {
        box-shadow: inset 6px -4px 64px #0006;
    }
    .dropdownContent__listItem, .dropdownContent__listItem:hover, .queueItemView, .queueItemView:hover {
        transition: box-shadow ease-out 0.3s;
    }
    .playbackSoundBadge__like.sc-button-small.sc-button-icon:before, .playbackSoundBadge__like.sc-button-small.sc-button-icon:not(.sc-button-selected):hover:before, .playbackSoundBadge__follow:before, .playbackSoundBadge__follow:hover:before {
        filter: invert(1) hue-rotate(180deg) contrast(1.5);
        transition-duration: 0.25s;
    }
    .playbackSoundBadge__like.sc-button-small.sc-button-icon:not(.sc-button-selected):before, .playbackSoundBadge__follow:before {
        filter: invert(1) hue-rotate(180deg) contrast(1.5) brightness(0.7);
        transition-duration: 0.25s;
    }
    .playbackSoundBadge__showQueue, .playbackSoundBadge__showQueue:not(.sc-button-selected):hover, .m-queueVisible .playbackSoundBadge__actions .playbackSoundBadge__showQueue:not(.sc-button-selected) {
        filter: invert(1) hue-rotate(180deg) contrast(1.5) hue-rotate(/*[[hue]]*/deg) var(--fil);
        transition-duration: 0.25s;
    }
    .playbackSoundBadge__showQueue:not(.sc-button-selected) {
        filter: invert(1) hue-rotate(180deg) contrast(1.5) brightness(0.7);
        transition-duration: 0.25s;
    }
    .queue__panel, .queueItemView, .queue__fallback.queue__itemWrapper {
        background-color: inherit;
    }
    .queueItemView.m-active, .queueItemView:hover {
        background-color: #1114!important;
    }
    .queueItemView.m-active, .queueItemView:hover, .queueItemView {
        transition: box-shadow ease-out 0.3s, background-color ease-out 0.3s;
    }
    .queueItemView:hover.m-active, .uploadMain__chooserContainer, .uploadMain__foot {
        background-color: #1116!important;
        border: none!important;
    }
    .queueItemView__username {
        color: #ccc!important;
    }
    .queueItemView__title a {
        color: #fff!important;
    }
    /* .moreActions .moreActions__button.sc-button-medium.sc-button-like:before {
        filter: invert(1) brightness(0.5);
    } */
    .sc-button-follow:not(.sc-button-nostyle):not(.sc-button-transparent):not(.sc-button-selected):not(.playbackSoundBadge__follow):hover {
        border-color: #fff;
        border: 0;
        border-radius: 120px;
        background: #f30 !important;
        color: #fff !important;
        transition-duration: 0.25s;
    }
    .sc-button-follow:not(.sc-button-nostyle):not(.sc-button-transparent):not(.sc-button-selected):not(.playbackSoundBadge__follow) {
        border-color: #1a1a1a;
        border: 0;
        border-radius: 120px;
        background: #f50 !important;
        color: #fff !important;
        transition-duration: 1s;
        filter: hue-rotate(/*[[hue]]*/deg) var(--fil);
    }
    .audibleAttributeDesc, .listenInfo__releaseTitle, .listenInfo__releaseData {
        color: #b3b3b3;
    }
    .playButton.m-stretch {
        transition-duration: 1s
    }
    .playButton.m-stretch:hover {
        filter: drop-shadow(2px 2px 6px #000);
        transition-duration: 0.25s
    }
    .sc-button-small.sc-button-follow.sc-button-icon-light:before {
        filter: invert(0);
    }
    .featuredProfiles {
        z-index: 10;
        border-radius: 12px;
        backdrop-filter: blur(12px);
        transition-duration: 0.4s;
        -webkit-transform: translateY(-220px);
        transform: translateY(-220px);
    }
    .featuredProfiles:hover {
        backdrop-filter: blur(12px);
        transition-duration: 0.2s
    }
    .modal.modalWhiteout {
        backdrop-filter: blur(12px);
    }
    .g-tabs-link, .g-tabs-link:visited, .sc-classic .g-tabs-link, .sc-classic .g-tabs-link:visited {
        color: #ccca!important;
        transition-duration: 1s;
    }
    .g-tabs-link:hover {
        color: #ccc;
        transition-duration: 0.25s;
    }
    .sc-button:not(.sc-button-play):not(.sc-button-cta):not(.g-button-transparent-inverted):not(.sc-button-active):not(.sc-button-selected):not(.sc-button-nostyle):not(.playbackSoundBadge__like):not(.premiumContent__button):not(.premiumContent__hint):not(.sc-button-transparent):not(.hintButton):not(.tileGallery__sliderButton):not(.playbackSoundBadge__follow):not(.editSnippet__playButton .sc-button-xxlarge):not(.moreActions__button):not(.spotlightRemove), .sc-button-group .sc-button-insights.sc-button-cta, .imageEditDropdown .sc-button, .uiEvoButton {
        border-color: #1a1a1a;
        background: #111;
        color: #ccc;
        transition-duration: 0.25s;
    }
    .sc-button:not(.sc-button-play):not(.sc-button-cta):not(.g-button-transparent-inverted):not(.sc-button-active):not(.sc-button-selected):not(.sc-button-nostyle):not(.playbackSoundBadge__like):not(.premiumContent__button):not(.premiumContent__hint):not(.sc-button-transparent):not(.hintButton):not(.tileGallery__sliderButton):not(.editSnippet__playButton .sc-button-xxlarge):not(.moreActions__button):not(.spotlightRemove):hover, .sc-button-group .sc-button-insights.sc-button-cta:hover, .imageEditDropdown .sc-button:hover .uiEvoButton:hover {
        border-color: #fff6;
        background: #222;
        color: #eee;
        filter: drop-shadow(2px 2px 6px #000);
        transition-duration: 0.25s;
    }
    .sc-button-selected.sc-button-like:not(.playableTile__actionWrapper .sc-button-selected.sc-button-like):not(.playbackSoundBadge__like):not(.sc-button-transparent):not(.sc-button:hover), .sc-button-selected.playbackSoundBadge__follow, .sc-button-selected.sc-button-repost, .sc-button-selected.addToPlaylistButton, .sc-button-selected.createPlaylistSuggestion__add {
        border-color: #1a1a1a;
        background: #111;
        transition-duration: 0.25s;
    }
    .sc-button-active:not(.sc-button-play):not(.sc-button-cta):not(.g-button-transparent-inverted):not(.sc-button-selected):not(.sc-button-nostyle):not(.playbackSoundBadge__like):not(.premiumContent__button):not(.premiumContent__hint):not(.sc-button-transparent):not(.hintButton), 
    .sc-button-selected.sc-button-like:not(.playableTile__actionWrapper .sc-button-like):not(.sc-button-transparent):hover, .sc-button-selected.playbackSoundBadge__follow:hover, .sc-button-selected.sc-button-repost:hover, .sc-button-selected.addToPlaylistButton:hover, .sc-button-selected.createPlaylistSuggestion__add:hover, .uiEvoButton.uiEvoButton--isSelected:hover {
        border-color: #f506;
        background: #310;
        filter: drop-shadow(2px 2px 6px #000) hue-rotate(/*[[hue]]*/deg) var(--fil);
        transition-duration: 0.25s;
    }
    .sc-border-light, .sc-classic .sc-border-light {
        border: 1px solid #222;
        border-radius: 4px;
        background-color: #111;
    }
    .modal__content {
        border-radius: 16px;
    }
    .modal__modal {
        border-radius: 16px;
        margin-bottom: 120px;
        /*height: calc(100% + 120px)!important*/
    }
    .tabs__tabs {
        border-radius: 16px 16px 0px 0px;
    }
    /*.visuals__container {
        filter: brightness(0.3) blur(6px);
    }*/
    /*.sc-button-group > .sc-button-medium:not(.sc-button-follow) {
        filter: brightness(1)!important;
    }*/
    .g-type-shrinkwrap-block:not(.profileHeaderInfo__userName):not(.soundTitle__info), .g-type-shrinkwrap-inline {
        background-color: rgba(0,0,0,.5);
        backdrop-filter: blur(6px);
    }
    .profileHeaderInfo__additional {
        border-radius: 6px;
    }
    /* rounded album art */
    .sc-artwork:not(.image__rounded), .visuals__container, .directSupport__box, .fullHero { 
        border-radius: 8px;
    }
    .soundBadge__artwork>div>.sc-artwork:not(.image__rounded) {
        border-radius: 6px
    }
    .trackItem__image>div>.sc-artwork:not(.image__rounded), div.compactTrackListItem__image>.sc-artwork:not(.image__rounded), .userAudibleSearchResultItem .sc-artwork:not(.image__rounded) {
        border-radius: 4px;
    }
    /* slight blue shift */
    .directSupport__copy {
        color: #eee;
    }
    .directSupport__box {
        filter: hue-rotate(/*[[blu]]*/deg) var(--fil);
    }
    .sc-label.sc-label-clearance, .sc-label.sc-label-geoblocked, .sc-label.sc-label-mastered, .sc-label.sc-label-monetizable, .sc-label.sc-label-restricted, .sc-label.sc-label-scheduled, .sc-label-blue {
        filter: hue-rotate(/*[[blu]]*/deg) var(--fil);
    }
    .sc-label.sc-label-private {
        filter: hue-rotate(/*[[hue]]*/deg) var(--fil);
    }
    .sc-label.sc-label-private:not(.sc-label-icon-only) {
        border-radius: 20px
    }
    .sc-label.sc-label-monetizable-possible, .sc-label.sc-label-monetization-restriction {
        background: #f5f5f5;
        border: 1px solid #d6d6d6;
        filter: invert(1) brightness(1.75);
    }
    /* fix choose image culling */
    .imageChooser__chooseButton, .imageChooser__chooseButton:hover {
        border-color: none;
        transition-duration: 0.25s;
    }
    .imageChooser__chooseButton {
        background: #0006;
        opacity: 0.75;
    }
    .imageChooser__chooseButton:hover {
        background: #1118;
        opacity: 1;
    }
    .dialog.rounded {
        border-radius: 12px;
    }
    .dialog__arrow {
        border: none;
        background: #222;
    }
    .soundEditForm, .audibleEditForm__audio, .audibleEditForm__progress, .audibleEditForm__form {
        background: #0d0d0d;
    }
    .listenEngagement, .sc-classic .listenEngagement {
        box-shadow: none;
    }
    .dropdownContent__listItem {
        border-bottom: none;
    }
    .profileHeader__info {
        z-index: auto;
        position: initial!important;
    }
    .g-tabs-item {
        z-index: 10;
        filter: drop-shadow(2px 4px 6px #000);
    }
    .sc-button:disabled, .sc-button:disabled:hover {
        border: none;
        color: #666
    }
    .sc-select, .sc-input, .sc-classic .sc-select, .sc-classic .sc-input {
        border: 1px solid #222;
    }
    .blockCheckbox__icon {
        filter: hue-rotate(/*[[hue]]*/deg) hue-rotate(-5deg) brightness(1) contrast(1.3) saturate(1.4) var(--fil);
    }
    .progressBar__inner {
        filter: hue-rotate(/*[[hue]]*/deg) hue-rotate(-5deg) saturate(1.5) var(--fil);
    }
    .progressBar.blue .progressBar__inner {
        filter: hue-rotate(/*[[blu]]*/deg) hue-rotate(10deg) saturate(1.1) var(--fil);
    }
    /* spotlight editing */
    .spotlight.editing .spotlight__item, .sc-classic .spotlight.editing .spotlight__item {
        background: transparent;
        transition-duration: 1s;
        padding: 5px 22px 4px 12px;
        margin: 4px -22px 4px -12px;
        border-radius: 8px;
    }
    .spotlight.editing .spotlight__item:hover, .sc-classic .spotlight.editing .spotlight__item:hover {
        background: #0006;
        border: #3336;
        transition-duration: 0.25s;
        box-shadow: 3px 3px 14px -3px #0008;
    }
    .keyboardShortcuts__shortcutsGroup>dl>dt>kbd>kbd {
        background: #fff1;
        color: #fff;
        font-weight: 400;
        border-radius: 5px;
        box-shadow: 2px 4px 6px #000a;
    }
    #app .l-container #content {
        overflow: visible;
    }
    .createPlaylistSuggestion__addContainer, .editTrackItem__additional, .editTrackItem.m-active .editTrackItem__additional, .editTrackItem.m-hover .editTrackItem__additional, .editTrackItem.m-dragging .editTrackItem__additional { /*Remove linear-gradient background on some selection areas*/
        background: none;
    }
    .commentFormDisabled, .sc-classic .commentFormDisabled {
        background: #0003;
        border-radius: 8px;
    }
    /*fix infobar wrapping mess*/
    .listenEngagement__footer {
        flex-wrap: wrap-reverse;
    }
    .listenEngagement__stats {
        flex-wrap: nowrap;
    }
    .soundActions {
        flex-wrap: wrap;
    }
    .sc-ministats-item {
        white-space: nowrap;
    }
    .sc-...

Reviews

No reviews yet.