:root{color:#19312d;background:#f3f6f2;font-family:system-ui,sans-serif;font-size:16px}body{margin:0}header,main,footer{max-width:980px;margin:auto;padding:28px}header{padding-top:48px}small{letter-spacing:.12em;color:#34745e}h1{margin:12px 0;font-size:clamp(25px,4vw,38px)}h2{font-size:21px}p{color:#52655f;line-height:1.8}section{background:#fff;border:1px solid #dce5df;border-radius:16px;margin-bottom:22px;padding:24px}label{margin:18px 0 8px;font-weight:600;display:block}input,textarea,select{box-sizing:border-box;width:100%;font:inherit;border:1px solid #bccfc4;border-radius:8px;margin-top:8px;padding:12px;display:block}textarea{resize:vertical;font-family:monospace}button{color:#fff;font:inherit;cursor:pointer;background:#23664e;border:0;border-radius:8px;margin:8px 8px 0 0;padding:12px 18px}.secondary{color:#254c3d;background:#e7eee9}button:disabled{opacity:.5}pre{white-space:pre-wrap;overflow-wrap:anywhere}footer{color:#64786e;font-size:14px}[hidden]{display:none!important}input[type=file]{min-height:52px}button{min-height:44px}body{padding-bottom:env(safe-area-inset-bottom)}@media (width<=600px){header,main,footer{padding:16px}section{border-radius:12px;padding:18px}header{padding-top:28px}button{width:100%;margin:8px 0}textarea{font-size:16px}pre{font-size:13px}}nav{flex-wrap:wrap;gap:8px;margin-top:20px;display:flex}nav a{color:#23664e;background:#e7eee9;border-radius:8px;padding:12px 16px;text-decoration:none}nav a[aria-current=page]{color:#fff;background:#23664e}
