/* ============================================================================
   歆梦术数 · 共享设计令牌（tokens.css）
   ----------------------------------------------------------------------------
   本文件是「朱墨纸本」世界的唯一真源。页面只允许覆盖主题色（--theme/--theme-2）
   与五行色语义，其余中性层、纸面、描边、阴影、排版刻度、浏览器表面一律从这里取。

   用法（放在页面 <style> 之前）：
     <link rel="stylesheet" href="tokens.css?v=20261031a">
     <style>
       :root{ --theme:#7c1d1d; --theme-2:#a83232; }   ← 只覆盖主色
     </style>

   约定见 DESIGN.md。硬指标：小字 ≥4.5:1 / 字号只用本文件的刻度 / 溢出 0。
   ============================================================================ */

:root{
  /* ---- 纸面层次（暖白，非冷灰） ---- */
  --bg:#f4f1ec;          /* 宣纸底 */
  --bg-deep:#ece7df;     /* 页脚/分隔带 */
  --card:#fffefb;        /* 卡面：微暖白，不是纯白 */
  --card-2:#faf7f1;      /* 次级面：行头/内嵌块/hover */

  /* ---- 墨色阶梯（全部偏棕暖；中性灰在朱红世界里是异色） ---- */
  --ink:#211d19;         /* 正文 15.8:1 */
  --ink-2:#4e463d;       /* 次要正文 9.2:1 */
  --ink-3:#6d6357;       /* 辅助文字 5.8:1 —— 允许的最低正文色 */
  --ink-4:#a0958a;       /* 仅描边/占位，不作正文 */

  --text:var(--ink);
  --text-2:var(--ink-2);
  --text-3:var(--ink-3);

  /* ---- 描边：由「画格子」改为「提层次」 ---- */
  --line:#e2dbd0;
  --line-2:#efe9df;
  --line-strong:#d3c9ba;

  /* ---- 默认主色（朱墨纸本）；各页可覆盖 ---- */
  --theme:#7c1d1d;
  --theme-2:#a83232;
  --theme-deep:#5e1414;
  --theme-soft:#fbeff0;
  --gold:#b8860b;

  /* ---- 五行语义色（全站统一） ----
     每个色有两个角色：
       --x      = 文字/描边用色（对 --x-bg 与 --card 均 ≥4.5:1）
       --x-mark = 色块/徽标填充用色（与白色文字对比 ≥3:1，且更鲜艳）
     把 --x 直接当背景填白字会不达标，反之亦然。 */
  --jin:#5f6672;   --jin-mark:#7d8697;   --jin-bg:#f4f5f7;
  --mu:#17794a;    --mu-mark:#1a8a53;    --mu-bg:#e9f6ef;
  --shui:#1a63ab;  --shui-mark:#1b6fc0;  --shui-bg:#e8f0fa;
  --huo:#c62b20;   --huo-mark:#d4352a;   --huo-bg:#fdecea;
  --tu:#8f6512;    --tu-mark:#b8860b;    --tu-bg:#fbf4e4;

  /* ---- 圆角刻度 ---- */
  --r-xs:6px; --r-sm:8px; --r-md:10px; --r-lg:14px; --r-xl:18px;
  --radius:var(--r-lg);

  /* ---- 阴影：暖棕而非冷蓝，带 y 偏移 + 柔散 ---- */
  --shadow:0 1px 2px rgba(66,44,24,.05),0 2px 8px rgba(66,44,24,.045);
  --shadow-lg:0 2px 6px rgba(66,44,24,.06),0 12px 28px rgba(66,44,24,.075);
  --shadow-inset:inset 0 1px 0 rgba(255,255,255,.7);

  /* ---- 排版刻度（比例 1.2；只用这 8 档） ---- */
  --fs-micro:11.5px;   /* 标签/角标/表头 */
  --fs-cap:12.5px;     /* 说明文字/次要按钮 */
  --fs-body:13.5px;    /* 正文默认 */
  --fs-lead:15px;      /* 卡题/引导句/主按钮 */
  --fs-h3:16.5px;
  --fs-h2:19px;
  --fs-h1:23px;
  --fs-gz:24px;        /* 四柱/干支大字 */

  --f-serif:"Songti SC","Noto Serif SC","Source Han Serif SC",Georgia,"Times New Roman",serif;
  --f-sans:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  --f-num:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
}

/* ============================================================================
   基础层：字体、纸面、浏览器自带表面
   —— 页面可覆盖 font-size/背景，但不要重复定义这些
   ============================================================================ */
html{-webkit-text-size-adjust:100%}
body{
  font-family:var(--f-sans);
  color:var(--text);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

/* 浏览器自带表面：不属于任何设计系统，必须自己接管 */
::selection{background:rgba(124,29,29,.16);color:var(--theme-deep)}
:focus-visible{outline:2px solid var(--theme-2);outline-offset:2px;border-radius:4px}
input,select,textarea{caret-color:var(--theme-2)}
*{scrollbar-width:thin;scrollbar-color:var(--line-strong) transparent}
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--line-strong);border-radius:9px;border:2px solid var(--bg)}
::-webkit-scrollbar-thumb:hover{background:var(--ink-4)}

/* 数字等宽：命盘/年份/金额类表格对齐才不抖 */
.ztab,.dy-tab,.ly-tab,.info-tab,.ly-tab,.zwinfo,.g4,.ys-num,.gz-char,.xy-gz,.ln .gz{
  font-variant-numeric:tabular-nums;
}

/* 减少动效偏好 */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
}


/* ============================================================================
   共享组件：品牌页头（.hd / .hd-top / .hd-logo / .hd-tt / .hd-nav）
   —— 四页原本各写一份，必然漂移；此处为唯一实现，页面只覆盖背景渐变。
   ============================================================================ */
.hd{position:relative;padding:18px 18px 0;overflow:hidden;
  border-radius:0 0 var(--r-xl) var(--r-xl);
  background:
    linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,0) 46%),
    linear-gradient(135deg,var(--theme-deep) 0%,var(--theme) 46%,var(--theme-2) 130%);
  box-shadow:0 1px 0 rgba(255,255,255,.1) inset,0 8px 24px -8px rgba(61,42,20,.45)}
/* 顶 2px / 底 1px 金线压边：线装书语汇，替代装饰光斑 */
.hd::before{content:'';position:absolute;left:0;right:0;bottom:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,226,196,.32) 22%,rgba(255,226,196,.32) 78%,transparent)}
.hd::after{content:'';position:absolute;left:18px;right:18px;top:0;height:2px;
  background:linear-gradient(90deg,transparent,rgba(255,226,196,.52),transparent)}
.hd-top{display:flex;align-items:center;gap:13px;position:relative;z-index:1}
.hd-logo{width:42px;height:42px;flex-shrink:0;border-radius:var(--r-md);display:flex;
  align-items:center;justify-content:center;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,226,196,.3);color:#ffe6c2;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14)}
.hd-logo svg{width:24px;height:24px}
.hd-tt{flex:1;min-width:0}
.hd h1{font-family:var(--f-serif);font-size:var(--fs-h1);margin:0;color:#fff;
  letter-spacing:.16em;font-weight:600;line-height:1.2}
.hd .sub{font-size:var(--fs-cap);color:rgba(255,236,214,.88);margin-top:5px;
  letter-spacing:.06em;line-height:1.5}
.hd-nav{display:flex;gap:6px;margin-top:16px;padding-bottom:15px;overflow-x:auto;
  position:relative;z-index:1;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.hd-nav::-webkit-scrollbar{display:none}
.hd-nav a{flex-shrink:0;display:inline-flex;align-items:center;gap:6px;
  font-size:var(--fs-cap);line-height:1;min-height:34px;
  color:rgba(255,255,255,.84);text-decoration:none;padding:7px 12px;
  border-radius:var(--r-sm);white-space:nowrap;background:transparent;
  border:1px solid rgba(255,255,255,.14);
  transition:background .18s ease-out,border-color .18s ease-out,color .18s ease-out}
.hd-nav a:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.26);color:#fff}
.hd-nav a.on{background:rgba(255,255,255,.96);color:var(--theme-deep);font-weight:600;
  border-color:transparent;box-shadow:0 1px 2px rgba(50,34,16,.26)}
.hd-nav svg{width:13px;height:13px;flex-shrink:0;opacity:.88}

/* ============================================================================
   站点级扩展（2026-11-01）：四类色标 · 墨阶 · 印章 · 竖排题 · 典籍出处 · 术语气泡
   —— 供站点首页与结果页复用；仍遵守「一个色两个角色」与字号刻度铁律。
   ============================================================================ */

:root{
  /* ---- 四类术数色标（命 / 事 / 运 / 缘）----
     文字角色对 --card 与各自 -soft 均 ≥4.5:1；-mark 仅供色块填白字。 */
  --cat-ming:#7c1d1d;  --cat-ming-soft:#fbeff0;  --cat-ming-mark:#8f2626;
  --cat-shi:#1e5e4a;   --cat-shi-soft:#e8f4ef;   --cat-shi-mark:#226b54;
  --cat-yun:#1a4f7a;   --cat-yun-soft:#e9f1f8;   --cat-yun-mark:#1d5c8c;
  --cat-yuan:#7d5a12;  --cat-yuan-soft:#fbf3e3;  --cat-yuan-mark:#9a6f1f;

  /* ---- 墨阶：运势强度用「淡墨→浓墨」表达，替代红绿灯色块 ---- */
  --ink-wash-1:#ded7cb;  /* 最淡 */
  --ink-wash-2:#b8ad9c;
  --ink-wash-3:#7a6f60;
  --ink-wash-4:#3a332c;  /* 最浓 */
}

/* 印章：分区标题与「起盘」的主权标记；半枚骑缝印用于地图题头 */
.seal{display:inline-flex;align-items:center;justify-content:center;
  width:30px;height:30px;flex-shrink:0;
  font-family:var(--f-serif);font-size:var(--fs-cap);font-weight:600;line-height:1;
  color:var(--theme);background:transparent;
  border:1.5px solid var(--theme);border-radius:var(--r-xs);
  letter-spacing:0;transform:rotate(-4deg);opacity:.92}
.seal--round{border-radius:50%}
.seal--sm{width:22px;height:22px;font-size:var(--fs-micro);border-width:1px}
.seal--flat{transform:none}

/* 竖排宋体题头（≤520px 降为横排，避免窄屏字形挤压） */
.vt{writing-mode:vertical-rl;text-orientation:upright;
  font-family:var(--f-serif);letter-spacing:.28em;font-weight:600;
  color:var(--theme);line-height:1.15}
@media(max-width:520px){
  .vt{writing-mode:horizontal-tb;letter-spacing:.12em}
}

/* 典籍出处：结论末尾的行内引，可点回典籍页 */
.cite-source{font-family:var(--f-serif);font-size:var(--fs-micro);color:var(--theme);
  text-decoration:none;border-bottom:1px dotted var(--line-strong);
  margin-left:.35em;white-space:nowrap;padding-bottom:1px}
.cite-source:hover{border-bottom-color:var(--theme);color:var(--theme-deep)}
.cite-source::before{content:'《'}
.cite-source::after{content:'》'}

/* 术语气泡：默认只画可点的下划虚线，气泡由 JS 注入（Phase 2 接入 glossary.js） */
.tip-gloss{position:relative;border-bottom:1px dotted var(--ink-4);
  cursor:help;color:inherit}
.tip-gloss:focus-visible{outline-offset:1px}

/* 术语释义：glossary-tip.js 把正文里的词包成 .gloss；气泡 position:fixed 挂 body，
   因为 .card 是 overflow:hidden，绝对定位会被裁掉 */
.gloss{position:relative;border-bottom:1px dotted var(--ink-4);cursor:pointer;color:inherit;
  transition:border-bottom-color .18s ease-out,color .18s ease-out}
.gloss:hover{border-bottom-color:var(--theme);color:var(--theme-deep)}
.gloss:focus-visible{outline:2px solid var(--theme-2);outline-offset:2px;border-radius:3px}
.gloss[aria-expanded="true"]{background:var(--theme-soft);border-bottom-color:var(--theme);color:var(--theme-deep)}
.gloss-pop{position:fixed;z-index:80;background:var(--card);border:1px solid var(--line);
  border-radius:var(--r-md);box-shadow:var(--shadow-lg);padding:11px 13px;text-align:left;
  font-size:var(--fs-cap);line-height:1.72;color:var(--ink-2)}
.gloss-pop b{display:block;font-family:var(--f-serif);font-size:var(--fs-body);font-weight:600;
  color:var(--ink);letter-spacing:.08em;margin-bottom:5px}
.gloss-pop .s{display:block;margin-top:7px;padding-top:6px;border-top:1px solid var(--line-2);
  font-size:var(--fs-micro);color:var(--theme);text-decoration:none}
.gloss-pop .s-plain{color:var(--ink-3)}
.gloss-pop a.s:hover{text-decoration:underline}

/* 依据块：这张盘的依据（cite-block.js 渲染进 #src-host） */
.src-card{background:var(--card);border:1px solid var(--line-2);border-radius:var(--r-lg);
  box-shadow:var(--shadow);padding:14px 16px;margin:0 0 14px}
.src-hd{display:flex;align-items:center;gap:9px;font-family:var(--f-serif);
  font-size:var(--fs-h3);font-weight:600;color:var(--ink);letter-spacing:.06em;margin-bottom:10px}
.src-hd .dot{width:3px;height:15px;border-radius:2px;background:var(--theme);flex:0 0 auto}
.src-card ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.src-card li{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;
  font-size:var(--fs-cap);color:var(--ink-2);line-height:1.7}
.src-card li b{font-family:var(--f-sans);font-size:var(--fs-body);font-weight:600;
  color:var(--ink);letter-spacing:.04em;flex:0 0 auto}
.src-d{color:var(--ink-3);font-size:var(--fs-micro);flex:1 1 100%;order:3}
.src-card li .cite-source{display:inline-flex;align-items:center;min-height:32px;padding:0 2px}
.cite-source.cite-miss::before,.cite-source.cite-miss::after{content:none}
.cite-miss{color:var(--ink-3);border-bottom-color:var(--line-strong)}


/* 结果页「紫微印证」入口（paipan → hecan） */
#hecan-host{margin:0 0 12px}
.hecan-go{display:inline-flex;align-items:center;min-height:40px;padding:0 14px;
  background:var(--card);border:1px solid var(--theme-2);border-radius:var(--r-md);
  color:var(--theme);font-size:var(--fs-cap);font-weight:600;letter-spacing:.06em;
  text-decoration:none;box-shadow:var(--shadow)}
.hecan-go:hover{background:var(--theme-soft)}

/* 页脚免责：全站统一语气，不写江湖话术 */
.foot-note{text-wrap:pretty;font-size:var(--fs-micro);color:var(--ink-3);line-height:1.7;
  padding:14px 2px 6px;border-top:1px solid var(--line-2);margin-top:18px}

/* 页面级：把页头外观对齐到共享层的边距约定（各页 wrap padding 不同） */
@media (max-width:520px){
  .hd-nav a{padding:9px 13px}
}
@media (max-width:400px){
  .hd h1{font-size:var(--fs-h2)}
}