/* Shared by Portal and BackOffice. Heights may be customized by the containing graph. */
.measurement-single, .measurement-value {
    display: inline-grid;
    place-items: center;
    box-sizing: border-box;
    width: 40px;
    height: 25px;
    padding: 0;
    border-radius: 0;
    font-size: 14px;
    line-height: 15px;
    font-weight: 700;
    white-space: nowrap;
    vertical-align: middle;
}
.measurement-single { border: 1px solid black; }
.measurement-value { border: 0; }
.measurement-bar {
    display: flex;
    width: 100%;
    min-width: 120px;
    height: var(--measurement-bar-height, 17px);
    border-radius: 0;
    box-sizing: border-box;
    font-size: 14px;
    font-weight: 700;
}
.measurement-bar > .measurement-segment {
    flex: var(--measurement-weight, 0) 1 0px;
    min-width: 40px;
    display: grid;
    place-items: center;
    box-sizing: border-box;
    border: 0;
    border-radius: 0;
    white-space: nowrap;
}
.measurement-low { background: blue; color: white; }
.measurement-good { background: green; color: white; }
.measurement-high { background: red; color: white; }
.measurement-violet { background: violet; color: black; }
.measurement-fatigue { background: yellow; color: black; }

/* Wide single result: retain the shared height and typography. */
.measurement-single-large { width: 200px; border: 0; }
