:root{color-scheme:light dark;--paper:#f5f4ef;--ink:#172b31;--line:#b7c8c6;--accent:#165f57;--surface:#fff}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.65 system-ui,sans-serif}main{max-width:1000px;margin:auto;padding:40px 24px}header{padding:24px 0 36px;border-bottom:2px solid var(--ink)}h1{font-size:clamp(30px,5vw,50px);line-height:1.2;max-width:740px}h2{font-size:24px;margin-top:0}.eyebrow{font-size:13px;letter-spacing:.18em;font-weight:700;color:var(--accent)}section{padding:28px;background:var(--surface);border:1px solid var(--line);margin:24px 0;border-radius:12px}label{display:block;font-weight:600;margin:12px 0 6px}input,select,button{font:inherit;border:1px solid var(--line);border-radius:6px;min-height:46px;padding:9px 12px}input,select{display:block;width:100%;background:var(--paper);color:var(--ink)}button{cursor:pointer;background:var(--accent);color:white;margin:10px 8px 0 0}button:disabled{opacity:.6;cursor:wait}button:focus-visible,input:focus-visible,a:focus-visible,pre:focus-visible{outline:3px solid #eaa42f;outline-offset:3px}.grid{display:grid;grid-template-columns:1fr 1fr;gap:8px 24px}.toolbar{display:flex;align-items:center;gap:18px;flex-wrap:wrap}a{color:var(--accent)}pre{white-space:pre-wrap;overflow-wrap:anywhere;background:var(--paper);padding:16px;border-radius:6px;font-size:14px}footer{border-top:1px solid var(--line);padding:24px 0;font-size:14px}p{max-width:76ch}[hidden]{display:none!important}@media(max-width:600px){main{padding:20px 14px}section{padding:20px}.grid{grid-template-columns:1fr}}@media(prefers-color-scheme:dark){:root{--paper:#101c22;--surface:#182a31;--ink:#e5efef;--line:#547374;--accent:#82cfc0}button{color:#102326}}@media(prefers-reduced-motion:no-preference){button{transition:opacity .15s}}