/* bmi-calculator.css v2-r4 */

.bmi-form { display: grid; grid-template-columns: 1fr 1fr; gap: 0.8rem; margin-bottom: 0.9rem; }
@media (max-width:500px) { .bmi-form { grid-template-columns: 1fr; } }

.unit-toggle { display: inline-flex; border: 1px solid var(--border); margin-bottom: 1rem; }
.unit-btn { font-size: 0.74rem; padding: 0.4rem 0.9rem; border: none; border-right: 1px solid var(--border); background: #f9fafb; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.1em; cursor: pointer; }
.unit-btn:last-child { border-right: none; }
.unit-btn.active { background: var(--accent); color: #fff; }

.bmi-result { margin-top: 1rem; padding: 1rem 1.1rem; border: 1px solid var(--border); background: #f9fafb; display: none; }
.bmi-result.show { display: block; }
.bmi-score { font-size: 3rem; font-weight: 700; letter-spacing: -0.03em; line-height: 1; margin-bottom: 0.3rem; }
.bmi-category { font-size: 1rem; font-weight: 600; margin-bottom: 0.5rem; }
.bmi-bar-wrap { height: 8px; background: #e5e7eb; margin: 0.65rem 0; position: relative; }
.bmi-bar-fill { height: 100%; transition: width 0.3s; }
.bmi-ranges { display: flex; justify-content: space-between; font-size: 0.68rem; color: var(--text-muted); }
.bmi-note { font-size: 0.78rem; color: var(--text-muted); margin-top: 0.65rem; }

.cat-underweight { color: #2563eb; }
.cat-normal      { color: #16a34a; }
.cat-overweight  { color: #d97706; }
.cat-obese       { color: #dc2626; }
.fill-underweight { background: #2563eb; }
.fill-normal      { background: #16a34a; }
.fill-overweight  { background: #d97706; }
.fill-obese       { background: #dc2626; }