* { box-sizing: border-box; }
:root { --green:#176b40; --green-dark:#105b32; --border:#dfe8e1; --text:#26352b; --muted:#68756c; }
body { margin:0; padding:28px 14px; background:#f1f5f2; color:var(--text); font-family:Arial,Helvetica,sans-serif; font-size:15px; line-height:1.6; }
.calculator { width:100%; max-width:780px; margin:0 auto; padding:30px; background:#fff; border:1px solid #e1e9e3; border-radius:16px; box-shadow:0 8px 30px rgba(24,65,40,.09); }
.header { text-align:center; padding:8px 0 24px; margin-bottom:24px; border-bottom:2px solid #e4eee6; }
.brand { color:#16834a; font-size:13px; font-weight:800; letter-spacing:2px; }
h1 { color:var(--green); font-size:clamp(24px,4vw,32px); line-height:1.25; margin:12px 0 8px; }
.header p { margin:0; color:#748077; font-size:14px; }
.notice { padding:15px 18px; margin-bottom:24px; background:#edf8f0; border-left:4px solid #21864e; border-radius:8px; color:#315b40; }
.section { padding:24px; margin-bottom:22px; border:1px solid var(--border); border-radius:12px; background:#fff; }
.section h2,.results h2 { color:var(--green); font-size:20px; margin:0 0 18px; padding-bottom:12px; border-bottom:1px solid #e7eee8; }
.field { margin:0 0 16px; }
label { display:block; margin:0 0 7px; color:#304438; font-size:14px; font-weight:700; }
input,select { display:block; width:100%; min-height:46px; padding:11px 13px; border:1px solid #cbd8ce; border-radius:7px; background:#fff; color:var(--text); font:inherit; }
input:focus,select:focus { outline:none; border-color:#21864e; box-shadow:0 0 0 3px rgba(33,134,78,.12); }
.helper { color:var(--muted); font-size:13px; line-height:1.7; margin:8px 0 0; }
.result-row { display:flex; justify-content:space-between; align-items:flex-start; gap:18px; padding:13px 0; border-bottom:1px solid #e8eee9; font-size:14px; }
.result-row span { flex:1; min-width:0; }
.result-row strong { flex:0 0 auto; max-width:48%; text-align:right; overflow-wrap:anywhere; color:var(--green); }
button { display:block; width:100%; min-height:48px; padding:13px 18px; margin:12px 0; border:0; border-radius:8px; background:#187443; color:#fff; font:inherit; font-size:16px; font-weight:700; cursor:pointer; }
button:hover { background:var(--green-dark); }
.reset-button { background:#e8eee9; color:#304438; margin-bottom:22px; }
.reset-button:hover { background:#d8e3db; }
.results { margin-top:24px; padding:24px; border:2px solid #d5e8da; border-radius:12px; background:#fbfdfb; }
.results[hidden] { display:none; }
.final-row { margin-top:14px; padding:17px; border:0; border-radius:8px; background:#e6f5e9; font-size:15px; font-weight:700; }
.final-row strong { color:#125b32; }
.disclaimer { margin:20px 0 0; color:var(--muted); font-size:12px; line-height:1.8; }
footer { margin-top:26px; padding-top:18px; border-top:1px solid #e4ece6; text-align:center; color:#778279; font-size:12px; }
@media(max-width:600px) { body{padding:12px 8px;} .calculator{padding:16px;border-radius:12px;} .section,.results{padding:16px;margin-bottom:16px;} .section h2,.results h2{font-size:18px;} .result-row{gap:10px;font-size:13px;} .result-row strong{max-width:46%;} }