/**
 * The body map, styled where the module that draws it lives.
 *
 * `bodyDiagram.js` emits this markup, and two pages now mount it — the Summary
 * Overview and the Analysis "Disease & cancer" tab. Left in the Summary's own
 * stylesheet the list came out unstyled on the second page, and copying the
 * rules across would be two definitions of one component waiting to drift.
 *
 * The organ *colours* are not here: `paint()` writes them inline, because the
 * shade encodes how much variation each organ carries.
 */
.summary-ov-body {
    min-height: 200px;
}
.summary-ov-body svg {
    width: 100%;
    height: auto;
    max-height: 260px;
    display: block;
}
.summary-ov-body svg [id^="UBERON_"].is-on {
    cursor: help;
}
.summary-ov-organ {
    display: grid;
    grid-template-columns: minmax(3.5rem, 6rem) 1fr 3.2rem;
    align-items: center;
    gap: 0.5rem;
    padding: 0.12rem 0;
}
.summary-ov-organ-label {
    font-size: 0.76rem;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.summary-ov-organ-track {
    display: block;
    height: 0.6rem;
    border-radius: 0.3rem;
    background: rgba(var(--bs-secondary-rgb), 0.12);
    overflow: hidden;
}
.summary-ov-organ-track > span {
    display: block;
    height: 100%;
    border-radius: 0.3rem;
}
.summary-ov-organ-n {
    font-size: 0.74rem;
    text-align: right;
    font-variant-numeric: tabular-nums;
    color: var(--bs-secondary-color);
}
.summary-ov-organ-note {
    font-size: 0.68rem;
    color: var(--bs-secondary-color);
    margin: 0.5rem 0 0;
}