:root { --fg:#222; --muted:#666; --link:#0a66c2; --bg:#f7f7f7; --card:#fff; }
* { box-sizing:border-box; }
body { margin:0; font-family: system-ui, Arial, sans-serif; color:var(--fg); background:var(--bg); }
.wrap { max-width: 980px; margin: 0 auto; padding: 1.25rem; }
header.wrap { padding-top: 2rem; }
header h1 { margin: 0; font-size: 2rem; }
header h1 a { color: var(--fg); text-decoration: none; }
header .tag { color: var(--muted); margin: .25rem 0 1rem; }
nav a { margin-right: 1rem; color: var(--link); text-decoration: none; }
main.wrap { background: var(--card); border-radius: 14px; box-shadow: 0 2px 16px rgba(0,0,0,.06); padding: 1.25rem; }
.grid { display:grid; gap:1rem; grid-template-columns: repeat(auto-fit, minmax(260px,1fr)); }
.card { background:var(--card); border:1px solid #eee; border-radius:12px; padding:1rem; }
.card h3 { margin-top:0; }
a { color: var(--link); }
footer { color: var(--muted); }
code, pre { background:#f0f0f0; border-radius:8px; padding:.2rem .4rem; }
img { max-width:100%; height:auto; border-radius:10px; }