soundcloud cinnamoroll dark by sykomori

/* ==UserStyle==
@name         soundcloud cinnamoroll dark
@version      20241208.14.06
@namespace    https://userstyles.world/user/sykomori
@description  please don't use, this theme is unfinished
@author       sykomori
@license      No License
==/UserStyle== */

/* ==UserStyle==
@name         soundcloud cinnamoroll
@version      20241203.15.47
@namespace    ?
@description  please don't use, this theme is very unfinished and i probably won't be continuing this
==/UserStyle== */

@-moz-document url-prefix("https://soundcloud.com/") {
:root {
    --transparent-white: rgba(255, 255, 255, 0.8);
    --transparent-black: rgba(0, 0, 0, 0.25);
    --transparent-black2: rgba(0, 0, 0, 0.5);
    --transparent-gray: rgba(119, 119, 119, .75);
    --transparent-light-blue: rgba(145, 145, 145, .5);
    --bg-gradient: linear-gradient(#444, #111);
    --invis: rgba(0, 0, 0, 0);
}

html {
    background-image: var(--bg-gradient);
    background-attachment: fixed;
    background-repeat: no-repeat;
}

#app {
    height: 100vh;
    width: auto;
    background-image: var(--bg-gradient);
    background-attachment: fixed;
    background-repeat: no-repeat;
}

body.sc-classic {
    background-image: var(--bg-gradient);
    background-attachment: fixed;
    background-repeat: no-repeat;
}

#content {
    background-color: var(--transparent-white);
    border: 4px solid #fff;
}

.playControls.g-z-index-control-bar.m-visible {
    background-color: #000;
}

.l-top.sc-border-box.g-z-index-fixed.sc-browsers-enable-gpu.l-inner-fullwidth.sc-pt-3x {
    background-image: url(https://sykomori.neocities.org/cinnabanner_dark.png);
    background-attachment: fixed;
    background-color: #e7e7e7;
    border-left: 2px solid var(--transparent-black);
    border-right: 2px solid var(--transparent-black);
    border-bottom: 2px solid var(--transparent-black);
    box-shadow: 0 0 50px #000;
}

.profileHeader, .dropbar {
    border-left: 2px solid var(--transparent-gray);
    border-right: 2px solid var(--transparent-gray);
    border-bottom: 2px solid var(--transparent-gray);
    box-shadow: 0 0 50px #000;
}

.sc-classic .dropbar__content {
    background-color: var(--transparent-light-blue);
    backdrop-filter: blur(10px);
}

.sc-classic .playControls__inner {
    background-color: var(--transparent-light-blue);
    backdrop-filter: blur(10px);
}

.sc-classic .playControls__bg {
    background: 0;
}

.userDropbar__title.sc-truncate {
    color: #fff;
    text-shadow: 0 0 5px #000;
}

.userDropbar__title.sc-truncate {
    padding-left: 10px;
}

.sc-media-image {
    margin-right: 0;
}

.sc-link-dark :hover {
    color: #fff;
}

.sc-classic .g-tabs {
    border-bottom: 1px solid var(--invis);
}

.sc-border-light-bottom {
    border-bottom: 0;
}

.sc-classic .commentForm.visible .commentForm__wrapper, .sc-classic .sound__soundActions {
    background: 0;
}

.sc-classic .soundTitle__uploadTime, a.sc-link-verylight {
    color: #aaa;
}
}