/* BMI-only styles */
.helper{color:#555}
fieldset{border:1px solid #e1e5ea;border-radius:8px;padding:10px 12px}
legend{padding:0 6px;font-weight:600;color:#2c3e50}
.row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:640px){.row{grid-template-columns:1fr}}
.hint{color:#b00020;font-size:13px;min-height:18px}
.actions{display:flex;gap:10px;flex-wrap:wrap}
.small{font-size:12px;color:#666}

/* Units toggle */
.toggle{position:relative;width:210px;height:36px;background:#e9edf2;border-radius:999px;padding:3px;display:flex;align-items:center;user-select:none}
.toggle .knob{position:absolute;top:3px;left:3px;width:102px;height:30px;background:#2c3e50;border-radius:999px;transition:left .18s}
.toggle span{flex:1;text-align:center;font-weight:700;color:#2c3e50;z-index:1}
.toggle[data-mode="metric"] .met{color:#fff}
.toggle[data-mode="imperial"] .imp{color:#fff}
.toggle[data-mode="imperial"] .knob{left:105px}

/* Result card + badges */
.result-card{border:1px solid #e1e5ea;border-radius:10px;padding:12px 14px;background:#fbfcfe;display:grid;gap:6px}
.result-main{font-weight:800;font-size:22px;color:#2c3e50}
.badge{display:inline-block;padding:4px 8px;border-radius:999px;font-weight:700;font-size:12px;color:#fff}
.badge.u{background:#5b9bd5}.badge.n{background:#2e7d32}.badge.o{background:#edb100}
.badge.ob1{background:#e67e22}.badge.ob2{background:#d84315}.badge.ob3{background:#b71c1c}

/* Scale + high-contrast ticker */
.scale-wrap{margin-top:8px}
.scale{position:relative;height:24px;border-radius:999px;overflow:hidden;border:1px solid #e1e5ea;background:#ddd}
.seg{position:absolute;top:0;bottom:0}
.seg.u{left:0;width:16.66%;background:#5b9bd5}
.seg.n{left:16.66%;width:16.66%;background:#2e7d32}
.seg.o{left:33.32%;width:16.66%;background:#edb100}
.seg.ob1{left:49.98%;width:16.66%;background:#e67e22}
.seg.ob2{left:66.64%;width:16.66%;background:#d84315}
.seg.ob3{left:83.3%;width:16.7%;background:#b71c1c}
.tick{position:absolute;top:100%;transform:translateX(-50%);font-size:11px;color:#666}
.scale-labels{display:flex;justify-content:space-between;font-size:12px;color:#444;margin-top:6px}
.pointer{position:absolute;top:-6px;transform:translateX(-50%)}
.pointer .stem{height:32px;width:0;border-left:4px solid #111;box-shadow:0 0 0 2px #fff}
.pointer .cap{width:12px;height:12px;background:#111;border-radius:50%;margin:-2px 0 0 -6px;box-shadow:0 0 0 2px #fff}