index.css

html, body {
    max-height: 100vh;
    overflow: hidden;
}

@font-face {
    font-family: "Source Sans Pro";
    font-weight: normal;
    src: url("/fonts/SourceSansPro/SourceSansPro-Regular.ttf");
}

@font-face {
    font-family: "Source Sans Pro";
    font-weight: 600;
    src: url("/fonts/SourceSansPro/SourceSansPro-Bold.ttf");
}

@font-face {
    font-family: "Source Sans Pro";
    font-weight: 300;
    src: url("/fonts/SourceSansPro/SourceSansPro-Light.ttf");
}

@font-face {
    font-family: "Avenir";
    font-weight: normal;
    src: url("/fonts/Avenir/AvenirNextLTPro-Regular.otf");
}

@font-face {
    font-family: "Avenir";
    font-weight: 400 700;
    src: url("/fonts/Avenir/AvenirNextLTPro-Bold.otf");
}

@font-face {
    font-family: "Helvetica Neue";
    font-weight: normal;
    src: url("/fonts/Helvetica-Neue/HelveticaNeueLTPro-Roman.otf");
}

@font-face {
    font-family: "Helvetica Neue";
    font-weight: 400 700;
    src: url("/fonts/Helvetica-Neue/HelveticaNeueLTPro-Bd.otf");
}

.source-list .source::after {
    content: "|";
    padding: 0 2px 0 8px;
    font-style: normal;
}

.source-list > .source:last-child::after {
    content: none;
}

.chakra-toast .chakra-alert, .chakra-toast .chakra-alert .chakra-alert__icon {
    background: #AE88EB; 
    color: #fff;
}

@media (min-width: 769px) {
    input#detention + span {
        margin-top: 7px;
    }

    input#includeMissingHarmScore + span {
        margin-top: 5px;
    }
}