/* OAKEN 品牌层 v2（运行期注入，每页一份）—— 见 tools/rebrand.js 的 inject 层。
 *
 * 这一层管的是**编译产物没覆盖的东西**：字体、暖底色、版式节奏、我们自己加的件。
 * 站上原有的 class 一个都不动（那是 Tailwind 编译产物，改它等于改源站字节）——
 * 这里全是"只加/只覆盖"，选择器尽量贴着现有的工具类写，不碰结构。
 *
 * 和 35LOXLEY 的冷（森林墨 + 金线 + 夜林）反着走：这里是**暖**的
 * （树皮褐 + 橡木棕 + 年轮金 + 树洞里透出来的光）。
 *
 * ⚠ 两个克制：
 *   · **不用 `clip-path` 切角** —— 卡片里挂着下拉/弹层时会被整块裁掉
 *     （[[clippath-kills-descendant-popups]]）。切角改用 `::before` 画角标。
 *   · 字号/行高只动**标题级**，正文保持原样：正文改了会牵动整站的行宽与折行。
 */

/* ── 字标字体（Bevan，SIL OFL / Google Fonts）───────────────────────── */
@font-face {
  font-family: 'Oaken Display';
  src: url('/oaken/bevan.ttf') format('truetype');
  font-display: swap;
}

:root {
  --oak-bark: #16110d;
  --oak-bark2: #211913;
  --oak-oak: #8a5a2b;
  --oak-deep: #4a3220;
  --oak-ring: #d9a343;
  --oak-ringdeep: #a06a1f;
  --oak-ember: #e8b85c;
  --oak-iron: #2c2a27;
  --oak-parchment: #f0e4d0;
}

/* ── 底 ─────────────────────────────────────────────────────────────── */
html.dark body { background-color: var(--oak-bark); }
html.dark main, html.dark #__next > div { background-color: transparent; }

/* ── 页头：暖底 + 一条年轮金的细线，字标跟在图记后面 ────────────────── */
html.dark header {
  background-color: var(--oak-bark2);
  border-bottom: 1px solid rgba(217, 163, 67, .18);
}

/* 图记旁边那个词标（content/oaken-brand.js 注入） */
.oak-wordmark {
  font-family: 'Oaken Display', Georgia, serif;
  font-size: 21px;
  line-height: 1;
  letter-spacing: .16em;
  color: var(--oak-parchment);
  margin-left: 4px;
  margin-right: 22px;   /* 和搜索框拉开 */
  white-space: nowrap;
  user-select: none;
}

/* 页头那颗 X 链接 */
.oak-x-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 38px;
  height: 38px;
  border-radius: 8px;
  border: 1px solid rgba(217, 163, 67, .38);
  color: var(--oak-ring);
  background: rgba(217, 163, 67, .06);
  transition: background .18s ease, border-color .18s ease, transform .18s ease;
}
.oak-x-link:hover { background: rgba(217, 163, 67, .16); border-color: var(--oak-ring); transform: translateY(-1px); }
.oak-x-link svg { width: 17px; height: 17px; }

/* ── 左侧工具栏：深一档的树皮 + 金的活动条 ─────────────────────────── */
html.dark aside, html.dark nav.overflow-y-auto { background-color: var(--oak-bark); }
html.dark nav a:hover, html.dark nav li:hover > div { background-color: rgba(217, 163, 67, .08); }
html.dark nav li > div { border-radius: 6px; }

/* ── 标题：显示字体（只动 h1/h2，正文不碰）──────────────────────────── */
html.dark h1, html.dark h2 {
  font-family: 'Oaken Display', Georgia, serif;
  font-weight: 400;
  letter-spacing: .01em;
  color: var(--oak-parchment);
}
html.dark h1 { font-size: clamp(30px, 3.4vw, 46px); line-height: 1.12; }
html.dark h2 { font-size: clamp(20px, 1.8vw, 26px); line-height: 1.2; }

/* 标题下面那条金线（只在紧跟着的段落存在时出现，避免到处撒线） */
html.dark h1 + p { margin-top: 14px; }
html.dark h1::after {
  content: '';
  display: block;
  width: 64px;
  height: 3px;
  margin-top: 16px;
  background: linear-gradient(90deg, var(--oak-ring) 0%, var(--oak-ringdeep) 100%);
  border-radius: 2px;
}
html.dark section.text-center h1::after, html.dark .text-center h1::after { margin-left: auto; margin-right: auto; }

/* ── 卡片与面板：直边、暖描边、悬停时透出一点年轮金 ─────────────────── */
html.dark [class*="rounded-md"], html.dark [class*="rounded-lg"] { border-radius: 3px; }
html.dark [class*="bg-brand-dark"],
html.dark [class*="bg-neutral-900"],
html.dark [class*="bg-\\[\\#1"] {
  border: 1px solid rgba(217, 163, 67, .10);
}
html.dark [class*="bg-brand-dark"]:hover { border-color: rgba(217, 163, 67, .22); }

/* ── 按钮：年轮金的实心（主）/ 金边（次）───────────────────────────── */
html.dark .ant-btn-primary, html.dark button[class*="bg-brand"] {
  background: linear-gradient(180deg, var(--oak-ember) 0%, var(--oak-ring) 100%) !important;
  color: #1b1409 !important;
  border: none !important;
  border-radius: 3px !important;
  font-weight: 600;
  letter-spacing: .06em;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .35), 0 6px 18px -8px rgba(217, 163, 67, .55);
}
html.dark .ant-btn-primary:hover, html.dark button[class*="bg-brand"]:hover { filter: brightness(1.06); }
html.dark .ant-btn:not(.ant-btn-primary) { border-radius: 3px; }

/* ── 表格 / 列表：暖分隔线，行悬停给一点点金 ───────────────────────── */
html.dark table tr:hover, html.dark [class*="hover\\:bg"] :hover { background-color: rgba(217, 163, 67, .05); }
html.dark td, html.dark th { border-color: rgba(240, 228, 208, .08); }

/* ── 页脚：和页头同一档暖底 ─────────────────────────────────────────── */
html.dark footer { background-color: var(--oak-bark2); border-top: 1px solid rgba(217, 163, 67, .14); }

/* ── 滚动条（Chromium）：暗金，不刺眼 ──────────────────────────────── */
html.dark ::-webkit-scrollbar { width: 10px; height: 10px; }
html.dark ::-webkit-scrollbar-track { background: var(--oak-bark); }
html.dark ::-webkit-scrollbar-thumb { background: #3a2b1c; border-radius: 6px; }
html.dark ::-webkit-scrollbar-thumb:hover { background: var(--oak-ringdeep); }