:root{
  --maxw:960px;
  --accent:#0b6efd;
  --muted:#666;
  --pad:18px;
}
*{box-sizing:border-box}
body{
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;
  line-height:1.5;
  margin:0;
  color:#111;
  background:#fff;
}
.container{max-width:var(--maxw);margin:24px auto;padding:0 var(--pad);}
.site-header{background:#f7f9ff;padding:28px 0;text-align:center}
.avatar{width:88px;height:88px;border-radius:12px;object-fit:cover;display:block;margin:0 auto 12px}
.site-header h1{margin:0 0 6px;font-size:1.6rem}
.tagline{margin:0;color:var(--muted)}
nav{margin-top:12px}
nav a{margin:0 8px;color:var(--accent);text-decoration:none}
h2{margin-top:28px}
article{padding:12px 0;border-bottom:1px solid #eee}
.site-footer{text-align:center;padding:18px 0;color:var(--muted);font-size:0.9rem}
@media(min-width:800px){
  .site-header{padding:48px 0}
  .avatar{width:120px;height:120px}
}