.calc-box{background:var(--card);border-radius:14px;box-shadow:0 6px 28px rgba(29,75,90,.14);padding:1.4rem 1.25rem;margin:1.5rem 0 1rem}
.fields{display:grid;gap:1rem}
.field label{display:block;font-weight:600;font-size:.95rem;margin:0 0 .35rem;color:var(--ink)}
.field input{width:100%;font:500 1.1rem/1.2 "Inter",system-ui,sans-serif;padding:.8rem .9rem;border:2px solid #B9B2A6;border-radius:10px;background:var(--yellow);color:var(--ink);min-height:48px}
.field input:focus{border-color:var(--brand)}
.hint{color:var(--muted);font-size:.875rem;margin:.35rem 0 0}
.msg{color:#8A3B12;font-weight:600;margin:1rem 0 0;min-height:0}
.msg:empty{display:none}
.results{display:grid;gap:1rem;margin:1.25rem 0 .75rem}
.res{box-shadow:none;border:1px solid var(--line)}
.res.on{outline:2px solid var(--brand);border-color:transparent}
.res table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.res th,.res td{text-align:right;padding:.4rem .25rem;border-top:1px solid var(--line)}
.res thead th{border-top:0;color:var(--brand);font-weight:600}
.res tbody th{text-align:left;font-weight:500;color:var(--muted)}
.res tr.keep td{font-family:"Lora",Georgia,serif;font-size:1.35rem;font-weight:600;color:var(--brand)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.js #noscript-note{display:none}
@media (min-width:48rem){
 .fields{grid-template-columns:1fr 1fr}
 .results{grid-template-columns:1fr 1fr}
 .results.three{grid-template-columns:repeat(3,1fr)}
}
.bar .btn.small{margin-left:auto}
