/* 简洁技术博客风格 */
* { box-sizing: border-box; margin: 0; padding: 0; }

body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
    line-height: 1.7;
    color: #333;
    background: #fafafa;
}

.container { max-width: 800px; margin: 0 auto; padding: 0 24px; }

header {
    background: #fff;
    border-bottom: 1px solid #eaeaea;
    padding: 24px 0;
    margin-bottom: 40px;
}
header h1 { font-size: 22px; font-weight: 600; margin-bottom: 12px; }
header h1 a { color: #222; text-decoration: none; }
header nav a { color: #666; text-decoration: none; margin-right: 24px; font-size: 15px; }
header nav a:hover { color: #0366d6; }

main { padding-bottom: 60px; }
section { margin-bottom: 48px; }

h2 {
    font-size: 20px;
    margin: 32px 0 16px;
    color: #222;
    border-bottom: 1px solid #eaeaea;
    padding-bottom: 8px;
}
h3 { font-size: 16px; margin: 24px 0 12px; color: #333; }
p { margin-bottom: 16px; color: #444; }
a { color: #0366d6; text-decoration: none; }
a:hover { text-decoration: underline; }

.topic-list { list-style: none; }
.topic-list li { padding: 16px 0; border-bottom: 1px solid #eee; }
.topic-list li:last-child { border-bottom: none; }
.topic-list h3 { margin: 0 0 6px; }
.topic-list p { margin: 0; color: #666; font-size: 14px; }

.recent { list-style: none; }
.recent li { padding: 8px 0; font-size: 15px; }
.recent .date { display: inline-block; width: 100px; color: #999; font-size: 13px; }

article {
    background: #fff;
    padding: 40px;
    border-radius: 4px;
    border: 1px solid #eaeaea;
}
article h1 { font-size: 28px; margin-bottom: 8px; color: #111; }
article .meta { color: #999; font-size: 14px; margin-bottom: 32px; }

table { width: 100%; border-collapse: collapse; margin: 16px 0 24px; font-size: 14px; }
table th, table td { border: 1px solid #eaeaea; padding: 10px 14px; text-align: left; }
table th { background: #f6f8fa; font-weight: 600; }

pre {
    background: #f6f8fa;
    border-radius: 4px;
    padding: 16px;
    overflow-x: auto;
    margin: 16px 0;
    font-size: 13px;
    line-height: 1.6;
}
code { font-family: "SF Mono", Monaco, "Cascadia Code", "Fira Code", monospace; color: #24292e; }
p code, li code { background: #f6f8fa; padding: 2px 6px; border-radius: 3px; font-size: 0.9em; }

ul, ol { padding-left: 24px; margin-bottom: 16px; }
li { margin-bottom: 8px; }

footer {
    border-top: 1px solid #eaeaea;
    padding: 32px 0;
    text-align: center;
    color: #999;
    font-size: 13px;
}
footer a { color: #999; }
footer p { margin-bottom: 6px; color: #999; }

@media (max-width: 600px) {
    header h1 { font-size: 18px; }
    header nav a { margin-right: 16px; font-size: 14px; }
    article { padding: 24px; }
    article h1 { font-size: 22px; }
    .recent .date { width: 80px; font-size: 12px; }
}
