
.np-wrapper { max-width: 720px; margin: 1rem auto; padding: 0.6rem; font-size:12pt; font-family: inherit; text-align:center; }
.np-intro { font-weight:600; margin-bottom:1.8rem; text-align:center; border:1px solid #ddd; padding:0.4rem 0.6rem; border-radius:4px; background:none; box-shadow:none; display:inline-block; }
.np-form { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; align-items: end; margin-bottom:0.6rem; text-align:left; }
.np-row { display:flex; flex-direction:column; }
.np-row label { font-weight:600; margin-bottom:0.25rem; font-size:0.9em; }
.np-row input { padding:0.4rem; border:1px solid #ccc; border-radius:4px; font-size:0.95em; }
.np-actions { grid-column:1/-1; display:flex; justify-content:center; gap:0.6rem; margin-top:0.4rem; margin-bottom:0.6rem; }
.np-btn { padding:0.45rem 0.9rem; border-radius:4px; border:1px solid rgba(0,0,0,0.08); font-weight:600; cursor:pointer; font-size:0.95em; min-width:100px; }
.np-btn-calc { background:#1d2d06; color:#fff; }
.np-btn-calc:hover { opacity:0.95; }
.np-btn-reset { background:#f8f8f8; border:1px solid #bbb; color:#222; }
.np-pre-result { margin-top:0.8rem; margin-bottom:0.4rem; font-weight:600; text-align:center; }
.np-result { margin-top:0.6rem; padding:1rem; border:1px solid #e6e6e6; border-radius:6px; background:#fff; line-height:1.6; text-align:justify; font-size:0.92em; }
.np-result h2 { font-size:1.1em; margin-top:0; text-align:left; }

@media (max-width:720px) {
  .np-form { grid-template-columns: 1fr; }
  .np-actions { flex-direction:column; }
  .np-wrapper { font-size:11pt; }
  .np-result { font-size:0.88em; padding:0.8rem; }
  .np-intro { font-size:0.95em; }
}
