:root {
    --bg: light-dark(white, black);
    --fg: light-dark(black, white);
    --border: 1pt solid var(--fg);
    background-color: var(--bg);
    color: var(--fg);
}

body {
    margin: auto;
    text-align: center;
}

details#what-is-this {
    max-width: 32em;
    margin: auto;
    margin-bottom: 2em;
}

details#what-is-this p {
    text-align: justify;
}

h1 {
    font-variant-caps: all-small-caps;
}

dfn {
    font-style: normal;
}

footer {
    font-style: italic;
}

figure {
    margin-inline: 0;
}

figure img {
    max-width: 100%;
    @media (prefers-color-scheme: light) {
        filter: hue-rotate(180deg) invert(1);
    }
}

table details > summary {
    list-style-type: none;
    cursor: pointer;
}

table details[open] > summary {
    list-style-type: "▾ ";
    font-size: small;
}

table details > p {
    font-size: small;
    margin: 0;
    border: var(--border);
    border-radius: 5pt;
    padding: 0 5pt;
    position: absolute;
    z-index: 1;
    white-space: normal;
}

table {
    border-collapse: collapse;
    display: inline-block;
}

tr {
    border-inline-color: currentcolor;
}

td {
    padding-inline: 5pt;
}

td.date {
    text-align: left;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    font-size: small;
}    

td.position {
    text-align: right;
    font-variant-numeric: tabular-nums;
    font-size: small;
}

td.percent {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

td.team1 {
    text-align: right;
    padding-right: 0;
}

td.team2 {
    text-align: left;
    padding-left: 0;
}

td[data-team], td.result, td.future {
    text-align: center;
    border: var(--border);
    white-space: nowrap;
    padding-inline: 1pt;
    width: 2.4em;
}

td.draw,
td.draw * {
    background-color: gray;
    color: var(--fg);
}

td.future,
td.future * {
    background-color: var(--bg);
    color: var(--fg);
}

td[data-team="AUS"],
td[data-team="AUS"] * {
    background-color: #ffe000;
    color: #00372f;
}
td[data-team="ENG"],
td[data-team="ENG"] * {
    background-color: white;
    color: #15295e;
}
td[data-team="IND"],
td[data-team="IND"] * {
    background-color: #1350c1;
    color: #fb671d;
}
td[data-team="PAK"],
td[data-team="PAK"] * {
    background-color: darkgreen;
    color: white;
}
td[data-team="BAN"],
td[data-team="BAN"] * {
    background-color: #0e5331;
    color: #f33;
}
td[data-team="NZ"],
td[data-team="NZ"] * {
    background-color: black;
    color: white;
}
td[data-team="SL"],
td[data-team="SL"] * {
    background-color: #002366;
    color: #ffe000;
}
td[data-team="SA"],
td[data-team="SA"] * {
    background-color: #005443;
    color: #ffd300;
}
td[data-team="WI"],
td[data-team="WI"] * {
    background-color: #79001f;
    color: #ffff00;
}