#page {
    grid-row: title / bottomstart;

    @media (prefers-color-scheme: dark) {
        color: var(--gold-1);
    }
}

a:link {
    color: var(--blue-6);
}

a.new, p a.new:visited {
    color: red;
    text-decoration: underline wavy;
}

a:not(.new):visited {
    color: var(--pink-6);
}

a:hover , a:visited:hover {
    color: var(--blue-4);
}

@media (prefers-color-scheme: dark) {

    a:link {
        color: var(--blue-5);
    }

    a.new, p a.new:visited {
        color: red;
        text-decoration: underline wavy;
    }

    a:not(.new):visited {
        color: var(--pink-5);
    }

    a:hover , a:visited:hover {
        color: var(--blue-4);
    }

}

#pagebody-header {
    grid-row: toc;
}

.mw-heading {
    display: flex;
    margin-bottom: calc(var(--space));
}

#page p {
    margin-bottom: calc(var(--space) * 2);
    line-height: calc(var(--space) * 3);
    text-wrap: pretty;
}

#mw-content-text {
    grid-row: toc / bottomstart;
}

.mw-heading h2{
    margin-left: calc(var(--space) * 3);
    margin-bottom: calc(var(--space));
}

.mw-heading2 {
    border-bottom: 2px solid;
    margin-bottom: calc(var(--space));
    margin-top: calc(var(--space) * 3);
    border-image: linear-gradient(90deg, transparent 2.5%, var(--gold-7) 6%, transparent 90%) 30;
    @media (prefers-color-scheme: dark) {
        border-image: linear-gradient(90deg, transparent 2.5%, var(--gold-1) 6%, transparent 90%) 30;
    }
}

.mw-heading h3 {
    margin-left: calc(var(--space) * 4);
    margin-top: calc(var(--space));
}

.mw-heading h4 {
    margin-left: calc(var(--space) * 8);
}

.mw-heading3 .mw-editsection, .mw-heading4 .mw-editsection {
    display: none;
}

.mw-editsection-bracket {
    display: none;
}

.mw-editsection.mw-editsection a:link, .mw-editsection.mw-editsection a:visited {
    color: var(--blue-7);
}

@media (min-width: 1201px) {
    #page {
        margin-top: calc(var(--space) * 6);
        grid-column: pagestart / pageend ;
        grid-row: title / bottomstart ;
        display: grid;
        grid-template-rows: subgrid;
        grid-template-columns: 1fr;
    }

    #pagebody {
        grid-row: pagebody
    }


    .mw-heading {
        align-items: end;
        justify-content: space-between;
    }

}

@media (max-width: 1200px) {
    #page {
        grid-column: 1;

        display: grid;
        grid-template-rows: subgrid;
        grid-template-columns: subgrid;
        margin-top: calc(var(--space) * 4);
    }

    #pagebody {
        grid-row: 2;
    }

    #mw-content-text p {
        margin-left: var(--space);
        margin-right: var(--space);
    }

    .mw-heading {
        margin-left: var(--space);
        margin-right: var(--space);
    }

    .mw-heading > .mw-editsection {
        position: absolute;
        right: var(--space);
    }

}


@media (max-width: 720px) {

}