
*{box-sizing:border-box}body{margin:0;background:#101b20;color:#f1efe2;font:17px/1.55 system-ui,sans-serif}main,header,footer{max-width:1080px;margin:auto;padding:24px clamp(18px,5vw,60px)}header{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #405254;color:#acbfba;font-size:14px}header b{font: bold 21px monospace;color:#e3f894}h1{font:600 clamp(34px,6vw,67px)/1.04 Georgia,serif;letter-spacing:-.035em;margin:28px 0 16px}p{max-width:70ch;color:#c2ccc8}.pair{display:grid;grid-template-columns:1fr 1fr;gap:14px}fieldset{min-width:0;margin:12px 0;padding:20px;border:1px solid #465957;border-radius:8px}legend{padding:0 5px;color:#dff398}input{font:26px monospace;background:#18272c;border:1px solid #66807a;color:white;width:100%;padding:10px;border-radius:4px}meter{display:block;width:100%;margin:14px 0}output{display:block}#result{background:#d9eba0;color:#18201b;padding:16px;border-radius:5px;font-weight:600}table{border-collapse:collapse;width:100%;max-width:680px}td,th{text-align:left;padding:8px;border-bottom:1px solid #384948}footer{color:#adbdb6}@media(max-width:580px){.pair{grid-template-columns:1fr}fieldset{margin:3px 0}header{gap:12px}}

button{font:inherit;background:#d9eba0;color:#18201b;border:0;border-radius:4px;padding:8px 14px;cursor:pointer;margin-top:12px}
.items{display:grid;gap:10px}.item{display:flex;align-items:center;gap:7px}.item button{margin:0;background:#324447;color:white}label{display:block}#result{font-variant-numeric:tabular-nums}
nav{display:flex;flex-wrap:wrap;gap:10px 24px;margin:22px 0 36px}nav a{color:#d9eba0;text-underline-offset:4px}h2{scroll-margin-top:20px}