:root{--bg:#f4f7f6;--bg-grad:radial-gradient(1100px 520px at 12% -10%, #e3f2ee 0%, #f4f7f6 55%);--surface:#fff;--surface-2:#eef2f1;--surface-3:#e3e9e8;--border:#dde4e2;--border-strong:#c9d3d1;--text:#16211f;--text-dim:#566462;--text-mute:#8b9997;--accent:#0d9488;--accent-2:#0f766e;--accent-ink:#fff;--radius:16px;--radius-sm:10px;--shadow-sm:0 1px 2px #10201e0d;--shadow:0 8px 26px -10px #10201e33;--sans:"Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:var(--sans);color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased}button,input{font-family:inherit;font-size:inherit;color:inherit}h1,h2,p,dl,dd{margin:0}.app{background:var(--bg-grad);flex-direction:column;align-items:center;gap:22px;min-height:100%;padding:46px 20px 32px;display:flex}.hero{text-align:center;max-width:620px}.hero h1{letter-spacing:-.02em;font-size:30px;font-weight:800}.hero p{color:var(--text-dim);margin-top:10px;font-size:15px}.layout{grid-template-columns:.85fr 1.15fr;align-items:start;gap:20px;width:100%;max-width:940px;display:grid}.card,.result,.history{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:22px}.card{flex-direction:column;gap:18px;display:flex}.unit-toggle{background:var(--surface-2);border-radius:999px;grid-template-columns:1fr 1fr;gap:4px;padding:4px;display:grid}.unit-toggle__btn{color:var(--text-dim);cursor:pointer;background:0 0;border:none;border-radius:999px;flex-direction:column;align-items:center;gap:1px;padding:8px 10px;font-size:14px;font-weight:700;transition:background .15s,color .15s,box-shadow .15s;display:flex}.unit-toggle__btn.is-active{background:var(--surface);color:var(--accent-2);box-shadow:var(--shadow-sm)}.unit-toggle__hint{color:var(--text-mute);text-transform:uppercase;letter-spacing:.05em;font-size:10.5px;font-weight:600}.form{flex-direction:column;gap:14px;display:flex}.field{flex-direction:column;gap:7px;display:flex}.field__label{text-transform:uppercase;letter-spacing:.06em;color:var(--text-mute);font-size:11.5px;font-weight:700}.input-row{grid-template-columns:1fr 1fr;gap:10px;display:grid}.input-wrap{align-items:center;display:flex;position:relative}.input-wrap input{border:1.5px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--surface);font-variant-numeric:tabular-nums;outline:none;width:100%;padding:12px 46px 12px 14px;font-size:17px;font-weight:600;transition:border-color .15s,box-shadow .15s}.input-wrap input:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 20%, transparent)}.input-wrap__unit{color:var(--text-mute);pointer-events:none;font-size:13px;font-weight:700;position:absolute;right:13px}.actions{gap:10px;display:flex}.btn{border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--surface);cursor:pointer;flex:1;padding:11px 16px;font-weight:700;transition:background .15s,transform 50ms,opacity .15s}.btn:hover{background:var(--surface-2)}.btn:active{transform:translateY(1px)}.btn--primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.btn--primary:hover{background:var(--accent-2)}.btn--primary:disabled{opacity:.45;cursor:not-allowed}.btn--ghost{color:var(--text-dim);background:0 0;border-color:#0000;flex:none}.btn--sm{padding:6px 11px;font-size:13px}.result{flex-direction:column;gap:16px;display:flex}.result--empty{justify-content:center}.result__head{justify-content:space-between;align-items:flex-start;gap:14px;display:flex}.result__label{text-transform:uppercase;letter-spacing:.06em;color:var(--text-mute);font-size:11.5px;font-weight:700}.result__value{letter-spacing:-.03em;color:var(--accent,var(--text));font-variant-numeric:tabular-nums;font-size:52px;font-weight:800;line-height:1.05}.pill{color:#fff;background:var(--accent);white-space:nowrap;border-radius:999px;padding:7px 14px;font-size:13px;font-weight:800}.result__delta{color:var(--text-dim);font-size:14.5px;font-weight:600}.result__hint{text-align:center;color:var(--text-mute);font-size:14px}.gauge{width:100%;height:auto;display:block;overflow:visible}.gauge__divider{stroke:#ffffffd9;stroke-width:2px}.gauge__tick{fill:var(--text-mute);text-anchor:middle;font-size:11px;font-weight:700}.gauge__marker{transition:transform .4s cubic-bezier(.34,1.4,.64,1)}.gauge__marker polygon{fill:var(--text)}.gauge__marker line{stroke:var(--text);stroke-width:2.5px}.stats{border-top:1px solid var(--border);grid-template-columns:1fr auto;gap:10px 18px;padding-top:14px;display:grid}.stat{flex-direction:column;gap:2px;display:flex}.stat dt{text-transform:uppercase;letter-spacing:.05em;color:var(--text-mute);font-size:11px;font-weight:700}.stat dd{font-variant-numeric:tabular-nums;font-size:15px;font-weight:700}.history{width:100%;max-width:940px}.history__head{justify-content:space-between;align-items:center;margin-bottom:10px;display:flex}.history__title{text-transform:uppercase;letter-spacing:.06em;color:var(--text-mute);font-size:12px;font-weight:700}.history__empty{color:var(--text-mute);margin-top:8px;font-size:13.5px}.history__list{flex-direction:column;gap:2px;margin:0;padding:0;list-style:none;display:flex}.history__item{border-radius:var(--radius-sm);align-items:center;gap:12px;padding:10px 8px;display:flex}.history__item:hover{background:var(--surface-2)}.history__dot{border-radius:50%;flex-shrink:0;width:10px;height:10px}.history__bmi{font-variant-numeric:tabular-nums;min-width:46px;font-weight:800}.history__meta{color:var(--text-dim);flex:1;font-size:13.5px}.history__time{color:var(--text-mute);white-space:nowrap;font-size:12px}.history__remove{color:var(--text-mute);cursor:pointer;opacity:0;background:0 0;border:none;border-radius:6px;padding:4px 6px;transition:opacity .15s,color .15s}.history__item:hover .history__remove{opacity:1}.history__remove:hover{color:#dc2626}.foot{text-align:center;max-width:940px;color:var(--text-mute);padding:4px 8px 12px;font-size:12.5px;line-height:1.6}.foot strong{color:var(--text-dim)}@media (width<=820px){.layout{grid-template-columns:1fr}.app{padding:28px 16px}.result__value{font-size:44px}}