* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; font-family: var(--ymd-font-family); color: var(--ymd-text-primary); background: var(--ymd-surface-page); line-height: 1.65; }
.bmi-page, .bmi-footer { max-width: 1040px; margin: auto; padding: var(--ymd-s-5); }
.bmi-page { padding-top: 92px; }
.bmi-intro { max-width: 760px; margin-bottom: var(--ymd-s-6); }
h1 { font-size: clamp(30px, 5vw, 44px); letter-spacing: -.025em; line-height: 1.15; margin: var(--ymd-s-3) 0; }
h2 { font-size: var(--ymd-t-section); line-height: 1.3; }
h3 { font-size: var(--ymd-t-card); }
a { color: var(--ymd-action-primary-active); text-underline-offset: 3px; }
.bmi-layout { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: var(--ymd-s-5); align-items: start; }
.bmi-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--ymd-s-4); }
fieldset { border: 0; padding: 0; margin: var(--ymd-s-4) 0; min-width: 0; }
legend { font-weight: 600; margin-bottom: var(--ymd-s-3); }
.bmi-note { font-size: var(--ymd-t-caption); color: var(--ymd-text-secondary); }
.bmi-number { display: block; font-size: 56px; line-height: 1.1; font-weight: 700; margin: var(--ymd-s-3) 0; }
.bmi-details { margin-top: var(--ymd-s-6); }
.bmi-table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; text-align: left; }
th, td { padding: var(--ymd-s-3); border-bottom: 1px solid var(--ymd-border-default); vertical-align: top; }
caption { text-align: left; margin-bottom: var(--ymd-s-3); color: var(--ymd-text-secondary); }
details { border-bottom: 1px solid var(--ymd-border-default); padding: var(--ymd-s-4) 0; }
summary { cursor: pointer; font-weight: 600; }
.bmi-footer { border-top: 1px solid var(--ymd-border-default); font-size: var(--ymd-t-caption); }
.bmi-footer a { margin-right: var(--ymd-s-4); }
:focus-visible { outline: 3px solid var(--ymd-focus-ring); outline-offset: 3px; }
.bmi-skip { position: absolute; left: var(--ymd-s-4); top: -100px; z-index: 10000; background: var(--ymd-surface-card); padding: var(--ymd-s-3); }
.bmi-skip:focus { top: var(--ymd-s-2); }
.bmi-page .ymd-field__control { width: 100%; min-height: 44px; }
.bmi-page .ymd-field__label { font-size: var(--ymd-t-caption); color: var(--ymd-text-secondary); }
@media(max-width: 720px) { .bmi-layout { grid-template-columns: 1fr; } .bmi-page, .bmi-footer { padding-left: var(--ymd-s-4); padding-right: var(--ymd-s-4); } }
