:root{font-family:system-ui,sans-serif;color:#1c2928;background:#f7f5ee;line-height:1.6}*{box-sizing:border-box}body{margin:0}main{max-width:900px;margin:auto;padding:24px}header{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}a{color:#075e56}.brand{font-weight:800;text-decoration:none}section{padding:40px 0;border-bottom:1px solid #b8c6bf}.hero{padding:70px 0}h1{font-size:clamp(2rem,5vw,3.6rem);line-height:1.12;max-width:800px}h2{line-height:1.25;font-size:1.8rem}.tag{font-size:.8rem;letter-spacing:.12em;font-weight:750;color:#075e56}p{max-width:760px}.button,button{display:inline-block;border:2px solid #075e56;background:#075e56;color:white;padding:12px 18px;border-radius:6px;font:inherit;font-weight:650;text-decoration:none;cursor:pointer}.secondary{background:transparent;color:#075e56}.actions{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0}textarea{display:block;width:100%;height:230px;padding:12px;border:2px solid #647a72;border-radius:6px;background:white;font:14px/1.5 monospace}label{font-weight:700}.small,footer{font-size:.88rem}footer{padding:32px 0}.result{padding:12px 16px;margin:12px 0;background:white;border-left:4px solid #a35413;overflow-wrap:anywhere}.good{border-color:#075e56}:focus-visible{outline:3px solid #ab4b00;outline-offset:4px}code{overflow-wrap:anywhere}

.source-sample{white-space:pre-wrap;overflow-wrap:anywhere} code{overflow-wrap:anywhere}