.md-typeset {
    .grid {
        display: inline-grid;
        margin: 0;
    }
    .grid.meta {
        grid-template-columns: repeat(3, auto);
        grid-gap: 1em;
    }
    .grid.ans {
        grid-template-columns: repeat(3, auto);
    }
    h1, h2, h3 {
        margin-top: 1rem;
    }
    div.box {
        width: 18em;
        height: 4em;
        border: 2px solid black;
    }
    div.box.w100 {
        width: 100%;
        height: 23em;
    }
    .md-typeset__scrollwrap {
        margin: 0;
    }
    .md-typeset__table {
        padding: 0;
        margin-bottom: 0;
    }
    div.sheet {
        table {
            display: inline-block;
            border-collapse: collapse;
            border: 2px solid black;
            border-radius: 0;
        }
        table td:first-child {
            padding-left: 6px;
        }
        table td:last-child {
            padding-right: 6px;
        }
        table tbody tr:nth-child(1) td {
            padding-top: 3px;
        }
        table tbody tr:last-child td {
            padding-bottom: 3px;
        }
        table td,
        table th {
            border: none;
            padding: 1px;
            min-width: 1.5em;
            border-right: 1px dashed transparent;
        }
        table tr {
            border-bottom: 1px dashed transparent;
        }
        table tr:last-child {
            border-bottom: none;
        }
    }
    div.sheet.uid {
        table thead {
            background-color: white;
            border-bottom: 2px solid black;
            height: 2.5em;
        }
        table td,
        table th {
            border-color: gray;
        }
        table td:last-child,
        table th:last-child {
            border-right: none;
        }
    }
    div.sheet.ans {
        table thead {
            display: none;
        }
        table tr {
            border-color: gray;
        }
        table td:first-child {
            font-weight: 600;
            padding-right: 8px;
        }
    }
    :not(pre)>code {
        display: inline-block;
        line-height: 20px;
        text-align: center;
        background-color: white;
        border-radius: 50%;
        border: 1px solid gray;
        color: gray;
    }
    code.good {
        color: #222;
        background-color: #222;
    }
    code.bad1, code.bad2, code.bad3 {
        position: relative;
    }
    code.bad1::after {
        content: "";
        position: absolute;
        width: 140%;
        height: 5px;
        background-color: #222;
        top: 10px;
        left: -5px;
        transform: rotate(60deg);
    }
    code.bad2::after {
        content: "";
        position: absolute;
        width: 100%;
        height: 5px;
        background-color: #222;
        top: 2px;
        left: 0px;
    }
    code.bad3::after {
        content: "X";
        font-family: sans-serif;
        position: absolute;
        font-size: 180%;
        color: #222;
        top: 0;
        left: 0;
    }
    code.bad4 {
        background-color: #ddd;
    }
}
@media print {
    html, body {
        height: 90%; /* prevending the last blank page */
    }
    .md-typeset {
        .md-typeset__table {
            display: inline-block;
        }
        body, h1, h2, h3, p {
            color: black;
        }
        .grid.ans {
            grid-template-columns: repeat(5, auto);
        }
        div.box {
            width: 24em;
            height: 6em;
        }
        h1::before{
            content: "計算機言語 - ";
        }
        h1 .twemoji {
            display: none;
        }
    }
    .pagebreak { /* page-break-after works, as well */
        clear: both;
        page-break-after: always;
        break-before: column;
    }
}