/* 中州解读区 —— 追加在原有解读下方的独立板块
   配色沿用 tianji：面 #ebecee / 墨 #1c1d21 / 金 #e8c877 */

.zz-block{
  margin-top:22px;
  padding-top:0;
  border-top:1px solid #e4e9ed;
}
.zz-hd{
  display:inline-block;
  margin:18px 0 12px;
  padding:5px 14px;
  background:#1c1d21;
  color:#e8c877;
  font-size:13.5px;
  font-weight:600;
  letter-spacing:.06em;
  border-radius:8px;
}
/* 原先没有其他解读时的说明条 */
.zz-only{
  margin:0 0 14px;
  padding:9px 12px;
  background:#f7f8f9;
  border-left:3px solid #a98132;
  border-radius:0 8px 8px 0;
  color:#7e8f9e;
  font-size:12.5px;
  line-height:1.6;
}
/* 小节标题 */
.zz-block .zz-sec{
  margin:18px 0 9px;
  color:#18232c;
  font-size:16px;
  font-weight:600;
  font-family:'Noto Serif SC','Noto Serif',serif;
}
.zz-block .zz-sec:first-of-type{ margin-top:4px; }
/* 正文 */
.zz-block p{
  margin:0 0 11px;
  color:#4a5d6e;
  font-size:14.5px;
  line-height:1.95;
}
.zz-block b{ color:#18232c; font-weight:600; }
/* 盘面信息行 */
.zz-block .m-row{
  display:flex; gap:10px; align-items:baseline;
  padding:5px 0;
  font-size:13px; color:#4a5d6e;
  border-bottom:1px dashed #e4e9ed;
}
.zz-block .m-row span:first-child{
  flex:0 0 46px; color:#7e8f9e; font-size:12px;
}
/* 折叠：默认收起靠后内容 */
.zz-block .zz-more{
  margin-top:10px;
  color:#a98132; font-size:13px; cursor:pointer;
  user-select:none;
}
.zz-block .zz-more:hover{ text-decoration:underline; }
.zz-block .zz-fold{ display:none; }
.zz-block .zz-fold.on{ display:block; }

/* 未付费试读截断提示 */
.zz-lock{
  margin-top:16px; padding:16px 14px;
  background:linear-gradient(180deg,#f7f8f9 0%,#ebecee 100%);
  border:1px solid #e4e9ed; border-radius:12px; text-align:center;
}
.zz-lock-t{ color:#18232c; font-size:14px; font-weight:600; margin-bottom:5px; }
.zz-lock-d{ color:#7e8f9e; font-size:12.5px; line-height:1.7; }

@media (max-width:720px){
  .zz-block p{ font-size:14px; line-height:1.9; }
  .zz-block .zz-sec{ font-size:15.5px; }
}

/* 正文重点加粗：AI 每段落一个结论。墨色加重 + 极淡金色底纹，
   不用金色字 —— 金色按铁律只给按钮用。 */
.zz-block strong{
  color:#18232c; font-weight:600;
  background:linear-gradient(180deg,transparent 62%,#f2e6ca 62%);
}

/* 现场生成占位框：盘面已经出来了，只有这一块还在写 */
.zz-block .zz-gen{
  padding:22px 16px; text-align:center;
  background:#f7f8f9; border:1px dashed #e4e9ed; border-radius:12px;
}
.zz-block .zz-gen-t{
  color:#18232c; font-size:14px; font-weight:600; margin-bottom:6px;
}
.zz-block .zz-gen-t::after{
  content:''; display:inline-block; vertical-align:middle;
  width:11px; height:11px; margin-left:7px;
  border:2px solid #e8c877; border-top-color:transparent; border-radius:50%;
  animation:zzspin .8s linear infinite;
}
.zz-block .zz-gen-d{ color:#7e8f9e; font-size:12.5px; line-height:1.75; }
@keyframes zzspin{ to{ transform:rotate(360deg); } }

/* ───────────────────────────────────────────────
   修正：CSS 原来写的是 .zz-sec / p，但实际渲染出来的是
   .zz-h（小标题）/ .zz-t（正文）/ .zz-it（每条），
   类名对不上 → 标题样式从来没生效过，整篇没有层次。
   ─────────────────────────────────────────────── */

/* 小标题：加粗 + 墨色 + 左侧金色竖条，板块之间明显断开 */
.zz-block .zz-h{
  position:relative;
  margin:30px 0 14px;
  padding-left:11px;
  color:#18232c;
  font-size:16.5px;
  font-weight:700;
  line-height:1.5;
  font-family:'Noto Serif SC','Noto Serif',serif;
  letter-spacing:.3px;
}
.zz-block .zz-h::before{
  content:'';
  position:absolute; left:0; top:.18em; bottom:.18em;
  width:3px; border-radius:2px;
  background:#e8c877;
}
/* 板块之间加一道分隔线，层次更清楚 */
.zz-block .zz-sec + .zz-sec{
  margin-top:26px;
  padding-top:4px;
  border-top:1px solid #edf0f2;
}
.zz-block .zz-sec:first-of-type .zz-h{ margin-top:6px; }

/* 正文：每条独立成段，段间留白 */
.zz-block .zz-t{
  margin:0 0 13px;
  color:#4a5d6e;
  font-size:14.5px;
  line-height:1.95;
}
.zz-block .zz-it:last-child .zz-t{ margin-bottom:0; }

@media (max-width:720px){
  .zz-block .zz-h{ font-size:15.5px; margin:24px 0 12px; }
  .zz-block .zz-t{ font-size:14px; line-height:1.9; }
  .zz-block .zz-sec + .zz-sec{ margin-top:22px; }
}

/* ───────────────────────────────────────────────
   第二次修正。前一版写的是 .zz-block .zz-h，但中州内容实际
   走的是 dimtabs 那条渲染路径（u.html 第 1451 行 else if(d.text)），
   外层是 .panel > .tx，没有 .zz-block —— 后代选择器全部落空。
   这里改成同时匹配两条路径。
   ─────────────────────────────────────────────── */

/* 小标题：加粗 + 放大 + 左侧金色竖条 */
.zz-block .zz-h,
.tx .zz-h{
  position:relative;
  display:block;
  margin:32px 0 14px;
  padding-left:12px;
  color:#18232c;
  font-size:17px;
  font-weight:700;
  line-height:1.5;
  font-family:'Noto Serif SC','Noto Serif',serif;
  letter-spacing:.3px;
}
.zz-block .zz-h::before,
.tx .zz-h::before{
  content:'';
  position:absolute; left:0; top:.2em; bottom:.2em;
  width:3.5px; border-radius:2px;
  background:#e8c877;
}

/* 板块：卡片式分组，块与块之间明显断开 */
.zz-block .zz-sec,
.tx .zz-sec{
  display:block;
  margin:0 0 18px;
  padding:2px 0 16px;
  border-bottom:1px solid #edf0f2;
}
.zz-block .zz-sec:last-child,
.tx .zz-sec:last-child{ border-bottom:none; margin-bottom:0; padding-bottom:0; }
.zz-block .zz-sec:first-child .zz-h,
.tx .zz-sec:first-child .zz-h{ margin-top:6px; }

/* 正文：每条独立成段 */
.zz-block .zz-t,
.tx .zz-t{
  display:block;
  margin:0 0 13px;
  color:#4a5d6e;
  font-size:14.5px;
  line-height:1.95;
}
.zz-block .zz-it,
.tx .zz-it{ display:block; }
.zz-block .zz-it:last-child .zz-t,
.tx .zz-it:last-child .zz-t{ margin-bottom:0; }

/* 重点句：墨色加粗 + 淡金底纹（金色字留给按钮，这里只用底纹） */
.zz-block strong, .zz-block b,
.tx .zz-t strong, .tx .zz-t b{
  color:#18232c; font-weight:600;
  background:linear-gradient(180deg,transparent 62%,#f5e9d0 62%);
}

/* 现场生成占位框 */
.zz-block .zz-gen, .tx .zz-gen{
  padding:22px 16px; text-align:center;
  background:#f7f8f9; border:1px dashed #e4e9ed; border-radius:12px;
}
.zz-block .zz-gen-t, .tx .zz-gen-t{
  color:#18232c; font-size:14px; font-weight:600; margin-bottom:6px;
}
.zz-block .zz-gen-t::after, .tx .zz-gen-t::after{
  content:''; display:inline-block; vertical-align:middle;
  width:11px; height:11px; margin-left:7px;
  border:2px solid #e8c877; border-top-color:transparent; border-radius:50%;
  animation:zzspin .8s linear infinite;
}
.zz-block .zz-gen-d, .tx .zz-gen-d{
  color:#7e8f9e; font-size:12.5px; line-height:1.75;
}

@media (max-width:720px){
  .zz-block .zz-h, .tx .zz-h{ font-size:16px; margin:26px 0 12px; }
  .zz-block .zz-t, .tx .zz-t{ font-size:14px; line-height:1.9; }
  .zz-block .zz-sec, .tx .zz-sec{ margin-bottom:16px; padding-bottom:14px; }
}

/* 生成进度条。服务端不回报真实进度，条子按预期时长推进、封顶 92%，
   拿到结果才冲 100% —— 不做那种跑满了还在转的假进度。 */
.zz-block .zz-bar, .tx .zz-bar{
  position:relative;
  height:5px; margin:14px auto 9px; max-width:280px;
  background:#e7eaed; border-radius:3px; overflow:hidden;
}
.zz-block .zz-bar > i, .tx .zz-bar > i{
  display:block; height:100%; width:0;
  border-radius:3px;
  background:linear-gradient(90deg,#d8b45f,#e8c877);
  transition:width .9s cubic-bezier(.3,.8,.4,1);
}
/* 条子上跑一道微光，让人知道还在动 */
.zz-block .zz-bar::after, .tx .zz-bar::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);
  transform:translateX(-100%);
  animation:zzsheen 1.6s ease-in-out infinite;
}
@keyframes zzsheen{ to{ transform:translateX(100%); } }

/* 当前步骤文字 */
.zz-block .zz-gen-s, .tx .zz-gen-s{
  color:#a98132; font-size:12.5px; margin-bottom:7px;
  font-variant-numeric:tabular-nums;
}

/* 生成已用时间（原本是百分比，20px 是为「92%」这种短文本设的；
   现在放「已用 2 分 15 秒」，同样字号会显得笨重，收到 16px） */
.zz-block .zz-pct, .tx .zz-pct{
  color:#18232c; font-size:16px; font-weight:700;
  line-height:1.2; margin:2px 0 4px;
  font-variant-numeric:tabular-nums;
  font-family:'Noto Serif SC','Noto Serif',serif;
}