:root{--paper:#f2f4f1;--ink:#14302e;--soft:#4f6563;--line:#cfd8d3;--accent:#0d6b63;--ok:#1d7a46;--warn:#a86a00;--bad:#b3261e}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.6 system-ui,-apple-system,"Segoe UI",sans-serif}
header,main,footer{max-width:760px;margin:0 auto;padding:0 20px}
header{display:flex;flex-wrap:wrap;gap:8px 24px;align-items:baseline;padding-top:22px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.brand{font:700 1.15rem Georgia,serif;color:var(--ink);text-decoration:none}
nav{display:flex;flex-wrap:wrap;gap:4px 16px;font-size:.9rem}
nav a{color:var(--accent)}
h1{font:700 2.2rem/1.15 Georgia,"Iowan Old Style",serif;margin:36px 0 8px}
h2{font:700 1.3rem Georgia,serif;margin:40px 0 8px}
h3{font-size:1rem;margin:20px 0 2px}
p{margin:0 0 12px}.lead{color:var(--soft);max-width:60ch}
label{display:block;font-weight:600;margin:24px 0 6px}
.bar{display:flex;gap:8px}
input{flex:1;min-width:0;padding:12px 14px;font:inherit;border:1px solid var(--ink);border-radius:4px;background:#fff}
button{padding:12px 20px;font:inherit;font-weight:600;color:#fff;background:var(--accent);border:0;border-radius:4px;cursor:pointer}
button:disabled{opacity:.6;cursor:wait}
:focus-visible{outline:3px solid #e0a100;outline-offset:2px}
#out{margin-top:24px}
.msg{color:var(--soft)}.msg.bad{color:var(--bad);font-weight:600}
.row{display:grid;grid-template-columns:64px 1fr;gap:2px 14px;padding:10px 14px;margin-bottom:6px;background:#fff;border-left:5px solid var(--line)}
.row b{font-size:.85rem}.row span{overflow-wrap:anywhere}.row small{grid-column:2;color:var(--soft);font-size:.8rem}
.row.ok{border-color:var(--ok)}.row.ok b{color:var(--ok)}
.row.warn{border-color:var(--warn)}.row.warn b{color:var(--warn)}
.row.bad{border-color:var(--bad)}.row.bad b{color:var(--bad)}
.snip{background:#fff;padding:16px;margin-bottom:12px;border:1px solid var(--line);font-family:Arial,sans-serif}
.snip .u{font-size:.8rem;color:#4d5156;overflow-wrap:anywhere}.snip .t{font-size:1.2rem;color:#1a0dab}.snip .d{font-size:.9rem;color:#4d5156}
ul.tools{padding:0;list-style:none}ul.tools li{padding:12px 0;border-bottom:1px solid var(--line)}
ul.tools a{font-weight:600;color:var(--accent)}
footer{margin-top:56px;padding-bottom:40px;color:var(--soft);font-size:.85rem}
@media(max-width:520px){.bar{flex-direction:column}h1{font-size:1.8rem}}