.scope-markdown {
    code {
        /*
        @include themer(color, (
            'dark': #ffa6a6,
            'light': #e83e8c,
        ));
        */
        
        color: currentColor;
        padding: 0 5px;
        border: 1px solid #d2d5d8;
        background-color: #fafbf4;
        border-radius: 3px;
        white-space: nowrap;
    }

    h1, h2, h3,
    h4, h5, h6 {
        line-height: 1.2;
        
        .heading-anchor {
            border-bottom: 0;
            font-size: 0.8em;
            opacity: 0.6;
            transition: opacity 0.2s;
        }

        &:hover {
            .heading-anchor {
                opacity: 1;

                &:active,
                &:focus,
                &:hover {
                    @include themer(color, (
                        'dark': $site-ui-brand-dark,
                        'light': $site-ui-brand-light,
                    ));

                    text-decoration: underline;
                }
            }
        }
    }

    h1 {
        font-size: 2.25rem;
        // font-size: 18px;
        font-family: 'Arial Black', 'Arial', sans-serif;
        font-weight: 900;
        position: relative;
        z-index: 2;
        margin-bottom: 40px;

        span {
            background: linear-gradient(104.39deg, #BAFF91 4.53%, #FFF6A4 73.74%);
            background-size: 100% 0.375em;
            background-repeat: repeat-x;
            background-position: left 0 bottom 0.15em;
        }
        // @media (min-width: 576px) {
        //     font-size: 28px;
        // }
        // @media (min-width: 768px) {
        //     font-size: 2.25rem;
        // }
    }

    h2 {
        @include themer(border-bottom-color, (
            'dark': $site-ui-border-color-dark,
            'light': $site-ui-border-color-light,
        ));

        border-bottom-style: solid;
        border-bottom-width: 1px;
        font-size: 2rem;
        margin-bottom: 1.25rem;
        margin-top: 2rem;
        padding-bottom: 0.5rem;
    }

    h3, h4, h5, h6 {
        font-size: 1.5rem;
        font-weight: bold;
        margin-bottom: 0.75rem;
        margin-top: 1.75rem;
    }

    h4 {
        font-size: 1.25rem;
    }

    h5 {
        font-size: 1.15rem;
        font-weight: 600;
    }

    h6 {
        font-size: 1rem;
    }

    img {
        display: block;
        max-width: 100%;
    }

    table {
        width: 100%;

        thead,
        tr {
            @include themer(border-bottom-color, (
                'dark': $site-ui-border-color-dark,
                'light': $site-ui-border-color-light,
            ));

            border-bottom-style: solid;
        }

        thead {
            border-bottom-width: 2px;
        }

        tr {
            border-bottom-width: 1px;

            &:last-child {
                border-bottom: 0;
            }
        }

        td,
        th {
            padding: 0.5rem 0.25rem;
        }
    }
    
    ul, ol {
        padding-left: 20px;
    }
    
    li {
        margin-bottom: 10px;
    }
}
