body>header a {
    color: #369;
    font-weight: bold;
    text-decoration: none;
}

body>header>nav>a {
    padding: 0 1ex 0 0;
}

body>main a {
    color: #06c;
}

#usage-tracking {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    overflow-x: auto;
}

#usage-listing {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    overflow-x: auto;
}

#usage-listing>img {
    margin: 0 1em;
}

#usage-listing>img:first-child {
    margin: 0 2ex 0 0;
}

.scroll-shadows {
    position: relative;
    --scroll-progress: 0;
}

.scroll-shadows::before,
.scroll-shadows::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    width: 0.75rem;
    pointer-events: none;
}

.scroll-shadows::before {
    left: 0;
    opacity: var(--scroll-progress);
    box-shadow: inset 15px 0px 5px -10px #ccc;
}

.scroll-shadows::after {
    right: 0;
    opacity: calc(1.0 - var(--scroll-progress));
    box-shadow: inset -15px 0px 5px -10px #ccc;
}