.bmi-page{background:radial-gradient(ellipse at 8% 55%,#eae8ff80,transparent 45%),#f7f9fc;padding:48px 24px 56px;color:#17243c}
.bmi-shell{max-width:1120px;margin:auto;--bmi-accent:#13ad91;--bmi-purple:#6555e8}
.bmi-shell [hidden]{display:none!important}
.bmi-heading{text-align:center;margin-bottom:38px}
.bmi-eyebrow{display:inline-block;color:#6555e8;background:#eceaff;border-radius:20px;padding:5px 14px;font-size:11px;font-weight:700;letter-spacing:.12em}
.bmi-heading h1{font-size:38px;line-height:1.3;margin:12px 0 8px;color:#101d34}
.bmi-heading p{color:#687b98;margin:0;line-height:1.7}
.bmi-layout{display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:28px;direction:ltr;align-items:stretch}
.bmi-card{background:#fff;border:1px solid #edf0f7;border-radius:24px;padding:28px;box-shadow:0 16px 32px #243b5910,0 4px 8px #243b5908;min-width:0}
.bmi-visual{display:flex;flex-direction:column;color:var(--bmi-accent)}
.bmi-visual-heading{display:flex;gap:8px;align-items:center;font-size:10px;font-weight:700;letter-spacing:.08em;color:#7c8ca7;padding-bottom:20px;border-bottom:1px solid #edf0f7}
.bmi-dot{width:8px;height:8px;background:#7764ee;border-radius:50%}
.bmi-live{margin-inline-start:auto;color:#6555e8;background:#f1efff;padding:4px 8px;border-radius:4px}
.bmi-figure-stage{background:linear-gradient(135deg,#d1d5da,#c9cfd3);border:2px solid #e2e5e9;border-radius:20px;margin:26px 22px 10px;overflow:hidden;flex:1;display:flex;align-items:center;justify-content:center}
.bmi-figure-stage svg{display:block;width:100%;max-height:430px}
.bmi-body{transform-origin:160px 230px;transition:transform .25s ease}
.bmi-shell[data-body-type="female"] .bmi-male-shape,.bmi-shell[data-body-type="male"] .bmi-female-shape{display:none}
.bmi-sex-switch{display:flex;background:#f1f4f9;padding:4px;border-radius:12px;gap:4px}
.bmi-sex-switch button{background:transparent;color:#697a96}
.bmi-sex-switch button[aria-pressed="true"]{background:#9265cb;color:#fff;box-shadow:0 3px 7px #9265cb2b}
.bmi-sex-switch button span:first-child{font-size:15px}
.bmi-sex-note{font-size:11px;color:#71819b;line-height:1.6;margin:-12px 0 22px}
.bmi-illustration-note{text-align:center;font-size:12px;color:#7c8ca7;margin:0 0 20px}
.bmi-stat-pair{display:grid;grid-template-columns:1fr 1fr;gap:12px;border-top:1px solid #edf0f7;padding-top:18px}
.bmi-stat-pair>div{background:#f7f9fc;border:1px solid #edf0f7;border-radius:12px;padding:12px;color:#7c8ca7;font-size:12px}
.bmi-stat-pair strong{display:block;color:#24324a;font-size:17px;margin-top:5px}
.bmi-controls-top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:28px}
.bmi-adult-label{color:#697a96;font-size:12px;font-weight:600}
.bmi-unit-switch{display:flex;background:#f1f4f9;padding:4px;border-radius:12px;gap:4px}
.bmi-shell button{font-family:inherit;font-size:12px;font-weight:600;line-height:1.4;cursor:pointer;border:0;border-radius:9px;padding:11px 12px;transition:background .2s}
.bmi-unit-switch button{background:transparent;color:#697a96}
.bmi-unit-switch button[aria-pressed="true"]{background:var(--bmi-purple);color:#fff;box-shadow:0 3px 7px #6555e82b}
.bmi-shell :is(button,input):focus-visible{outline:3px solid #6555e8;outline-offset:3px}
.bmi-field{margin-bottom:22px}
.bmi-field-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}
.bmi-field label{font-size:12px;color:#697a96;font-weight:700;letter-spacing:.06em}
.bmi-number-wrap{display:flex;align-items:center;gap:6px;direction:ltr;color:#8293ad;font-size:11px}
.bmi-shell .bmi-number-wrap input{width:85px;padding:6px 8px;border:1px solid #e3e8f1;border-radius:7px;color:#17243c;background:#fbfcff;text-align:right;font-size:14px;font-weight:600;line-height:1.4}
.bmi-shell input[aria-invalid="true"]{border-color:#bd3f52;background:#fff4f4}
.bmi-shell input[type="range"]{display:block;width:100%;height:6px;padding:0;margin:14px 0;cursor:pointer;accent-color:var(--bmi-purple);direction:ltr;appearance:none;border:0;border-radius:10px;background:linear-gradient(to right,var(--bmi-purple) var(--range-progress,0%),var(--range-track,#edf1f7) var(--range-progress,0%))}
.bmi-shell input[type="range"]::-webkit-slider-thumb{appearance:none;width:15px;height:15px;border:0;border-radius:50%;background:var(--bmi-purple)}
.bmi-shell input[type="range"]::-moz-range-thumb{width:15px;height:15px;border:0;border-radius:50%;background:var(--bmi-purple)}
.bmi-height-detail{display:block;text-align:end;min-height:16px;font-size:11px;color:#8293ad}
.bmi-result{display:grid;grid-template-columns:150px minmax(0,1fr);gap:24px;align-items:center;border-top:1px solid #edf0f7;padding-top:26px;margin-top:24px}
.bmi-result-ring{width:150px;height:150px;padding:7px;background:conic-gradient(var(--bmi-accent) var(--bmi-progress,56%),#e9eef4 0);border-radius:50%;box-shadow:0 0 0 6px #f6f8fb;direction:ltr}
.bmi-result-ring>div{height:100%;border-radius:50%;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:8px}
.bmi-result-ring span{font-size:10px;color:#8192ab;line-height:1.5}
.bmi-result-ring strong{font:700 33px/1.4 Arial,sans-serif;color:#16233c}
.bmi-result-ring [data-bmi-category]{color:var(--bmi-accent);font-size:11px;font-weight:700}
.bmi-result-copy h2{font-size:12px;line-height:1.6;color:#7c8ca7;margin:0 0 8px}
.bmi-result-copy p{font-size:12px;color:#6a7c97;line-height:1.6;margin:0 0 12px}
.bmi-result-copy .bmi-weight-range{font-size:18px;font-weight:700;color:#17243c;text-align:start}
.bmi-result-copy .bmi-result-note{padding:12px;background:#f6f6ff;border:1px solid #eae9ff;border-radius:10px;color:#485674;margin:0}
.bmi-scale{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:3px;height:7px;margin-top:24px;direction:ltr}
.bmi-scale span{border-radius:3px;background:#62a6d4}.bmi-scale span:nth-child(2){background:#13ad91}.bmi-scale span:nth-child(3){background:#df9a37}.bmi-scale span:nth-child(4){background:#c86676}
.bmi-scale i{position:absolute;left:var(--bmi-marker,40%);top:-5px;width:3px;height:17px;background:#17243c;border:1px solid #fff;border-radius:2px}
.bmi-scale-labels{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;direction:ltr;margin-top:9px;color:#7c8ca7;font-size:9px;text-align:center}
.bmi-actions{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px;border-top:1px solid #edf0f7;margin-top:24px;padding-top:20px}
.bmi-actions>span{font-size:10px;color:#8293ad}.bmi-actions>div{display:flex;gap:8px}
.bmi-shell .bmi-reset{background:#f1f4f9;color:#53647e}.bmi-shell .bmi-download{background:var(--bmi-purple);color:#fff}.bmi-shell .bmi-download:hover{background:#5142d1}.bmi-shell button:disabled{opacity:.45;cursor:not-allowed}
.bmi-error{color:#a42f43;background:#fff2f4;border:1px solid #f3d0d7;border-radius:8px;padding:12px;font-size:13px}
.bmi-explanation{max-width:920px;margin:28px auto 0;text-align:center;font-size:12px;color:#71819b;line-height:1.8}.bmi-explanation p{margin:0 0 6px}.bmi-explanation a{color:#6555e8;text-decoration:underline}
.bmi-home-callout{max-width:1140px;margin:48px auto;padding:32px;background:#f4f3ff;border:1px solid #e6e3ff;border-radius:16px;display:flex;align-items:center;justify-content:space-between;gap:24px}.bmi-home-callout h2{font-size:28px;color:#17243c;margin:0 0 8px}.bmi-home-callout p{margin:0;color:#687b98}.bmi-home-callout a{flex-shrink:0;background:#6555e8;color:#fff;border-radius:8px;padding:13px 24px;text-decoration:none}.bmi-home-callout a:hover{background:#5142d1}
html[dir="rtl"] :is(.bmi-controls,.bmi-visual){direction:rtl}html[dir="rtl"] .bmi-shell :is(h1,h2,button,input){font-family:Tahoma,Arial,sans-serif}html[dir="rtl"] .bmi-eyebrow,html[dir="rtl"] .bmi-field label{letter-spacing:0}
@media(max-width:900px){.bmi-layout{grid-template-columns:minmax(0,.65fr) minmax(0,1fr);gap:18px}.bmi-card{padding:20px}.bmi-result{grid-template-columns:minmax(0,1fr);justify-items:center}.bmi-result-copy{width:100%}.bmi-figure-stage{margin-inline:0}.bmi-home-callout{margin:32px 16px}}
@media(max-width:650px){.bmi-page{padding:32px 16px}.bmi-heading h1{font-size:30px}.bmi-layout{grid-template-columns:minmax(0,1fr)}.bmi-controls{grid-row:1}.bmi-figure-stage svg{max-height:300px}.bmi-figure-stage{margin-top:18px}.bmi-heading{margin-bottom:24px}.bmi-controls-top{justify-content:center}.bmi-unit-switch{width:100%}.bmi-unit-switch button{flex:1}.bmi-result{grid-template-columns:130px minmax(0,1fr);gap:16px}.bmi-result-ring{width:130px;height:130px}.bmi-actions>div{width:100%}.bmi-actions button{flex:1}.bmi-home-callout{flex-direction:column;align-items:stretch;text-align:center;padding:24px}.bmi-home-callout h2{font-size:25px}}
@media(max-width:390px){.bmi-result{grid-template-columns:minmax(0,1fr)}}
@media(prefers-reduced-motion:reduce){.bmi-body,.bmi-shell button{transition:none}}
