*{box-sizing:border-box}body{margin:0;font:16px/1.6 system-ui,sans-serif;background:#f5f3ec;color:#183a40}main{max-width:960px;margin:auto;padding:20px}nav{display:flex;flex-wrap:wrap;gap:4px 12px;margin-bottom:12px}a{color:#176354;text-underline-offset:3px}nav a{font-size:14px;display:flex;align-items:center;min-height:44px}h1{font-size:32px;line-height:1.15;margin:8px 0}h2{font-size:24px;line-height:1.3;margin:24px 0 12px}h3{font-size:18px}p{margin:10px 0}.independent{font-size:14px;line-height:1.5;margin-bottom:14px}.tool,.reverse{background:#fff;padding:20px;border:1px solid #cad7d0;border-radius:14px}.units{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}.fields{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}label{display:block;font-weight:600;font-size:14px}input,select{display:block;width:100%;min-height:44px;border:1px solid #839d99;border-radius:6px;padding:8px;font:16px/1.5 system-ui;background:white;color:#183a40;margin-top:4px}input:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid #176354;outline-offset:2px}.results{margin-top:16px;border-radius:10px;background:#123e43;color:#fff;padding:14px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.results span{font-size:14px}.results strong{display:block;font-size:32px;line-height:1.3;font-variant-numeric:tabular-nums}.results p{grid-column:1/-1;margin:0}.reverse{margin-top:20px}.reverse h2{margin-top:0}.reverse select{max-width:280px}.small{font-size:14px;color:#506763}#error{color:#a32222}#error:empty{display:none}article{max-width:760px;margin:28px auto}footer{padding:20px 0;border-top:1px solid #cad7d0}li{margin:10px 0} @media(max-width:560px){main{padding:12px}h1{font-size:24px}nav{gap:0 10px;margin-bottom:4px}nav a{font-size:12px;min-height:44px}.independent{font-size:13px;margin:8px 0 12px}.tool,.reverse{padding:12px}.fields{grid-template-columns:1fr 1fr;gap:8px 12px}.units{gap:12px;margin-bottom:8px}.results{grid-template-columns:1fr 1fr;padding:12px;margin-top:12px}.results>div:last-of-type{grid-column:1/-1;display:flex;align-items:baseline;gap:14px}.results strong{font-size:28px}.results span{font-size:13px}.results p{font-size:14px}h2{font-size:22px}}