:root{
  --bg:#fbfbfd; --fg:#1c1e21; --muted:#6b7280; --card:#fff; --line:#e8eaed;
  --accent:#2f6fed; --code-bg:#f6f8fa; --code-fg:#24292f; --shadow:0 1px 3px rgba(0,0,0,.05),0 8px 24px rgba(0,0,0,.04);
}
html[data-theme=dark]{
  --bg:#16181d; --fg:#e6e8eb; --muted:#9aa3ad; --card:#1e2127; --line:#2b2f36;
  --accent:#77a6ff; --code-bg:#22262e; --code-fg:#e6e8eb; --shadow:0 1px 3px rgba(0,0,0,.4);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--bg);color:var(--fg);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Source Han Sans SC",sans-serif;
  font-size:16.5px;line-height:1.78;
}
.wrap{max-width:780px;margin:0 auto;padding:0 20px}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
.muted{color:var(--muted);font-size:.9em}
/* 顶部 */
.site-head{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--bg) 82%,transparent);
  backdrop-filter:saturate(160%) blur(12px);border-bottom:1px solid var(--line)}
.site-head .wrap{display:flex;align-items:center;justify-content:space-between;height:62px;gap:16px}
.brand{display:flex;align-items:baseline;gap:8px;color:var(--fg);text-decoration:none}
.brand:hover{text-decoration:none}
.brand-title{font-weight:700;font-size:1.12rem}
.brand-sub{color:var(--muted);font-size:.82rem}
.nav{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.nav a{padding:6px 11px;border-radius:8px;color:var(--muted);font-size:.92rem}
.nav a:hover{background:var(--code-bg);color:var(--fg);text-decoration:none}
.nav a.active{color:var(--accent);font-weight:600}
.theme-btn{background:none;border:1px solid var(--line);color:var(--muted);border-radius:8px;
  width:32px;height:32px;cursor:pointer;font-size:15px;line-height:1}
.theme-btn:hover{color:var(--fg);border-color:var(--muted)}
/* 主体 */
main{padding:34px 0 56px}
.hero{margin-bottom:26px}
.hero h1{margin:0 0 6px;font-size:1.85rem;letter-spacing:-.01em}
.list{display:flex;flex-direction:column;gap:14px}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px 20px;
  box-shadow:var(--shadow);transition:transform .12s ease,border-color .12s ease}
.card:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--accent) 35%,var(--line))}
.card-link{color:inherit;text-decoration:none}
.card-link:hover{text-decoration:none}
.card h2{margin:0 0 7px;font-size:1.16rem;line-height:1.45;font-weight:650}
.excerpt{margin:0;color:var(--muted);font-size:.92rem;line-height:1.65}
.meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:11px;font-size:.78rem;color:var(--muted)}
.tag{background:var(--code-bg);border:1px solid var(--line);color:var(--muted);
  padding:2px 9px;border-radius:999px;font-size:.74rem}
.tag:hover{color:var(--accent);border-color:var(--accent);text-decoration:none}
/* 文章 */
.post-head{margin-bottom:26px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.post-head h1{margin:0 0 10px;font-size:1.72rem;line-height:1.35;letter-spacing:-.01em}
.content{word-wrap:break-word;overflow-wrap:break-word}
.content h1,.content h2,.content h3,.content h4{margin:1.9em 0 .7em;line-height:1.4;font-weight:650}
.content h2{font-size:1.32rem;padding-bottom:.3em;border-bottom:1px solid var(--line)}
.content h3{font-size:1.13rem}
.content p{margin:0 0 1.05em}
.content img{max-width:100%;height:auto;border-radius:10px;display:block;margin:1.2em auto}
.content ul,.content ol{padding-left:1.5em;margin:0 0 1.05em}
.content li{margin:.3em 0}
.content blockquote{margin:1.2em 0;padding:.6em 1.1em;border-left:3px solid var(--accent);
  background:var(--code-bg);border-radius:0 8px 8px 0;color:var(--muted)}
.content table{width:100%;border-collapse:collapse;margin:1.2em 0;font-size:.9rem;display:block;overflow-x:auto}
.content th,.content td{border:1px solid var(--line);padding:8px 11px;text-align:left}
.content th{background:var(--code-bg);font-weight:600}
.content hr{border:0;border-top:1px solid var(--line);margin:2em 0}
/* 代码 */
code{background:var(--code-bg);color:var(--code-fg);padding:.16em .42em;border-radius:5px;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;font-size:.875em}
pre{background:var(--code-bg);border:1px solid var(--line);border-radius:10px;
  padding:14px 16px;overflow-x:auto;margin:1.2em 0;line-height:1.6}
pre code{background:none;padding:0;font-size:.855rem;white-space:pre}
.back{margin-top:40px;padding-top:20px;border-top:1px solid var(--line)}
/* 分类/归档 */
.chips{display:flex;flex-wrap:wrap;gap:9px}
.chip{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:7px 13px;
  color:var(--fg);font-size:.9rem}
.chip:hover{border-color:var(--accent);color:var(--accent);text-decoration:none}
.chip .cnt{color:var(--muted);font-size:.82em}
.chip.small{padding:5px 11px;font-size:.84rem}
.sec{margin:30px 0 12px;font-size:1.02rem;color:var(--muted);font-weight:600}
.arc{list-style:none;padding:0;margin:0}
.arc li{padding:7px 0;border-bottom:1px dashed var(--line);display:flex;gap:12px;align-items:baseline}
.arc time{color:var(--muted);font-size:.82rem;font-variant-numeric:tabular-nums;flex:0 0 44px}
.arc a{flex:1}
.cnt{color:var(--muted);font-size:.8em;font-weight:400}
/* 页脚 */
.site-foot{border-top:1px solid var(--line);padding:26px 0;margin-top:20px}
.site-foot p{margin:3px 0;color:var(--muted);font-size:.85rem}
@media(max-width:600px){
  body{font-size:16px}
  .hero h1{font-size:1.5rem}
  .brand-sub{display:none}
  .card{padding:15px 16px}
  .nav a{padding:6px 8px;font-size:.88rem}
}
