:root{--brand:#1677ff;--brand-dark:#0a5fd6;}
.post-content{font-size:16px;line-height:1.9;color:#374151;}
.post-content h2{font-size:1.5rem;line-height:1.4;font-weight:700;color:#111827;margin:2.2rem 0 1rem;padding-left:.75rem;border-left:4px solid var(--brand);}
.post-content h3{font-size:1.2rem;font-weight:600;color:#1f2937;margin:1.6rem 0 .8rem;}
.post-content p{margin:1rem 0;}
.post-content strong{color:#111827;font-weight:600;}
.post-content ul,.post-content ol{margin:1rem 0;padding-left:1.6rem;}
.post-content ul{list-style:disc;}
.post-content ol{list-style:decimal;}
.post-content li{margin:.5rem 0;}
.post-content a{color:var(--brand);text-decoration:none;border-bottom:1px solid rgba(22,119,255,.3);}
.post-content a:hover{border-bottom-color:var(--brand);}
.post-content blockquote{margin:1.6rem 0;padding:1rem 1.25rem;background:#f5f8ff;border-left:4px solid var(--brand);border-radius:0 10px 10px 0;color:#334155;}
.post-content blockquote p{margin:.4rem 0;}
.post-content .tip,.post-content .warn{margin:1.6rem 0;padding:1rem 1.25rem;border-radius:10px;display:flex;gap:.75rem;align-items:flex-start;line-height:1.7;}
.post-content .tip{background:#ecfdf5;border:1px solid #a7f3d0;color:#065f46;}
.post-content .warn{background:#fff7ed;border:1px solid #fed7aa;color:#9a3412;}
.post-content .tip b,.post-content .warn b{color:inherit;}
.post-content figure{margin:1.8rem 0;}
.post-content figure img{width:100%;border-radius:12px;}
.post-content figcaption{margin-top:.6rem;font-size:.85rem;color:#9ca3af;text-align:center;}
.post-content table{width:100%;border-collapse:collapse;margin:1.6rem 0;font-size:.95rem;overflow:hidden;border-radius:10px;box-shadow:0 1px 3px rgba(0,0,0,.08);}
.post-content th,.post-content td{border:1px solid #e5e7eb;padding:.7rem .9rem;text-align:left;}
.post-content th{background:#f3f4f6;font-weight:600;color:#111827;}
.post-content tr:nth-child(even) td{background:#fafafa;}
.post-content hr{border:none;border-top:1px solid #eee;margin:2.2rem 0;}
.post-content code{background:#f3f4f6;padding:.15rem .4rem;border-radius:5px;font-size:.9em;color:#b91c1c;font-family:Consolas,Menlo,monospace;}
.post-meta{display:flex;flex-wrap:wrap;gap:1rem;align-items:center;font-size:.85rem;color:#9ca3af;margin-bottom:1.5rem;}
.post-meta .dot{width:4px;height:4px;border-radius:50%;background:#d1d5db;display:inline-block;}
.post-tags{display:flex;flex-wrap:wrap;gap:.5rem;margin:2rem 0 1rem;}
.post-tags a{font-size:.8rem;color:#475569;background:#f1f5f9;padding:.3rem .8rem;border-radius:999px;text-decoration:none;border:none;}
.post-tags a:hover{background:#e2e8f0;}
.cta-card{margin:2.5rem 0;padding:1.8rem;border-radius:16px;background:linear-gradient(135deg,#1677ff,#0a5fd6);color:#fff;text-align:center;}
.cta-card h3{color:#fff;margin:0 0 .5rem;font-size:1.3rem;}
.cta-card p{color:rgba(255,255,255,.85);margin:0 0 1.2rem;}
.cta-card a{display:inline-block;background:#fff;color:#0a5fd6;font-weight:600;padding:.7rem 1.8rem;border-radius:999px;text-decoration:none;}
.cta-card a:hover{opacity:.92;}
.post-nav{display:flex;justify-content:space-between;gap:1rem;margin:2.5rem 0;padding-top:1.5rem;border-top:1px solid #eee;}
.post-nav a{flex:1;font-size:.9rem;color:#475569;text-decoration:none;}
.post-nav a.next{text-align:right;}
.post-nav .lbl{display:block;font-size:.75rem;color:#9ca3af;margin-bottom:.3rem;}
.post-nav .ttl{color:#111827;font-weight:500;}
.related{margin:2.5rem 0;}
.related h3{font-size:1.2rem;font-weight:700;color:#111827;margin-bottom:1rem;}
.related-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1rem;}
.related-grid a{display:block;background:#fff;border:1px solid #eee;border-radius:12px;overflow:hidden;text-decoration:none;}
.related-grid img{width:100%;height:120px;object-fit:cover;}
.related-grid .t{display:block;padding:.6rem .7rem;font-size:.85rem;color:#1f2937;line-height:1.4;}
.related-grid a:hover .t{color:var(--brand);}
.share{display:flex;gap:.6rem;align-items:center;margin:1.5rem 0;font-size:.85rem;color:#9ca3af;}
.share a{width:34px;height:34px;border-radius:50%;background:#f1f5f9;display:inline-flex;align-items:center;justify-content:center;color:#475569;text-decoration:none;font-size:.8rem;}
.share a:hover{background:#e2e8f0;color:var(--brand);}
@media(max-width:640px){.post-content h2{font-size:1.3rem;}.related-grid{grid-template-columns:1fr 1fr;}}
