:root > * {
    /* --- BACKGROUND --- */
    --md-default-bg-color: #0f0817;
    --md-default-bg-color--light: #261539; /* +10% lightness */
    --md-default-bg-color--lighter: #3d215f; /* +20% lightness */
    --md-default-bg-color--lightest: #542e83; /* +30% lightness */
    /* --- TEXT --- */
    --md-default-fg-color: #E0E0E0;
    --md-default-fg-color--light: #B3B3B3;
    --md-default-fg-color--lighter: #8C8C8C;
    --md-default-fg-color--lightest: #666666;
    /* --- GOLD ACCENT --- */
    --md-accent-fg-color: #BCA173;
    --md-accent-fg-color--light: #C8AA84; /* lighter gold */
    --md-accent-fg-color--dark: #9B8558; /* darker gold */
    /* --- PURPLE PRIMARY --- */
    --md-primary-fg-color: #7b3ccf;
    --md-primary-fg-color--light: #a375da; /* +10% lightness */
    --md-primary-fg-color--dark: #6b30b3; /* �10% lightness */
}

header.md-header {
    background-color: #7b3ccf !important;
}

.md-nav__toggle {
    background-color: #7b3ccf !important;
}

header.md-header::after {
    border-color: #7b3ccf !important;
}

.md-content img {
    border-radius: .5em;
    overflow: hidden;
}

.youtube-video img {
    border-radius: .5em;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    overflow: hidden;
}

.youtube-video {
    position: relative;
    cursor: pointer;
    overflow: hidden;
}

    .youtube-video::before,
    .youtube-video::after {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        pointer-events: none;
        transition: transform .3s ease, background .3s ease, opacity .3s ease;
    }

    .youtube-video::before {
        transform: translate(-50%, -50%);
        width: 64px;
        height: 64px;
        background: rgba(0, 0, 0, .5);
        border-radius: 50%;
        z-index: 1;
    }

    .youtube-video::after {
        transform: translate(-40%, -50%);
        width: 0;
        height: 0;
        border-left: 22px solid white;
        border-top: 14px solid transparent;
        border-bottom: 14px solid transparent;
        z-index: 2;
    }

    .youtube-video:hover::before {
        transform: translate(-50%, -50%) scale(1.2);
        background: rgba(0, 0, 0, .7);
    }

    .youtube-video:hover::after {
        transform: translate(-40%, -50%) scale(1.2);
        opacity: .9;
    }

    .youtube-video.playing::before,
    .youtube-video.playing::after {
        display: none;
    }