.chart {
    margin-bottom: var(--size-gutter);
    padding-top: var(--size-gutter-md);
    padding-bottom: var(--size-gutter-md);
    border-left: var(--border-width) solid var(--color-alt);
    background: var(--color-main);
    border-radius: 0 0 0 var(--size-gutter);
    font-family: var(--font-family-mono);

    @media screen and (prefers-color-scheme: light) {
        background: var(--color-main-darker);
    }
}

.ct-chart .ct-series .ct-line,
.ct-chart .ct-series .ct-bar {
    stroke: var(--color-alt);
}

.ct-chart .ct-series .ct-point {
    stroke: var(--color-alt-darker);
}

.ct-chart .ct-labels .ct-label {
    fill: var(--color-white);
    color: var(--color-white);
}

.ct-chart .ct-grids .ct-grid {
    stroke: var(--color-gray);
}