:root {

    --bg: #ffffff;
    --text: #222;
    --muted: #666;
    --border: #ddd;

    --max-width: 760px;

    --font:
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;
}

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

    :root {
        --bg: #1b1b1b;
        --text: #eeeeee;
        --muted: #aaaaaa;
        --border: #444;
    }
}

body {

    background: var(--bg);
    color: var(--text);

    font-family: var(--font);

    line-height: 1.7;

    max-width: var(--max-width);

    margin: auto;

    padding: 2rem;
}

h1, h2 {
    line-height: 1.2;
}

.intro {
    color: var(--muted);
}

.scale {

    margin: 4rem 0;
    padding-top: 2rem;

    border-top: 1px solid var(--border);
}

.meta {

    color: var(--muted);
    font-size: 0.9rem;
}

table {

    width: 100%;

    border-collapse: collapse;

    margin-top: 1rem;
}

th,
td {

    text-align: left;

    padding: 0.75rem;

    border-bottom: 1px solid var(--border);

    vertical-align: top;
}

th {
    font-weight: 600;
}

a {
    color: inherit;
}

footer {

    margin-top: 5rem;

    color: var(--muted);

    font-size: 0.9rem;
}