.blog{--b-bg:#fff;--b-text:#1f2328;--b-muted:#6b7280;--b-line:#e5e7eb;--b-accent:#2563eb;--b-card:#f8fafc;--b-on:#fff;
  margin:0;background:var(--b-bg);color:var(--b-text);font:17px/1.75 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color-scheme:light}
@media (prefers-color-scheme:dark){.blog{--b-bg:#111214;--b-text:#e8e8e6;--b-muted:#9aa0a6;--b-line:#2a2c31;--b-accent:#7aa2ff;--b-card:#1a1c20;--b-on:#0d1117;color-scheme:dark}}
.blog *{box-sizing:border-box}
.blog a{color:var(--b-accent)}
.blog .bh{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;max-width:920px;margin:0 auto;padding:16px 20px;border-bottom:1px solid var(--b-line)}
.blog .brand{font-weight:700;text-decoration:none;color:var(--b-text)}
.blog .bh nav{display:flex;gap:16px;align-items:center}.blog .bh nav a{text-decoration:none}
.blog .btn{background:var(--b-accent);color:var(--b-on)!important;padding:8px 16px;border-radius:8px;text-decoration:none;display:inline-block;font-weight:600}
.blog main{max-width:920px;margin:0 auto;padding:28px 20px 40px}
.blog h1{font-size:2rem;line-height:1.25;margin:.2em 0 .4em}
.blog .lead{color:var(--b-muted);font-size:1.05rem}
.blog .meta{color:var(--b-muted);font-size:.92rem;margin:.2em 0 1em}
.blog .crumbs{font-size:.9rem;color:var(--b-muted)}
.blog .cover{width:100%;height:auto;border-radius:12px;margin:8px 0 20px}
.blog .post{max-width:780px;margin:0 auto}
.blog .card{display:grid;grid-template-columns:260px minmax(0,1fr);gap:20px;align-items:start;border:1px solid var(--b-line);background:var(--b-card);border-radius:12px;padding:14px;margin:16px 0}
.blog .thumb{display:block;aspect-ratio:16/10;border-radius:10px;overflow:hidden;background:var(--b-line)}
.blog .thumb img{width:100%;height:100%;object-fit:cover;display:block}
.blog .ph{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-size:2.6rem;background:linear-gradient(135deg,#2563eb,#60a5fa)}
.blog .card .body{min-width:0}
.blog .card h2{margin:0;font-size:1.25rem;line-height:1.35}.blog .card h2 a{text-decoration:none;color:var(--b-text)}.blog .card h2 a:hover{color:var(--b-accent)}
.blog .card .meta{margin:.35em 0 .5em}.blog .card .ex{margin:0;color:var(--b-muted);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
@media (max-width:640px){.blog .card{grid-template-columns:1fr;gap:12px}.blog h1{font-size:1.6rem}}
.blog .more h2{font-size:1.3rem;margin-top:40px}
.blog .pager{display:flex;justify-content:space-between;align-items:center;margin-top:24px}
.blog .cta{margin:36px 0 0;text-align:center}
.blog .bf{max-width:920px;margin:0 auto;padding:20px;border-top:1px solid var(--b-line);color:var(--b-muted);font-size:.9rem;text-align:center}
.blog .muted{color:var(--b-muted)}
.content h2{font-size:1.5rem;margin:1.8em 0 .5em;line-height:1.3}
.content h3{font-size:1.2rem;margin:1.5em 0 .4em}
.content h4{font-size:1.05rem;margin:1.3em 0 .3em}
.content p{margin:1em 0}
.content img{max-width:100%;height:auto;border-radius:10px;display:block;margin:1em auto}
.content ul,.content ol{padding-left:1.4em}.content li{margin:.3em 0}
.content blockquote{margin:1.2em 0;padding:.2em 1em;border-left:4px solid var(--b-accent,var(--accent,#2563eb));color:var(--b-muted,var(--muted,#6b7280));background:rgba(127,127,127,.08);border-radius:0 8px 8px 0}
.content code{background:rgba(127,127,127,.18);padding:.1em .35em;border-radius:5px;font-size:.92em}
.content pre{background:rgba(127,127,127,.14);padding:14px 16px;border-radius:10px;overflow-x:auto}.content pre code{background:none;padding:0}
.content hr{border:0;border-top:1px solid rgba(127,127,127,.35);margin:2em 0}
.content a{color:var(--b-accent,var(--accent,#2563eb))}
