highlights.css

body.highlight nonNumeric,
body.highlight .nonNumeric,
.bottomPanel .nonNumeric {
    outline: 1px solid #FF4136;
    background-color: #FFDFDF;
    cursor: pointer;
}

body.highlight .nonNumeric *,
body.highlight nonNumeric * {
    outline: 0;
    background-color: #FFDFDF;
}

body.highlight nonFraction,
body.highlight .nonFraction,
.bottomPanel .nonFraction {
    outline: 2px solid #357EDD;
    background-color: #F6FFFE;
    cursor: pointer;
}

body.highlight nonFraction:hover,
body.highlight .nonFraction:hover,
body.highlight nonNumeric:hover,
body.highlight .nonNumeric:hover {
    outline-width: 4px;
}

.bottomPanel .nonNumeric,
body.highlight .bottomPanel .nonNumeric,
.bottomPanel .nonFraction,
body.highlight .bottomPanel .nonFraction {
    background-color: transparent;
    padding-left: 4px;
    padding-right: 4px;
    cursor: initial;
    outline-width: 3px;
}

.bottomPanel .nonNumeric *,
body.highlight .bottomPanel .nonNumeric *,
.bottomPanel .nonFraction *,
body.highlight .bottomPanel .nonFraction * {
    background-color: transparent;
}

.popup {
    position: absolute;
    border: 1px solid black;
    background-color: white;
    padding: 5px;
    font-family: sans-serif;
    font-size: 16px;
    z-index: 1000;
    border-radius: 5px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    max-width: 60ch;
    overflow-wrap: break-word;
    opacity: 0.9;
}

.popup details {
    margin-top: 5px;
}

.popup details summary {
    cursor: pointer;
}

.popup pre {
    margin: 0;
    white-space: pre-wrap;
    word-wrap: break-word;
    background-color: lightgray;
    font-size: 13px;
    padding: 4px;
}

.popup hr {
    border: 0;
    border-top: 1px solid #ccc;
}

.bottomPanel p,
.popup p {
    margin: 0;
}

.bottomPanelWrapper {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 20px;
}

.bottomPanel {
    display: flex;
    flex-flow: column nowrap;
    column-gap: 20px;
    row-gap: 10px;
    background-color: #111111;
    color: #F4F4F4;
    padding: 5px;
    font-family: sans-serif;
    font-size: 16px;
    z-index: 1000;
    border-radius: 5px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    opacity: 0.9;
}

.bottomPanelRow {
    display: flex;
    flex-flow: row wrap;
    column-gap: 20px;
    row-gap: 10px;
}

body {
    margin-bottom: 100px;
}

@media print {
    .bottomPanelWrapper {
        display: none;
    }

    .popup {
        display: none;
    }

    body.highlight nonFraction,
    body.highlight .nonFraction,
    body.highlight nonNumeric,
    body.highlight .nonNumeric {
        outline: none;
        background-color: inherit;
    }
}