/*--- Light Mode ---*/

@media (prefers-color-scheme: light) {
    :root {
        --black: #01050c;
        --black-dim: #01050c77;
        --black-dark: #01050c11;
    }
}

:root[data-theme="light"] {
    --black: #01050c;
    --black-dim: #01050c77;
    --black-dark: #01050c11;
}

/*--- Dark Mode ---*/

@media (prefers-color-scheme: dark) {
    :root {
        --white: #01050c;
        --white-dim: #01050c77;
        --white-dark: #01050c11;
    }
}

:root[data-theme="dark"] {
    --white: #01050c;
    --white-dim: #01050c77;
    --white-dark: #01050c11;
}

/*--- Logo ---*/

.logo a {
    background: var(--white);
}

.logo svg#logo #logo-a {
    fill: var(--black);
}

.logo a:hover #logo #logo-a {
    fill: #fff;
}

/*--- Menu ---*/

#menu-container #menu-switch .menu-icon {
    background: var(--black);
}

/*--- Article View ---*/

.article-view .article .article-body score {
    display: block;
    font-weight: 900;
}

.article-view .article .article-body score::before {
    content: 'Score';
    display: inline;
    margin-right: 1rem;
    font-weight: 500;
}

.article-view .article .article-body score::after {
    content: '/9';
    display: inline;
    font-weight: 500;
}

.article-view .article .article-body year {
    opacity: 0.5;
}

.article-view .article .article-body year::before {
    content: '(';
    display: inline;
}

.article-view .article .article-body year::after {
    content: ')';
    display: inline;
}

.article-view .article .article-body p.mcu {
    margin-left: 1em;
}

.article-view .article .article-body p.mcu a,
.article-view .article .article-body p.mcu a:visited {
    color: var(--black);
}

.article-view .article .article-body p.mcu a:hover {
    color: var(--red);
}