/* bmi-calculator: styles only it uses, split out of site.css by scripts/split-css.mjs. */
.result-tag {
    display: inline-block; vertical-align: middle; font: 600 0.82rem var(--text); letter-spacing: 0;
    padding: 4px 10px; border-radius: 999px; background: rgb(255 255 255 / 0.1); color: #fff;
}
.result-tag.tag-ok { background: rgb(79 214 168 / 0.18); color: #7BE7C2; }
.result-tag.tag-warn { background: rgb(255 200 87 / 0.18); color: #FFD583; }
.result-tag.tag-bad { background: rgb(255 122 102 / 0.2); color: #FFA597; }
.scale-bar { display: flex; height: 10px; border-radius: 999px; overflow: hidden; gap: 2px; }
.scale-under, .scale-over { background: var(--c4); }
.scale-ok { background: var(--c3); }
.scale-obese { background: #FF7A66; }
.scale-marker {
    position: absolute; top: -5px; width: 6px; height: 20px; margin-left: -3px;
    background: #fff; border-radius: 3px; box-shadow: 0 0 0 2px var(--ink); transition: left 0.25s ease;
}
.scale-labels { position: relative; height: 1.4em; margin-top: 6px; font-size: 0.78rem; color: #A9B5CB; font-variant-numeric: tabular-nums; }
.scale-labels span { position: absolute; transform: translateX(-50%); }
.scale-labels span:nth-child(1) { left: 0; transform: none; }
.scale-labels span:nth-child(2) { left: 14%; }
.scale-labels span:nth-child(3) { left: 40%; }
.scale-labels span:nth-child(4) { left: 60%; }
.scale-labels span:nth-child(5) { right: 0; transform: none; }