/* coincouponhub 转化卡片 + 文章目录侧栏（2026-11-07）。类名统一 cch- 前缀，配色沿用 style.css 变量 */
.cch-card{position:relative;background:var(--card);border:2.5px solid var(--char);border-radius:18px;box-shadow:6px 6px 0 var(--char);padding:18px 20px 16px;scroll-margin-top:86px}
.cch-card::after{content:"";position:absolute;left:18px;right:18px;top:-2.5px;height:6px;background:var(--flag);border:2.5px solid var(--char);border-top:0;border-radius:0 0 8px 8px}
.cch-hd{display:flex;align-items:center;gap:11px}
.cch-ico{width:42px;height:42px;border-radius:12px;background:var(--char);color:#fff;font-family:var(--face-display);font-weight:800;font-size:15px;display:flex;align-items:center;justify-content:center;flex:none}
.cch-ex b{display:block;font-family:var(--face-display);font-weight:800;font-size:20px;line-height:1.1}
.cch-ex small{display:block;font-size:12px;color:var(--quiet);margin-top:2px}
.cch-chk{margin-left:auto;font-family:var(--face-mono);font-size:11px;font-weight:600;padding:4px 9px;border-radius:20px;border:1.5px solid var(--leaf-line);background:var(--leaf-bg);color:var(--leaf);white-space:nowrap}
.cch-lab{margin:14px 0 6px;font-size:13px;color:var(--quiet)}
.cch-gain{margin:12px 0 0;font-family:var(--face-display);font-weight:800;font-size:21px;line-height:1.25;color:var(--char)}
.cch-gain em{font-style:normal;color:var(--pop-deep);background:linear-gradient(transparent 62%,var(--flag) 62%);padding:0 2px}
.cch-go{display:flex;align-items:center;justify-content:center;width:100%;min-height:56px;margin-top:12px;padding:12px 18px;background:var(--pop);color:#fff;border:2.5px solid var(--char);border-radius:12px;box-shadow:4px 4px 0 var(--char);font-family:var(--face-display);font-weight:800;font-size:18px;letter-spacing:.01em;transition:transform .08s,box-shadow .08s,background .15s}
.cch-go:hover{text-decoration:none;background:var(--pop-deep)}
.cch-go:active{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--char)}
.cch-fine{margin-top:10px;font-size:12px;line-height:1.55;color:var(--quiet)}
.cch-fine a{color:var(--pop-deep)}
/* 首页：卡片 + 下方「先看」区 */
.cch-side{display:flex;flex-direction:column;gap:22px}
.cch-pre{border:2px solid var(--char);border-radius:var(--bend);background:var(--sand-deep);padding:14px 16px 16px}
.cch-pre-h{font-family:var(--face-display);font-weight:800;font-size:16px;margin:0 0 10px}
.cch-pre-list{display:grid;gap:10px}
.cch-pre a.cch-pre-it{display:block;background:var(--card);border:2px solid var(--char);border-radius:11px;padding:10px 13px;color:var(--char);box-shadow:3px 3px 0 var(--char);transition:transform .12s,box-shadow .12s}
.cch-pre a.cch-pre-it:hover{text-decoration:none;transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--char)}
.cch-pre-it i{font-style:normal;font-family:var(--face-mono);font-size:11px;font-weight:600;color:var(--pop-deep)}
.cch-pre-it b{display:block;font-family:var(--face-display);font-weight:800;font-size:15.5px;line-height:1.3;margin-top:2px}
.cch-pre-it small{display:block;font-size:12.5px;color:var(--quiet);margin-top:3px;line-height:1.5}
/* 文章页开头卡片 */
.cch-card-art{max-width:600px;margin:16px 0 22px}
.cch-art-cover{margin-top:4px}
@media(max-width:760px){
  .hero .cch-side{display:contents}
  .hero .cch-card{order:-1}
  .hero .cch-pre{order:2}
  .cch-card{padding:16px 15px 14px}
  .cch-ex b{font-size:18px}
  .cch-gain{font-size:19px}
  .cch-card-art{margin:12px 0 18px}
  .cch-art h1{font-size:24px;margin:8px 0 10px}
  .cch-art .byline{padding-bottom:10px}
}
/* 文章章节目录：桌面端做成随滚动保持可见的侧栏 */
@media(min-width:1024px){
  .cch-flow{display:grid;grid-template-columns:minmax(0,1fr) 248px;column-gap:44px;align-items:start}
  .cch-flow>*{grid-column:1;min-width:0;margin-top:0}
  .prose.cch-flow>h2{padding-top:23px}
  .prose.cch-flow>h3{padding-top:9px}
  .cch-flow>.toc{grid-column:2;grid-row:1/span 300;position:sticky;top:86px;margin:4px 0 0;max-height:calc(100vh - 110px);overflow:auto}
  .cch-flow>.toc li{font-size:14px;line-height:1.5}
  .cch-flow>.toc a.cch-on{color:var(--pop-deep);font-weight:700}
}