/* ============================================================
   base.css — 设计变量 / 重置 / 排版 / 通用元素
   黑白 · 方正 · 无圆角。所有页面都必须先引入本文件。
   ============================================================ */

:root {
  /* 色调：纯白基底、黑为主色、蓝为高亮（黑白谱面 + 蓝调强调） */
  --bg: #ffffff;            /* 页面背景（纯白） */
  --surface: #ffffff;       /* 卡片 / 区块表面 */
  --ink: #111111;           /* 正文（近黑） */
  --ink-soft: #555555;      /* 次要文字（灰阶） */
  --line: #d0d0d0;          /* 边框 / 分割线（中灰，黑白灰阶） */
  --accent: #1a56c8;        /* 主色（蓝色高亮） */
  --accent-dark: #123f97;   /* 主色 hover */
  --accent-soft: #eef3fb;   /* 主色淡底 */
  --hover-bg: #f0f0f0;      /* 链接悬停浅灰底色 */
  --hover-bg-light: #f3f3f3;  /* 很浅的灰色 */
  --ok: #3e7a56;            /* 成功 / 已发布 */
  --ok-soft: #e7f2ec;       /* 成功淡底 */
  --danger: #c0524f;        /* 危险 / 删除 */
  --danger-soft: #f7ebea;   /* 危险淡底 */

  /* 尺寸 */
  --radius: 0;              /* 无圆角（方正设计语言） */
  /* 内容无上限宽度；左右 padding 默认按"移动端紧凑"取值：12px~24px（375px 手机≈19px，
     500px 以内都很克制）。≥720px 的桌面端在 layout.css 的媒体查询里覆盖回
     max(20px, 15vw)，保持原来的宽边距留白风格。 */
  --container-w: none;
  --container-px: clamp(12px, 5vw, 24px);
  --space: 16px;            /* 基准间距（边距统一 8 的倍数） */
}

* { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }
/* 始终为滚动条预留空间（即使页面内容不足以触发滚动），
   避免在内容长短不一的页面间切换时滚动条出现/消失造成 ~17px 的水平跳变
   （site-nav 经 margin-left:auto 吸收剩余宽度，brand↔site-nav 间距随之抖动）。 */
html { scrollbar-gutter: stable; }

body {
  margin: 0;
  /* 衬线字体：拉丁优先 Georgia/Times，中文回退宋体族。
     后续自托管 IBM Plex Serif + 思源宋体 woff2 时，替换为 @font-face 字体名即可。 */
  font-family: Georgia, "Times New Roman", "Source Han Serif SC",
               "Noto Serif CJK SC", "Songti SC", "SimSun", serif;
  background: var(--bg);
  color: var(--ink);
  line-height: 1.65;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

img { max-width: 100%; display: block; }
/* 链接默认用墨色，悬停/选中才显示蓝色——蓝色只表示“正在突出”的元素 */
a { color: var(--ink); text-decoration: none; }
a:hover { color: var(--accent); }

code {
  background: #f5f5f5;
  padding: 0.1em 0.35em;
  border-radius: 0;
  font-size: 0.92em;
}

h1, h2, h3, h4 { line-height: 1.3; margin: 0 0 0.5em; }
p { margin: 0 0 1em; }

.container {
  max-width: none;
  margin: 0 auto;
  padding: 0 var(--container-px);
}
