:root{color-scheme:light;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#153f3d;background:#eef8f1}
*{box-sizing:border-box}
body{margin:0;padding:32px 18px;line-height:1.65}
main{max-width:700px;margin:auto;background:#fffef7;border:1px solid #c7ded5;border-radius:24px;padding:clamp(22px,5vw,44px);box-shadow:0 12px 35px #174c4310}
.eyebrow{color:#426b58;letter-spacing:.08em;text-transform:uppercase;font-size:.76rem;font-weight:700}
h1{font-size:clamp(1.65rem,4vw,2.45rem);line-height:1.2;margin:.8rem 0 1rem;letter-spacing:-.035em}
h2{font-size:1.15rem;line-height:1.4;margin:0 0 .6rem}
form{margin:24px 0}
label{display:block;font-weight:700;margin-top:18px}
label span{display:block;font-size:.86rem;font-weight:400;color:#49605c}
input{display:block;width:100%;font:inherit;font-size:1.15rem;padding:12px 14px;margin:7px 0 18px;border:2px solid #77978d;border-radius:10px;background:white;color:#123b38}
input:focus,button:focus-visible{outline:3px solid #c8e853;outline-offset:3px}
.result{padding:22px;background:#123f3c;color:#fffef6;border-radius:16px;margin:24px 0 14px}
.result>span{font-size:.86rem;color:#d2e3d8}
output{display:block;font-weight:800;font-size:clamp(2rem,6vw,3rem);line-height:1.3;overflow-wrap:anywhere}
#feedback{margin:10px 0 0;font-size:.92rem}
button{font:inherit;font-weight:700;border:2px solid #123f3c;background:#d3ee73;color:#123f3c;border-radius:10px;padding:11px 16px;cursor:pointer}
section{padding-top:20px;border-top:1px solid #c7ded5}
.footnote{font-size:.82rem;color:#49605c;margin-top:24px}