:root{--fg:#111;--bg:#fff;--muted:#6b7280;--card:#fff;--border:#e5e7eb}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:var(--fg);background:var(--bg)}
.container{max-width:980px;margin:0 auto;padding:24px}
.hero{padding:64px 0 32px;text-align:center}
h1{font-size:42px;margin:0 0 8px}
p.lead{color:var(--muted)}
.btn{display:inline-block;padding:10px 16px;border-radius:999px;border:1px solid var(--fg);text-decoration:none;color:var(--fg)}
.input{width:100%;padding:12px;border:1px solid var(--border);border-radius:12px}
.card{border:1px solid var(--border);border-radius:16px;padding:16px;background:var(--card);box-shadow:0 1px 12px rgba(0,0,0,.04)}
.grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
pre.out{white-space:pre-wrap;background:#fafafa;border:1px solid var(--border);border-radius:12px;padding:12px}
.small{font-size:12px;color:var(--muted)}
table{width:100%;border-collapse:collapse}
td,th{border:1px solid var(--border);padding:8px;text-align:left}