:root{--ink:#142b70;--accent:#5477c5;--surface:#f7f9fd;--ease:cubic-bezier(.22,1,.36,1)}
body{background:radial-gradient(ellipse at 75% 8%,#eaf0ff88,transparent 45%),var(--surface)}
.header{height:88px}.intro{padding-top:43px}.brand-icon i{transition:height .3s var(--ease)}.brand:hover .brand-icon i:first-child{height:20px}.brand:hover .brand-icon i:last-child{height:12px}
.language-menu{position:relative;z-index:20}.language-menu summary{display:flex;align-items:center;gap:10px;min-height:43px;list-style:none;border:1px solid var(--line);border-radius:24px;padding:0 15px;background:#fff;font-size:12px;cursor:pointer;transition:background .2s,border-color .2s}.language-menu summary::-webkit-details-marker{display:none}.language-menu summary svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}.language-menu summary .chevron{width:13px;height:13px;transition:transform .25s var(--ease);color:var(--muted)}.language-menu[open] .chevron{transform:rotate(180deg)}.language-menu[open] summary{background:#edf2fc;border-color:#aabce2}.language-options{position:absolute;right:0;top:53px;min-width:200px;border:1px solid var(--line);border-radius:16px;background:#fff;padding:7px;box-shadow:0 18px 45px -20px #142b7050;display:grid;gap:3px;animation:arrive .2s var(--ease)}.language-options button{display:flex;align-items:center;justify-content:space-between;gap:24px;border:0;border-radius:9px;background:transparent;padding:11px 12px;text-align:left;font-size:13px;min-height:42px}.language-options button span{font:10px Consolas,monospace;color:var(--muted)}.language-options button:hover,.language-options button[aria-pressed=true]{background:#edf2fc;color:#173a94}
.input-card{border-radius:23px;padding:29px;box-shadow:0 12px 32px -28px #142b7050}.step{border-radius:11px;background:#f2f5fb;width:38px;height:38px}.units{border-radius:12px;padding:5px}.units button{border-radius:8px;transition:color .2s,background .2s,box-shadow .2s}.units button[aria-pressed=true]{color:white;background:#142b70;border-color:#142b70;box-shadow:0 5px 15px -9px #142b70}.input-shell{border-radius:12px}.input-shell input{padding:15px 17px;font-size:28px}.field{font-size:13px}.measurement-control{display:flex;align-items:center;gap:12px;margin-top:10px}.measurement-control button{display:grid;place-items:center;border:1px solid var(--line);background:#f6f8fd;border-radius:9px;width:34px;height:32px;font-size:20px;flex:none;transition:color .2s,background .2s,transform .2s}.measurement-control button:hover:not(:disabled){background:#173a94;color:white}.measurement-control button:disabled{opacity:.4}.measurement-control input{min-width:0;flex:1;appearance:none;background:linear-gradient(90deg,#607dc0 var(--fill,50%),#e3e9f4 var(--fill,50%));height:5px;border-radius:10px;cursor:pointer;accent-color:#173a94}.measurement-control input::-webkit-slider-thumb{appearance:none;width:17px;height:17px;border:3px solid white;background:#173a94;border-radius:50%;box-shadow:0 0 0 1px #829aca}.measurement-control input::-moz-range-thumb{width:12px;height:12px;border:3px solid white;background:#173a94;border-radius:50%;box-shadow:0 0 0 1px #829aca}input[type=range]:focus-visible{outline:2px solid #7899df;outline-offset:8px}.field-support{padding-top:8px;min-height:34px}.live-setting{display:flex;gap:10px;align-items:flex-start;background:#f6f8fd;border:1px solid var(--line);border-radius:11px;padding:12px;margin:5px 0 17px;cursor:pointer}.live-setting input{appearance:none;flex:none;width:30px;height:18px;margin:2px 0 0;border-radius:20px;background:#cbd4e6;position:relative;transition:background .2s;cursor:pointer}.live-setting input::after{content:"";position:absolute;width:12px;height:12px;left:3px;top:3px;background:white;border-radius:50%;transition:transform .2s}.live-setting input:checked{background:#244891}.live-setting input:checked::after{transform:translateX(12px)}.live-setting input:focus-visible{outline:2px solid #7899df;outline-offset:4px}.live-setting strong{display:block;font-size:11px;font-weight:600}.live-setting small{display:block;font-size:10px;color:var(--muted);line-height:1.5;margin-top:3px}.primary{border-radius:11px;min-height:50px}.primary>span:last-child{transition:transform .2s}.primary:hover>span:last-child{transform:translate(2px,-2px)}
.result-card{border-radius:23px;background:radial-gradient(ellipse at 50% 15%,#f2f5fe,#e5ebf8);padding:27px;scroll-margin-top:20px}.result-top{margin-bottom:22px}#result,.empty-result{border-radius:19px;box-shadow:0 22px 42px -29px #20387266;min-height:430px;padding:29px 27px}.result-number>span:first-child{font-size:clamp(80px,8vw,115px);letter-spacing:-6px}.result-number{margin-top:12px}.category{padding:8px 13px}.scale-wrap{margin:32px 0 19px}.scale{height:8px}.marker{width:18px;height:18px;box-shadow:0 0 0 1px #142b70,0 3px 10px #142b7030;pointer-events:none;z-index:1}.scale:focus-within .marker{box-shadow:0 0 0 1px #142b70,0 0 0 7px #7294d52b}#bmi-range{position:absolute;inset:-18px -9px auto;width:calc(100% + 18px);height:44px;appearance:none;background:transparent;cursor:ew-resize;opacity:0;z-index:2;margin:0}#bmi-range::-webkit-slider-thumb{appearance:none;width:18px;height:30px;background:transparent}#bmi-range::-moz-range-thumb{width:18px;height:30px;background:transparent;border:0}.scale-interaction{width:100%;text-align:left;padding:13px 14px;margin:0 0 23px;border:1px solid #e3e9f5;background:#f8faff;border-radius:11px}.scale-interaction label{display:block;font-size:11px;font-weight:600;color:#385791}.scale-interaction p{font-size:10px;line-height:1.6;color:var(--muted);margin:5px 0 0}.scale-interaction button{margin-top:10px;padding:7px 11px;background:white;border:1px solid #cfdcf2;border-radius:7px;font-size:10px;color:#22498e}.scale-interaction button:hover{background:#173a94;color:white}.result-details{padding-top:20px}.result-details strong{font-size:18px}.rounding-note{font-size:9px}.example-label{border:1px solid #bac9e7;padding:5px 8px;border-radius:6px;font-size:7px;line-height:1.5;background:#ffffff55}.result-bottom{padding-top:20px;flex-wrap:wrap}.result-bottom button{min-height:35px}.categories article{border-radius:14px;transition:background .25s,border-color .25s,box-shadow .25s,transform .25s}.categories article[data-active=true]{background:#142b70;border-color:#142b70;box-shadow:0 12px 24px -18px #142b7066}.categories article[data-active=true] h3{color:white}.categories article[data-active=true] p{color:#c8d8fa}.categories article[data-active=true] .category-line{background:#b2c9ff;width:38px}.category-line{transition:width .3s,background .3s}.method{background:#ffffff66;border-radius:12px;padding-inline:18px}.intro,.input-card,.result-card{animation:arrive .55s var(--ease) both}.input-card{animation-delay:.05s}.result-card{animation-delay:.1s}.toast{animation:arrive .2s var(--ease)}
@keyframes arrive{from{opacity:0;translate:0 10px}to{opacity:1;translate:0 0}}
@media(hover:hover){.categories article:hover{transform:translateY(-3px);border-color:#8ba4d5}.language-menu summary:hover{border-color:#9bb0d9}}
@media(max-width:960px){.input-card{padding:24px}.result-card{padding:22px}#result,.empty-result{padding:25px 20px}.result-details strong{font-size:15px}.result-number>span:first-child{font-size:83px}}
@media(max-width:700px){.header{height:78px}.language-menu summary{min-height:40px;padding:0 12px;gap:8px;font-size:11px}.intro{padding-top:36px}.input-card{padding:24px}.result-card{padding:22px}.result-number>span:first-child{font-size:98px}.result-top .eyebrow{font-size:8px}.result-details strong{font-size:17px}.categories article{padding:20px}.scale-interaction{padding:12px}.result-bottom{gap:5px}.language-options{min-width:185px;top:49px}}
@media(max-width:370px){.input-card{padding:20px}.result-card{padding:16px}#result,.empty-result{padding-inline:16px}.result-number>span:first-child{font-size:80px}.result-details strong{font-size:15px}.result-top .eyebrow{letter-spacing:1px}.example-label{font-size:6px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.categories article:hover{transform:none}}
@media print{.scale-interaction,#bmi-range,.language-menu{display:none}.intro,.input-card,.result-card{animation:none}}