/* 终南六爻界面样式（2026-07-25 并入）。全部规则限定 #sys-liuyao 作用域，
   与八字界面同名类（.grid/.seg/.chk 等）互不干扰；调色板复用 styles.css 的 :root 变量。 */
#sys-liuyao .card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px;margin-bottom:16px}
/* 模式页签照八字命例页样式（2026-07-25 用户定）：行内紧凑按钮、选中朱砂红。
   ⚠️ 用 .seg.lymode 提权：通用 .seg（爻名选择器用）声明在后会覆盖同名属性 */
#sys-liuyao .seg.lymode{display:inline-flex;flex:none;margin:0 0 14px}
#sys-liuyao .seg.lymode button{flex:none;font-size:13px;padding:8px 16px}
#sys-liuyao .seg.lymode button.on{background:var(--seal);color:#fff}
#sys-liuyao .hidden{display:none!important}
#sys-liuyao .grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
#sys-liuyao .span2{grid-column:1/-1}
#sys-liuyao label{display:block;font-size:12px;color:var(--ink-soft);margin:0 0 4px 2px;letter-spacing:.03em}
#sys-liuyao input,#sys-liuyao select{width:100%;font:inherit;font-size:16px;color:var(--ink);background:#fffdf7;border:1px solid var(--line);border-radius:8px;padding:8px 9px;outline:none}

#sys-liuyao .yaoform{margin:14px 0 4px;display:flex;flex-direction:column;gap:6px}
#sys-liuyao .yaorow{display:flex;align-items:center;gap:10px}
#sys-liuyao .yaorow .lab{flex:0 0 40px;font-family:var(--serif);font-size:14px;letter-spacing:.1em;color:var(--ink-soft)}
#sys-liuyao .seg{display:flex;border:1px solid var(--line);border-radius:8px;overflow:hidden;flex:1;margin:0}
#sys-liuyao .seg button{flex:1;border:0;background:#fffdf7;font:inherit;font-size:13px;padding:8px 0;cursor:pointer;color:var(--ink-soft)}
#sys-liuyao .seg button.on{background:var(--ink);color:var(--paper)}
#sys-liuyao .seg button.dong.on{background:var(--fire)}

#sys-liuyao .gz4{grid-template-columns:1fr 1fr 1fr 1fr}
#sys-liuyao .dongrow{display:flex;align-items:center;gap:12px;margin:10px 2px 0;flex-wrap:wrap}
#sys-liuyao .dongrow .lab{font-size:12px;color:var(--ink-soft);letter-spacing:.03em}
#sys-liuyao .opts{display:flex;align-items:center;gap:14px;margin:12px 2px 0}
#sys-liuyao .chk{display:flex;align-items:center;gap:5px;font-size:13px;color:var(--ink);margin:0}
#sys-liuyao .chk input{width:auto}
#sys-liuyao .go{margin-top:12px;text-align:center;display:flex;justify-content:center} /* 八字全局 .go 是 flex 左排，此处强制居中 */
#sys-liuyao .go .primary{font:inherit;background:var(--ink);color:var(--paper);border:0;border-radius:9px;
  padding:10px 46px;font-size:16px;letter-spacing:.3em;cursor:pointer}
#sys-liuyao button.ghost{font:inherit;font-size:12.5px;background:transparent;border:1px solid var(--line);
  color:var(--ink-soft);border-radius:7px;padding:5px 10px;cursor:pointer}
#sys-liuyao .hint{font-size:12px;color:var(--ink-soft);margin-top:10px}

#sys-liuyao .meta{font-size:14px;display:flex;flex-direction:column;gap:4px;margin-bottom:12px}
#sys-liuyao .meta .k{color:var(--ink-soft);margin-right:4px}
#sys-liuyao .meta .kong{color:var(--fire);white-space:nowrap} /* 【旬空: 辰巳】禁拆行 */
/* ⚠️ 八字全局 .gz 是四柱大字（30px/600），六爻干支必须显式改回随行内字号 */
#sys-liuyao .gz{font-family:var(--serif);letter-spacing:.06em;font-size:inherit;font-weight:inherit;line-height:inherit}
#sys-liuyao .w-wood{color:var(--wood)} #sys-liuyao .w-fire{color:var(--fire)} #sys-liuyao .w-earth{color:var(--earth)}
#sys-liuyao .w-metal{color:var(--metal)} #sys-liuyao .w-water{color:var(--water)}

/* 卦头列头行：本卦头在本卦列上方、之卦头在之卦列上方（静卦单头居中跨全表）。
   ⚠️ 选择器带 .board 提权：否则被后声明的 .board td 的 nowrap/overflow:hidden 覆盖（手机上之卦头被裁掉过） */
#sys-liuyao .board .ghrow td{font-family:var(--serif);font-size:16px;letter-spacing:.06em;
  padding:2px 2px 10px;white-space:normal;overflow:visible}
#sys-liuyao .ghrow .gh-only{text-align:center;font-size:18px}
#sys-liuyao .ghrow .tag{display:inline-block;font-family:var(--ui);font-size:12px;color:var(--wood);
  border:1px solid var(--wood);border-radius:5px;padding:0 6px;margin-left:6px;vertical-align:2px}
#sys-liuyao .ghrow .gh-bian{font-size:14px}
#sys-liuyao .ghrow td[data-name]{cursor:pointer}
#sys-liuyao .gh-link{color:var(--fire)}
#sys-liuyao .ghrow td[data-name]:hover .gh-link{text-decoration:underline}

/* 固定列宽 + 左对齐：每列起笔一致，空/破角标与动爻符号占固定槽位，六爻上下必须对齐 */
#sys-liuyao table.board{width:100%;border-collapse:collapse;table-layout:fixed}
#sys-liuyao .board td{padding:4px 2px;text-align:left;font-size:15px;vertical-align:middle;overflow:hidden;white-space:nowrap;cursor:pointer}
#sys-liuyao .board tr{border-bottom:1px dashed var(--line-soft)}
#sys-liuyao .board tr:last-child{border-bottom:0}
#sys-liuyao .board col.c-liushen{width:30px}
#sys-liuyao .board col.c-fushen{width:96px}
#sys-liuyao .board col.c-qingz{width:132px}
#sys-liuyao .board col.c-marks{width:104px}
#sys-liuyao .board col.c-shiying{width:26px}
#sys-liuyao .board .liushen{font-family:var(--serif);color:var(--ink-soft);text-align:center}
#sys-liuyao .board .fushen{font-size:12.5px;color:var(--ink-soft)}
#sys-liuyao .board .qingz{font-family:var(--serif);letter-spacing:.05em}
/* 本卦区与之卦列之间隔开（2026-07-25 用户定）：淡虚线分隔；整列内容居中（列头+爻行，
   各行内容等宽故居中后上下仍对齐） */
#sys-liuyao .board td.biancell{font-family:var(--serif);letter-spacing:.05em;color:var(--ink);
  border-left:1px dashed var(--line-soft);text-align:center;padding-left:4px;padding-right:4px;
  overflow:visible} /* 居中列禁止两侧裁切：字体偏宽的手机上宁可微溢出也要可见 */
#sys-liuyao .board .ghrow td.gh-bian{border-left:1px dashed var(--line-soft);text-align:center;
  padding-left:4px;padding-right:4px}
#sys-liuyao .board .shiying{font-family:var(--serif);text-align:center}
#sys-liuyao .yao{display:inline-flex;width:76px;height:12px;gap:8px;vertical-align:middle}
#sys-liuyao .yao i{background:var(--ink);border-radius:2px;flex:1;height:100%}
#sys-liuyao .yao.small{margin-right:6px} /* 与本卦爻画同尺寸（2026-07-25 用户定） */
#sys-liuyao .bian-static{opacity:.72} /* 未动行淡显；曾 .5 手机上看不清（2026-07-25 用户反馈） */
#sys-liuyao .dongmark{display:inline-block;width:20px;text-align:center;font-size:14px;color:var(--fire);
  margin-left:4px;vertical-align:middle;font-weight:700}
#sys-liuyao .fu-inline{display:none}
#sys-liuyao .smalltag{display:inline-block;font-size:10.5px;line-height:1.3;border:1px solid currentColor;
  border-radius:4px;padding:0 3px;margin-left:3px;vertical-align:2px}
#sys-liuyao .t-kong{color:var(--fire)} #sys-liuyao .t-po{color:var(--water)}

/* 本·互·变·错·综 卦画一栏（本卦组 + 之卦互体组，各自一行流式） */
#sys-liuyao .guarow{display:block;margin-top:6px;padding-top:6px;border-top:1px dashed var(--line)}
/* 等分 7 列网格（5互+错+综）：本卦组/之卦组同一模板故逐列上下对齐 */
#sys-liuyao .guaset{display:grid;grid-template-columns:repeat(7,1fr);gap:10px 8px;justify-items:center}
#sys-liuyao .gg-lab{text-align:center;font-size:12px;color:var(--ink-soft);
  letter-spacing:.25em;margin:6px 0 2px}
#sys-liuyao .guagrp+.guagrp{margin-top:6px;padding-top:2px;border-top:1px dashed var(--line)}
#sys-liuyao .guafig{text-align:center;cursor:pointer;border:1px solid transparent;border-radius:10px;padding:8px 10px}
#sys-liuyao .guafig:hover{border-color:var(--line);background:#fffdf7}
#sys-liuyao .gf-lab{font-size:11.5px;color:var(--ink-soft);letter-spacing:.1em;margin-bottom:5px}
#sys-liuyao .glines{display:flex;flex-direction:column;gap:4px;align-items:center}
#sys-liuyao .gl{display:inline-flex;width:46px;height:7px;gap:5px}
#sys-liuyao .gl i{background:var(--ink);border-radius:1.5px;flex:1;height:100%}
#sys-liuyao .gf-name{display:block;margin:6px auto 0;font-family:var(--serif);font-size:13.5px;
  letter-spacing:.05em;color:var(--fire);padding:0}

#sys-liuyao .textlinks{margin-top:14px;padding-top:10px;border-top:1px dashed var(--line)}
#sys-liuyao .tl-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin-bottom:6px}
#sys-liuyao .tl-k{font-size:12px;color:var(--ink-soft);letter-spacing:.1em;margin-right:4px}
#sys-liuyao button.link{font:inherit;font-size:13px;background:#fffdf7;border:1px solid var(--line);
  color:var(--water);border-radius:6px;padding:3px 9px;cursor:pointer}
#sys-liuyao button.link:hover{border-color:var(--water)}
#sys-liuyao button.link.hit{color:var(--fire);border-color:var(--fire);font-weight:600}
#sys-liuyao .cidisplay{margin-top:10px;padding:12px 14px;background:#fffdf7;border:1px solid var(--line-soft);
  border-radius:9px;font-size:14px;line-height:1.9}
#sys-liuyao .cidisplay h4{font-family:var(--serif);font-size:16px;letter-spacing:.1em;margin-bottom:6px}
#sys-liuyao .cidisplay .ci-main{font-family:var(--serif)}
#sys-liuyao .cidisplay ul{list-style:none;margin-top:4px;padding:0}
#sys-liuyao .cidisplay li{font-family:var(--serif)}
#sys-liuyao .cidisplay p{margin:4px 0}
#sys-liuyao .ci-note{margin-top:8px;font-size:11.5px;color:var(--ink-soft)}
#sys-liuyao .tabbar{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 10px}
#sys-liuyao button.tab{font:inherit;font-size:12.5px;background:transparent;border:1px solid var(--line);
  color:var(--ink-soft);border-radius:6px;padding:3px 10px;cursor:pointer}
#sys-liuyao button.tab.on{background:var(--ink);border-color:var(--ink);color:var(--paper)}
#sys-liuyao .src-body{max-height:360px;overflow-y:auto;padding-right:6px}
#sys-liuyao .yl-hit{background:var(--paper-2);border:1px solid var(--line);border-radius:8px;
  padding:8px 10px;margin-bottom:8px;font-family:var(--serif)}
#sys-liuyao .src-body p{margin:6px 0;text-indent:0}
#sys-liuyao .src-body h5{font-family:var(--serif);font-size:14px;letter-spacing:.1em;margin:10px 0 4px;
  border-left:3px solid var(--line);padding-left:8px}

@media (max-width:520px){
  #sys-liuyao .gz4{grid-template-columns:1fr 1fr}
  /* 窄屏保底：表格设最小宽度，容器装不下时结果卡横向滚动——之卦列宁可滚动、绝不裁字 */
  #sys-liuyao #result-card{overflow-x:auto}
  #sys-liuyao table.board{min-width:250px}
  #sys-liuyao .board td{font-size:13.5px;padding:4px 1px}
  /* 伏神列窄屏收起：不能 display:none（会让后续单元格左移错列），列宽 0 + 去内边距即隐 */
  #sys-liuyao .board td.fushen{padding:0}
  #sys-liuyao .fu-inline{display:block;font-size:10.5px;color:var(--ink-soft);letter-spacing:0}
  /* 列宽按内容贴身（2026-07-25 用户要求紧凑）：六亲列=4字+空破角标，爻画列=爻画+动符 */
  #sys-liuyao .board col.c-liushen{width:16px}
  #sys-liuyao .board col.c-fushen{width:0}
  #sys-liuyao .board col.c-qingz{width:82px}
  #sys-liuyao .board col.c-marks{width:48px}
  #sys-liuyao .board col.c-shiying{width:15px}
  #sys-liuyao .board .qingz{letter-spacing:0}
  #sys-liuyao .board td.biancell{letter-spacing:0;padding-left:3px;padding-right:2px}
  #sys-liuyao .board .ghrow td.gh-bian{padding-left:3px;padding-right:2px}
  #sys-liuyao .yao{width:34px;gap:4px}
  /* 之卦爻画窄屏与本卦同尺寸（2026-07-25 用户定） */
  #sys-liuyao .yao.small{margin-right:4px}
  #sys-liuyao .dongmark{width:12px;margin-left:1px}
  /* 八卦类象窄屏固定四列网格：标签占整行，八卦两行排齐（散排会错位+孤行） */
  #sys-liuyao .tl-row{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
  #sys-liuyao .tl-row .tl-k{grid-column:1/-1;margin:0 0 2px}
  #sys-liuyao .tl-row button.link{text-align:center;padding:4px 2px}
  /* 互错综卦画窄屏：3 列网格（两组同模板仍逐列对齐），收紧间距 */
  #sys-liuyao .guaset{grid-template-columns:repeat(3,1fr);gap:8px 6px}
  #sys-liuyao .guafig{padding:6px 6px}
  /* 窄屏列头：宫名一行、卦名换行独立一行，避免在窄列里被腰斩 */
  #sys-liuyao .board .ghrow td{font-size:13px;letter-spacing:0}
  #sys-liuyao .ghrow .gh-bian{font-size:12px}
  #sys-liuyao .ghrow .gh-bian .gh-link{display:block;font-size:13.5px;margin-top:1px}
  #sys-liuyao .ghrow .tag{font-size:10.5px;padding:0 4px;margin-left:3px}
}

/* 顶部系统页签（八字｜六爻），在共用 header 下方 */
.sys-seg{display:flex;border:1px solid var(--line);border-radius:10px;overflow:hidden;margin:0 0 14px}
.sys-seg button{flex:1;border:0;background:#fffdf7;font:inherit;font-family:var(--serif);font-size:14.5px;
  letter-spacing:.12em;padding:10px 4px;cursor:pointer;color:var(--ink-soft);white-space:nowrap}
@media (max-width:520px){.sys-seg button{font-size:12px;letter-spacing:0;padding:8px 3px;line-height:1.22;white-space:normal;word-break:break-all}}
.sys-seg button.on{background:var(--ink);color:var(--paper)}

/* 占问记录区（2026-07-25） */
#sys-liuyao .lyrec-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}
#sys-liuyao .lyrec-head input{width:170px;flex:0 1 auto;font-size:14px;padding:6px 9px}
#sys-liuyao .lysave-row{text-align:right;margin-bottom:6px}
#sys-liuyao #ly-save{background:var(--ink);border-color:var(--ink);color:var(--paper)} /* 黑底（2026-07-25 用户定） */
#sys-liuyao .shuo{font-family:var(--serif);margin:4px 0;background:var(--paper-2);
  border-left:3px solid var(--earth);border-radius:0 6px 6px 0;padding:6px 10px}
#sys-liuyao .ss-line{line-height:1.9}
#sys-liuyao .ss-it{white-space:nowrap;font-family:var(--serif)}