:root{--primary:#2563eb;--text:#1f2937;--bg:#f9fafb;--border:#e5e7eb}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:-apple-system,"Microsoft YaHei",sans-serif;background:var(--bg);color:var(--text);line-height:1.8}
.container{max-width:860px;margin:0 auto;padding:0 20px}
header{background:linear-gradient(135deg,#2563eb,#1e40af);color:#fff;padding:40px 0;text-align:center}
header h1{font-size:28px;margin-bottom:8px}
header p{opacity:.9;font-size:15px}
nav{background:#fff;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:10}
nav .container{display:flex;gap:24px;padding:12px 20px}
nav a{color:var(--text);text-decoration:none;font-size:14px;font-weight:500}
nav a:hover{color:var(--primary)}
.section-title{margin:40px 0 20px;text-align:center}
.section-title h2{font-size:22px}
.section-title p{color:#6b7280;font-size:14px;margin-top:4px}
.article-list{display:grid;gap:20px}
.article-card{background:#fff;border:1px solid var(--border);border-radius:10px;padding:24px;transition:.2s}
.article-card:hover{box-shadow:0 4px 20px rgba(0,0,0,.08);transform:translateY(-2px)}
.article-card h2 a{color:var(--text);text-decoration:none;font-size:18px}
.article-card h2 a:hover{color:var(--primary)}
.article-card .meta{color:#6b7280;font-size:13px;margin:8px 0}
.article-card .summary{color:#4b5563;font-size:14px}
.article-page{padding:40px 20px}
.article-page h1{font-size:26px;margin-bottom:12px}
.article-page .meta{color:#6b7280;font-size:14px;margin-bottom:30px;padding-bottom:20px;border-bottom:1px solid var(--border)}
.article-body h2{font-size:20px;margin:32px 0 16px;padding-left:12px;border-left:4px solid var(--primary)}
.article-body h3{font-size:17px;margin:24px 0 12px}
.article-body p{margin:16px 0;color:#374151}
.article-body ul,.article-body ol{margin:16px 0;padding-left:28px}
.article-body li{margin:8px 0}
.article-body table{width:100%;border-collapse:collapse;margin:20px 0;font-size:14px}
.article-body th,.article-body td{border:1px solid var(--border);padding:10px 12px;text-align:left}
.article-body th{background:#eff6ff;color:var(--primary);font-weight:600}
.article-body strong{color:var(--primary)}
.tags{margin-top:30px;display:flex;gap:8px;flex-wrap:wrap}
.tags span{background:#eff6ff;color:var(--primary);padding:4px 12px;border-radius:20px;font-size:13px}
footer{background:#1f2937;color:#9ca3af;padding:30px 0;margin-top:60px;text-align:center;font-size:14px}
footer a{color:#d1d5db;text-decoration:none}
.copyright{margin:0}
