@font-face {
    font-family: Fantasque Sans Mono;
    src: url(../font/FantasqueSansMono-Regular.ttf);
}

.article {
    position: relative;
    z-index: 999;
    font-size: 24px;
}

@media screen and (max-width: 800px) {
    #acronym {
        height: 50vw;
    }
}

.article-img,
video {
    display: block;
    width: 100%;
    object-fit: contain;
    overflow: hidden;
}

table {
    --line-height: 1rem;
    font-size: 16px;
    position: relative;
    top: calc(var(--line-height) / 2);
    width: calc(round(down, 100%, 1ch));
    border-collapse: collapse;
    margin: 0 0 calc(var(--line-height) * 2);
}

th,
td {
    --border-thickness: 2px;
    --line-height: 1rem;
    border: var(--border-thickness) solid #cbf7ed;
    padding: calc((var(--line-height) / 2))
        calc(1ch - var(--border-thickness) / 2)
        calc((var(--line-height) / 2) - (var(--border-thickness)));
    line-height: var(--line-height);
    vertical-align: top;
    text-align: left !important;
}

table tbody tr:first-child > * {
    --line-height: 1rem;
    --border-thickness: 2px;
    padding-top: calc((var(--line-height) / 2) - var(--border-thickness));
}

th {
    font-weight: 700;
}
.width-min {
    width: 0%;
}
.width-auto {
    width: 100%;
}