:root{--bg:#F7F8F5;--surface:#FFFFFF;--text:#14202B;--muted:#5A6872;--accent:#0F766E;--r:6px;--fh:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--fb:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font:18px/1.7 var(--fb)}
a{color:var(--accent)}img{max-width:100%;height:auto}
.wrap{max-width:720px;margin:0 auto;padding:0 20px}
header.site{border-bottom:1px solid color-mix(in srgb,var(--muted) 30%,transparent);padding:20px 0;margin-bottom:40px}
header.site .wrap{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap}
.brand{font:700 22px/1.2 var(--fh);color:var(--text);text-decoration:none}
nav a{color:var(--muted);text-decoration:none;margin-left:18px;font-size:15px}nav a:hover{color:var(--accent)}
h1,h2,h3{font-family:var(--fh);line-height:1.25}h1{font-size:clamp(30px,5vw,44px);margin:.2em 0 .4em}
.tagline{color:var(--muted);font-size:20px;margin:0 0 40px}
.list{display:grid;gap:20px;grid-template-columns:1fr;padding:0;list-style:none}
.card{background:var(--surface);border-radius:var(--r);padding:24px}
.card h2{margin:0 0 8px;font-size:22px}.card h2 a{color:var(--text);text-decoration:none}.card h2 a:hover{color:var(--accent)}
.card p{margin:0;color:var(--muted);font-size:16px}
.meta{color:var(--muted);font-size:14px}.tags span{display:inline-block;background:var(--surface);border-radius:var(--r);padding:2px 10px;margin:0 6px 6px 0;font-size:13px}
article{margin-bottom:64px}article pre{background:var(--surface);padding:16px;border-radius:var(--r);overflow-x:auto;font-size:15px}
article blockquote{border-left:3px solid var(--accent);margin:0;padding-left:18px;color:var(--muted)}
article table{border-collapse:collapse;width:100%;display:block;overflow-x:auto}article td,article th{border:1px solid color-mix(in srgb,var(--muted) 35%,transparent);padding:8px 12px}
footer{border-top:1px solid color-mix(in srgb,var(--muted) 30%,transparent);padding:32px 0;color:var(--muted);font-size:14px}
/* custom */
.wrap { max-width: 1180px; }
article { max-width: 860px; }
.list { gap: 1.25rem; }
.card { padding: 1.1rem 1.15rem; }