/*! blog-theme.css — 博客园整站主题 v2（暖沙 · 清爽宽排）
 *  粘贴位置：博客园后台 -> 设置 -> 「页面定制 CSS 代码」
 *  要点：暖沙底 + 白卡片 + 金棕点缀（去粉）；正文用 flexbox 排成宽双栏（内容+右侧栏）。
 *  建议：不勾选「禁用模版默认CSS」。
 */
:root {
  --sand-top: #f9f3e6;      /* 渐变：亮奶油（顶部） */
  --sand-mid: #f3e8d0;      /* 渐变：暖金米（中部） */
  --sand-deep: #e9dbba;     /* 渐变：深暖棕（底部） */
  --card: #fffcf5;          /* 内容象牙白卡片 */
  --ink: #3b3122;           /* 暖深咖啡 */
  --brown: #5c503c;         /* 次级 */
  --muted: #9b8a70;         /* 弱化 */
  --gold: #c2923a;          /* 暖金/琥珀 */
  --gold-deep: #9f6f1c;     /* 深金 */
  --line: rgba(59,49,34,.13);     /* 细分隔线 */
  --shadow: 0 12px 32px rgba(59,49,34,.10), 0 2px 6px rgba(59,49,34,.05);
  --radius: 16px;
  --font-serif: "Noto Serif SC","Source Han Serif SC","Songti SC","STSong","SimSun",serif;
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  --font-mono: "JetBrains Mono","Fira Code",Consolas,"Courier New",monospace;
}

/* ---------- 画布 ---------- */
html { scroll-behavior: smooth; }
body {
  font-family: var(--font-sans);
  color: var(--ink);
  background:
    radial-gradient(1200px 640px at 78% -12%, rgba(214,172,86,.20), transparent 60%),
    linear-gradient(172deg, var(--sand-top) 0%, var(--sand-mid) 46%, var(--sand-deep) 100%);
  background-attachment: fixed;
}
body::before {
  /* 全屏“模糊咖啡”背景：铺满两侧，放在内容之后 */
  content: "";
  position: fixed; inset: -24px;
  z-index: -1;
  background:
    linear-gradient(180deg, rgba(30,20,12,.42), rgba(30,20,12,.30) 55%, rgba(30,20,12,.42)),
    url("https://images.unsplash.com/photo-1495474472287-4d71bcdd2085?w=1800&q=70") center / cover no-repeat;
  filter: blur(9px) brightness(.62) saturate(1.08);
}
body::after {
  /* 纸张噪点（保持在最上层，且不影响交互） */
  content: ""; position: fixed; inset: 0; z-index: 9998; pointer-events: none; opacity: .03;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
}
#home { max-width: 1220px; margin: 0 auto; position: relative; z-index: 1; }
::selection { background: rgba(189,143,53,.22); }
a { color: var(--gold-deep); text-decoration: none; transition: color .45s cubic-bezier(.32,.72,0,1); }
a:hover { color: var(--ink); }

/* ---------- 主布局：隐藏右侧「公告」栏，内容装在 #home 卡片里 ---------- */
#main { display: block; }
#mainContent { width: 100%; max-width: 100%; margin: 0; padding: 0; }
#sideBar { display: none !important; }
/* 左侧目录栏：博客园过滤了页脚里的 <script>，暂不启用（需要可在后续做静态版实现） */
.xq-toc { display: none; }
.postBody h2, .postBody h3 { scroll-margin-top: 24px; }

/* ---------- 顶部品牌横幅 ---------- */
.xq-header {
  text-align: center; padding: 44px 24px 28px; margin-bottom: 26px;
  background: radial-gradient(720px 320px at 50% -30%, rgba(189,143,53,.14), transparent 70%), var(--card);
  border: 1px solid var(--line); border-radius: 20px; box-shadow: var(--shadow);
}
.xq-eyebrow {
  display: inline-block; padding: 6px 16px; border-radius: 999px;
  background: rgba(189,143,53,.13); border: 1px solid rgba(189,143,53,.28);
  color: var(--gold-deep); font-size: .72rem; letter-spacing: .22em; text-transform: uppercase;
}
.xq-brand { font-family: var(--font-serif); font-size: 2.4rem; font-weight: 700; color: var(--ink); margin: .5em 0 .2em; letter-spacing: .02em; line-height: 1.2; }
.xq-tag { color: var(--muted); font-size: 15px; letter-spacing: .05em; margin: 0; }
.xq-rule { width: 64px; height: 2px; margin: 18px auto 0; background: linear-gradient(90deg, var(--gold), var(--gold-deep)); border-radius: 2px; }

/* ---------- 顶部标题栏 / 导航（博客园自带 header，做干净） ---------- */
#header { background: transparent; padding: 6px 4px 14px; }
#header .blogTitle h1, #header .blogTitle h2 { font-family: var(--font-serif); color: var(--ink); }
#navList { background: transparent; border: none; }
#navList a { color: var(--brown); border-radius: 8px; padding: 4px 8px; }
#navList a:hover { color: var(--ink); background: rgba(189,143,53,.12); }

/* ---------- 文章标题 ---------- */
.postTitle {
  margin: 0 0 14px; padding: 0;
}
.postTitle, .postTitle a {
  font-family: var(--font-serif); font-weight: 700; font-size: 1.5rem;
  letter-spacing: .01em; line-height: 1.35;
  color: #f7ecdd;                                   /* 奶油白，直接压在咖啡上可读 */
  text-shadow: 0 2px 10px rgba(0,0,0,.55), 0 1px 2px rgba(0,0,0,.4);
}
.postTitle a:hover { color: #ffd98a; }
.postTitle:before { content: "▪"; color: #e7b95c; margin-right: .45em; font-size: .8em; vertical-align: .15em; text-shadow: 0 2px 8px rgba(0,0,0,.5); }

/* ---------- 正文 ---------- */
.postBody, .postCon {
  font-family: var(--font-sans); color: var(--ink); font-size: 15.5px; line-height: 1.85;
  background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow);
  padding: 24px 28px; border: 1px solid var(--line);
}
.postBody p { margin: 0 0 1.05em; }

/* ---------- 标题层级 ---------- */
.postBody h1, .postBody h2, .postBody h3, .postBody h4, .postBody h5, .postBody h6 {
  font-family: var(--font-serif); font-weight: 700; color: var(--ink); margin: 1.7em 0 .6em; line-height: 1.35;
}
.postBody h1 { font-size: 1.7em; border-bottom: 1px solid var(--line); padding-bottom: .4em; }
.postBody h2 { font-size: 1.4em; position: relative; padding-left: .75em; }
.postBody h2:before { content: ""; position: absolute; left: 0; top: .18em; bottom: .18em; width: 4px; border-radius: 3px; background: linear-gradient(180deg, var(--gold), var(--gold-deep)); }
.postBody h3 { font-size: 1.22em; }
.postBody h4 { font-size: 1.08em; color: var(--brown); }

/* ---------- 列表 ---------- */
.postBody ul, .postBody ol { margin: .4em 0 1em; padding-left: 1.6em; }
.postBody li { margin-bottom: .5em; }
.postBody li::marker { color: var(--gold); font-weight: 700; }

/* ---------- 行内代码（金色药丸，不粉） ---------- */
.postBody code:not(.language-*) {
  font-family: var(--font-mono); font-size: .88em; color: var(--gold-deep);
  background: rgba(189,143,53,.12); border: 1px solid rgba(189,143,53,.22);
  padding: .12em .4em; border-radius: 6px;
}

/* ---------- 代码块 ---------- */
.cnblogs_code, .postBody pre {
  font-family: var(--font-mono); font-size: .87em; line-height: 1.65;
  background: #f4ecdc !important; border: 1px solid var(--line); border-top: 3px solid var(--gold);
  border-radius: var(--radius); box-shadow: var(--shadow); overflow-x: auto; padding: 16px 18px; margin: 1.1em 0;
}
.cnblogs_code pre, .postBody pre code { background: transparent !important; border: none !important; font-family: var(--font-mono); color: var(--ink); }
.cnblogs_code .cnblogs_code_toolbar { display: none; }

/* ---------- 引用 ---------- */
.postBody blockquote {
  margin: 1.4em 0; padding: 1em 1.3em; background: var(--card);
  border-left: 4px solid var(--gold); border-radius: 0 var(--radius) var(--radius) 0; box-shadow: var(--shadow); color: var(--brown);
}
.postBody blockquote p { margin-bottom: .45em; }

/* ---------- 表格 ---------- */
.postBody table { width: 100%; border-collapse: collapse; margin: 1.4em 0; font-size: .94em; border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow); }
.postBody th, .postBody td { border: 1px solid var(--line); padding: .6em .85em; text-align: left; }
.postBody th { background: #3a2f23; color: #f7f1e6; font-weight: 600; }
.postBody tr:nth-child(even) td { background: rgba(189,143,53,.05); }

/* ---------- 图片 ---------- */
.postBody img { max-width: 100%; height: auto; border-radius: var(--radius); box-shadow: var(--shadow); margin: .7em 0; }
.postBody img.post-cover { width: 100%; max-height: 360px; object-fit: cover; border-radius: 18px; box-shadow: 0 18px 40px rgba(45,40,34,.14); }

/* ---------- 分割线 / 底部 ---------- */
.postBody hr { border: none; border-top: 1px dashed var(--line); margin: 2em 0; }
.postDesc, .postfoot { margin-top: 2em; padding-top: .9em; border-top: 1px dashed var(--line); color: var(--muted); font-size: 13px; }

/* ---------- 提示框 ---------- */
.postBody .tip, .postBody .note, .postBody .warn { border-radius: var(--radius); padding: 1em 1.2em; margin: 1.2em 0; font-size: .95em; box-shadow: var(--shadow); }
.postBody .tip  { background: #f6f1e4; border: 1px solid rgba(189,143,53,.34); color: #6a5320; }
.postBody .note { background: #f2f0ea; border: 1px solid var(--line); color: var(--brown); }
.postBody .warn { background: #f6ece4; border: 1px solid rgba(154,111,29,.3); color: #7c5a1c; }

/* ---------- 右侧栏小部件 ---------- */
#sideBar > div { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); padding: 16px 18px; margin-bottom: 18px; }
#sideBar h3 { font-family: var(--font-serif); font-size: 1.02rem; color: var(--ink); margin: 0 0 .4em; border-bottom: 1px solid var(--line); padding-bottom: 8px; }
#sideBar a { color: var(--brown); }

/* ---------- 侧边栏公告（配合 sidebar.html） ---------- */
.xq-side { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); padding: 18px 20px; }
.xq-side h3 { font-family: var(--font-serif); font-size: 1.05rem; color: var(--ink); margin: 0 0 .4em; }
.xq-side p { color: var(--brown); font-size: 13.5px; line-height: 1.8; margin: 0; }
.xq-side .xq-rule { margin: 12px 0; }
