@font-face {
    font-family: 'E13B';
    font-style: normal;
    font-weight: 400;
    src: url('https://ccsids.net/_vieweraux/E13B.woff') format('woff');
}
@font-face {
    font-family: 'CMC7';
    font-style: normal;
    font-weight: 400;
    src: url('https://ccsids.net/_vieweraux/CMC7.woff') format('woff');
}
body {
    font-family: sans-serif;
}
a[rel=parent]::before {
    content: "↑ ";
}
article {
    display: grid;
    gap: 0;
    grid-template-columns: repeat(16, minmax(5em, 1fr));
    grid-auto-rows: minmax(1.5em, auto);
    border: 0.4em solid #999;
    max-width: 82em;
    margin-left: auto;
    margin-right: auto;
}
article>ul {
    display: contents;
}
article>ul>* {
    display: block;
    text-align: center;
    vertical-align: middle;
    padding: 0;
    min-height: 3em;
}
article>ul>*>div {
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
}
article>ul>*>div>div {
    width: 100%;
}
.oddeven {
    background: #f9f9f9;
}
.evenodd {
    background: #ddd;
}
.oddodd {
    background: #d8d8d8;
}
h2 {
    grid-column-start: 1;
    grid-column-end: 17;
    border-top: 0.2em solid #999;
    background: #999;
    color: #fff;
    font-size: 150%;
    text-align: left;
    padding-left: 1em;
    margin: 0;
    line-height: 1.5em;
}
article>h2:first-of-type {
    border-top: 0;
}
.disfavoured {
    background: rgba(255, 149, 0, 0.25);
}
.zero-width {
    background: rgba(0, 149, 255, 0.1);
}
.chardisplay {
    height: 1.5em;
    line-height: 1.5em;
    user-select: all;
}
[data-prefix="A"] .chardisplay {
    font-family: Noto Kufi Arabic, sans-serif;
}
[data-prefix="B"] .chardisplay {
    font-family: Noto Sans Thai, sans-serif;
}
[data-prefix="H"] .chardisplay {
    font-family: Noto Sans Hebrew, Noto Sans Syriac, Noto Sans Imperial Aramaic, sans-serif;
}
[data-prefix="J"] .chardisplay, [data-prefix="R"] .chardisplay {
    font-family: Noto Sans CJK JP, Plangothic P2, sans-serif;
}
[data-prefix="K"] .chardisplay, [data-prefix="L"] .chardisplay, .romanisation {
    font-family: Charis SIL, Doulos SIL, DejaVu Serif, serif;
}
[data-prefix="O"] .chardisplay {
    font-family: Noto Sans CJK KR, sans-serif;
}
[data-prefix="SA"] .chardisplay {
    font-family: Latin Modern Math, Cambria Math, DejaVu Math TeX Gyre, TeX Gyre DejaVu Math, DejaVu Math, serif;
}
[data-prefix="SF"] .chardisplay, [data-prefix="SH"] .chardisplay {
    font-family: BabelStone Pseudographica, BabelStone Shapes, Lucida Console, Monaco, Consolas, serif;
}
[data-prefix="SO"] .chardisplay {
    font-family: E13B, CMC7, monospace;
    overflow: hidden;
}
[data-prefix="U0FC"] .chardisplay {
    font-family: Noto Sans Lao, Noto Sans Devanagari, Noto Sans Tamil, Noto Sans Telugu, Noto Sans Gujarati, Noto Sans Kannada, Noto Sans Malayalam, Noto Sans Gurmukhi, Noto Sans Bengali, Noto Sans Oriya, Noto Kufi Arabic, sans-serif;
}
[data-prefix="U0FF"] .chardisplay {
    font-family: IPAmjMincho, Charis SIL, Doulos SIL, DejaVu Serif, Noto Serif, Noto Serif CJK SC, Noto Serif CJK JP, serif;
}
[data-prefix="U0F$"] .chardisplay {
    font-family: Charis SIL, Doulos SIL, Noto Serif Hebrew, Noto Sans Arabic, DejaVu Serif, serif;
}
@media (prefers-color-scheme: dark) {
    body {
        color: #AAA;
        background: black;
    }
    a:link, summary {
        color: #69F;
    }
    a:visited {
        color: #96F;
    }
    a:active {
        color: #F66;
    }
    article {
        border-color: #878787;
    }
    .oddeven {
        background: #0A0A0A;
    }
    .evenodd {
        background: #2A2A2A;
    }
    .oddodd {
        background: #333;
    }
    h2 {
        border-top-color: #878787;
        background: #878787;
        color: black;
    }
    .disfavoured {
        background: rgba(155, 49, 0, 0.33);
    }
    .zero-width {
        background: rgba(0, 60, 255, 0.33);
    }
}
