/* ============================================================
   Pengyouquan · tokens.css（V3 融合审美版 · 数值全部定死）
   kanle 骨架与时间灰 + zibll 圆角派生与渐变纪律 + B2 蓝调阴影与 tabular-nums
   主题色只需覆盖 --brand 一个值（layout.html 注入），其余全部 color-mix 派生
   ============================================================ */

:root {
  /* ── 色彩 · 亮色（V3 5.1）── */
  --bg-page:    #f0f1f4;  /* 页面底，加深半档让阴影有落点 */
  --bg-card:    #ffffff;
  --bg-inset:   #f7f7f8;  /* 卡片内嵌区（音乐条 / 引用 / 公告底） */
  --bg-chip:    #eef1f8;
  --text-1:     #1a1a1a;
  --text-2:     #4a4a4f;
  --text-3:     #9a9a9f;
  --text-time:  #b2b2b2;  /* 时间戳专用灰（kanle 原值） */
  --line:       #f2f2f4;  /* 分割线 = 底色系，若有若无 */
  --brand:      #576b95;  /* 微信蓝，灵魂色值不许换 */
  /* 原始品牌色（layout.html 后台注入时与 --brand 一起覆盖）：
     暗色提亮从它派生，避免 --brand 在 html.dark 内自引用造成循环失效 */
  --brand-raw:  #576b95;
  --brand-2:    color-mix(in srgb, var(--brand) 85%, #ffffff); /* 渐变起点（派生自品牌色） */
  --brand-soft: #eef1f8;
  --like:       #fa5151;
  --footer-bg:  #2b3445;  /* 页脚深色压阵 */
  --footer-text:#d5dae2;

  /* ── 阴影（V3 5.2 · 全站唯一阴影，B2 蓝调）── */
  --shadow-card: 0 4px 16px 0 rgb(13 39 91 / 6%);
  --shadow-hover: 0 6px 20px 0 rgb(13 39 91 / 10%);

  /* ── 圆角（V3 5.3 · zibll 派生体系）── */
  --r-main: 8px;
  --r-mini: calc(var(--r-main) / 2);  /* 4px：小徽章 */
  --r-full: 100px;                    /* 胶囊：标签底 / 发布按钮 */

  /* ── 排版（V3 5.4）── */
  --font-sans: -apple-system, BlinkMacSystemFont, 'PingFang SC',
               'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
  --fs-body:  15px;
  --fs-name:  13.5px;
  --fs-meta:  12px;
  --fs-label: 11.5px;
  --lh-body:  1.7;
  --lh-read:  1.8;    /* 长文章专用（阶段 4 启用） */

  /* ── 布局（V3 5.8）── */
  --wrap: 1180px;
  --col-side: 200px;
  --col-main: 600px;
  --col-extra: 226px;
  --gap-col: 18px;

  /* ── 动效 ── */
  --ease: cubic-bezier(0.25, 0.1, 0.25, 1);
}

/* ── 暗色（html.dark 覆写；数值来自 V3 5.1 暗色列）── */
html.dark {
  --bg-page:    #101014;
  --bg-card:    #1c1c21;
  --bg-inset:   #242429;
  --bg-chip:    color-mix(in srgb, var(--bg-card) 92%, var(--brand));
  /* 暗色品牌色提亮（V3.6）：亮色值直接放暗底上偏闷，设计稿基准 #8ba0cc；
     从 --brand-raw 派生（≈40% 混白）——后台换主题色时暗色自动联动提亮。
     不能引用 var(--brand)：同块自引用是循环依赖，整条声明会被浏览器作废 */
  --brand:      color-mix(in srgb, var(--brand-raw) 60%, #ffffff);
  --text-1:     #e6e6ea;  /* 非纯白 */
  --text-2:     #a8a8b0;
  --text-3:     #6a6a72;
  --text-time:  #6a6a72;
  --line:       #2a2a30;
  --brand-soft: color-mix(in srgb, var(--bg-card) 85%, var(--brand));
  --shadow-card: 0 4px 16px 0 rgb(0 0 0 / 22%);  /* 暗色换 --shadow-key */
  --shadow-hover: 0 6px 20px 0 rgb(0 0 0 / 30%);
}