:root{--bg:#ffffff;--fg:#111;--muted:#666;--link:#0d6efd;--border:#eee;--max:720px}
*{box-sizing:border-box}
html,body{padding:0;margin:0}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,'Helvetica Neue',Arial,'Noto Sans',sans-serif;line-height:1.6;background:var(--bg);color:var(--fg)}
.site-header,.site-footer{max-width:var(--max);margin:0 auto;padding:1rem;display:flex;gap:.75rem;align-items:center;justify-content:space-between}
.site-header{padding-top:1.5rem}
.brand{font-weight:700;text-decoration:none;color:var(--fg)}
.nav a{color:var(--fg);opacity:.8;text-decoration:none;margin-left:1rem}
.nav a:hover{opacity:1}
.content{max-width:var(--max);margin:0 auto;padding:2rem 1rem}
.post-title{margin:.25rem 0 0}
.post-meta{color:var(--muted);margin:.25rem 0 1.5rem}
article.post{border-top:1px solid var(--border);padding-top:1rem}
.prose h2{margin-top:1.5rem}
.prose a{color:var(--link)}
.card-list{display:grid;grid-template-columns:1fr;gap:1rem}
@media(min-width:720px){.card-list{grid-template-columns:1fr 1fr}}
.card{border:1px solid var(--border);border-radius:12px;padding:1rem}
small.muted{color:var(--muted)}
.post-list{display:grid;grid-template-columns:1fr;gap:1rem;margin-top:1.5rem}
.post-item{display:grid;grid-template-columns:128px 1fr;gap:1rem;align-items:center;border:1px solid var(--border);border-radius:12px;padding:.75rem}
.post-item .thumb{display:block;width:128px;height:80px;background:#f6f6f6;border-radius:8px;overflow:hidden}
.post-item img{display:block;width:100%;height:100%;object-fit:cover}
.post-item .title{margin:0}
@media(min-width:720px){.post-list{grid-template-columns:1fr 1fr}}