:root { --gap: 0.6rem; --fg:#222; --muted:#666; --ok:#0a7; --err:#c00; }
* { box-sizing: border-box; }
body { font-family: system-ui, sans-serif; color: var(--fg); margin: 1rem; }
header, footer { margin-bottom: 1rem; }
nav a { margin-right: 1rem; text-decoration: none; color: #0366d6; }
nav a[aria-current="page"] { font-weight: 700; text-decoration: underline; }
.panel { border:1px solid #ddd; border-radius:8px; padding:1rem; }
.grid { display:grid; gap: var(--gap); grid-template-columns: repeat(auto-fit, minmax(220px,1fr)); }
label { display:block; margin: 0.4rem 0 0.2rem; }
input, select, button { padding: 0.45rem; }
button { cursor: pointer; }
.results > div { padding:0.4rem 0; border-bottom:1px dashed #eee; }
.err { color: var(--err); display:block; min-height: 1em; }
.ok { color: var(--ok); }
small.hint { color: var(--muted); display:block; }
footer { font-size: 0.9rem; color: var(--muted); }