:root { --fg:#111; --muted:#666; --bg:#fff; --soft:#f6f7f9; }
* { box-sizing: border-box; }
body { font-family: system-ui, -apple-system, Segoe UI, Roboto, sans-serif; margin:0; color:var(--fg); background:var(--bg); }
.container { max-width: 900px; margin: 24px auto 64px; padding: 0 16px; }
.lead { color: var(--muted); }
.row { display: flex; gap: 8px; margin: 16px 0 24px; }
input { flex: 1; padding: 12px; font-size: 16px; border:1px solid #ddd; border-radius: 10px; }
button { padding: 12px 16px; font-size: 16px; border:1px solid #ddd; background:#fafafa; border-radius: 10px; cursor: pointer; }
button:hover { background:#f0f0f0; }
pre { background: var(--soft); padding: 14px; white-space: pre-wrap; border-radius: 12px; }
.site-header { display:flex; align-items:center; justify-content: space-between; gap:16px; padding: 12px 16px; border-bottom:1px solid #eee; }
.site-header img { height: 40px; }
.author-tag { font-size: 14px; color: var(--muted); }
.site-footer { display:flex; flex-direction: column; gap:6px; padding: 16px; border-top:1px solid #eee; color: var(--muted); }
.site-footer .mini { height: 20px; vertical-align: middle; margin-right: 8px; }
.tiny { font-size: 12px; color: var(--muted); }