#bmi-calculator{ max-width: var(--max-width); margin: 0 auto; padding: 32px 16px 80px; color: var(--text-main); }

.bmi-headline{ text-align: center; margin: 0 0 14px; padding: 18px; border-radius: 16px; background: rgba(var(--surface-rgb),0.96); border: 1px solid rgba(var(--heading-rgb),0.06); }

.bmi-value{ display: block; font-size: clamp(2rem, 5vw, 2.6rem); font-weight: 800; color: var(--point); line-height: 1.1; letter-spacing: -0.02em; }

.bmi-category{ display: inline-block; margin-top: 10px; padding: 6px 14px; border-radius: 999px; font-weight: 700; font-size: 0.95rem; background: rgba(var(--blue-rgb),0.08); color: var(--blue); }

.result-grid{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 16px; }

.bmi-table-wrap{ margin-top: 14px; overflow-x: auto; border-radius: 14px; border: 1px solid rgba(var(--heading-rgb),0.06); background: var(--surface); }

.bmi-table{ width: 100%; border-collapse: collapse; min-width: 420px; }

.bmi-table th, .bmi-table td{ padding: 10px 12px; border-bottom: 1px solid rgba(var(--heading-rgb),0.06); text-align: center; font-size: 0.95rem; }

.bmi-table th{ background: var(--skel-b); color: var(--heading); font-weight: 700; }

.bmi-table tr.current{ background: rgba(var(--point-rgb),0.06); font-weight: 700; }

@media (max-width: 768px){
    
    #bmi-calculator{ padding: 20px 12px 60px; }
    
    
  }

@media (max-width: 640px){
    .result-grid{ grid-template-columns: 1fr; }
    .result-value{ font-size: 1rem; }
  }