/* ==========================================================================
   Cakewalk Sonar 中文帮助中心 —— 页面专属样式
   全部规则限定在 .page-cw-help 下，不会影响站点其它页面。
   配色沿用站点三色体系（橙 #FF6A00 / 黑 #111 / 白），不使用任何渐变。
   由 content/cakewalk-help/render.py 生成页面时引用。
   ========================================================================== */

/* ---------- 布局 ---------- */
.page-cw-help .cw-main { padding: 34px 0 72px; }

.page-cw-help .cw-layout { max-width: 860px; }

/* 文章底部的返回导航。
   取值抄自 style.css 里的 .qa-footnav（FAQ 子页用的那个），
   这样两种页面的底部按钮长得一样：同样的 52px 上间距 + 分隔线 + 12px 间隔。
   ⚠ 改这里也看一眼 .qa-footnav，别只改一边。 */
.page-cw-help .cw-footnav {
  display: flex; flex-wrap: wrap; gap: 12px;
  margin-top: 52px; padding-top: 28px; border-top: 1px solid var(--line);
}

.page-cw-help .cw-hero { padding: 26px 0 6px; }

.page-cw-help .cw-eyebrow {
  margin: 0 0 10px;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--brand-deep);
}

.page-cw-help .cw-hero h1 {
  margin: 0 0 14px;
  font-size: clamp(1.9rem, 5vw, 2.6rem);
  line-height: 1.18;
  letter-spacing: -.01em;
  color: var(--ink);
}

.page-cw-help .cw-lede {
  margin: 0 0 8px;
  max-width: 62ch;
  font-size: 1.02rem;
  line-height: 1.75;
  color: var(--ink-2);
}

.page-cw-help .cw-lede strong { color: var(--brand-deep); }

/* ---------- 栏目快速跳转 ---------- */
.page-cw-help .cw-quick {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 22px 0 34px;
}

.page-cw-help .cw-quick a {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 13px;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: .88rem;
  color: var(--ink);
  text-decoration: none;
  transition: border-color .18s, background .18s;
}

.page-cw-help .cw-quick a:hover {
  border-color: var(--brand-soft);
  background: var(--brand-wash);
  color: var(--brand-deep);
}

.page-cw-help .cw-quick a span {
  font-size: .74rem;
  font-weight: 700;
  color: var(--ink-3);
}

.page-cw-help .cw-quick a:hover span { color: var(--brand); }

/* ---------- 索引页：栏目 + 卡片 ---------- */
.page-cw-help .cw-sec { margin: 0 0 38px; }

.page-cw-help .cw-sec h2 {
  margin: 0 0 4px;
  padding-top: 6px;
  font-size: 1.24rem;
  color: var(--ink);
}

.page-cw-help .cw-sec h2::before {
  content: "";
  display: inline-block;
  width: 4px;
  height: 17px;
  margin-right: 9px;
  vertical-align: -2px;
  border-radius: 2px;
  background: var(--brand);
}

.page-cw-help .cw-sec-d {
  margin: 0 0 16px 13px;
  font-size: .88rem;
  color: var(--ink-3);
}

.page-cw-help .cw-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.page-cw-help .cw-card {
  display: block;
  height: 100%;
  padding: 15px 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  color: inherit;
  text-decoration: none;
  transition: border-color .18s, box-shadow .18s, transform .18s;
}

.page-cw-help .cw-card:hover {
  border-color: var(--brand-soft);
  box-shadow: 0 4px 16px rgba(255, 106, 0, .1);
  transform: translateY(-2px);
}

.page-cw-help .cw-card strong {
  display: block;
  margin-bottom: 6px;
  font-size: .98rem;
  line-height: 1.45;
  color: var(--ink);
}

.page-cw-help .cw-card:hover strong { color: var(--brand-deep); }

.page-cw-help .cw-card span {
  display: block;
  font-size: .85rem;
  line-height: 1.6;
  color: var(--ink-3);
}

.page-cw-help .cw-src {
  margin: 40px 0 0;
  padding-top: 18px;
  border-top: 1px solid var(--line);
  font-size: .84rem;
  line-height: 1.7;
  color: var(--ink-3);
}

.page-cw-help .cw-src a { color: var(--brand-deep); }

/* ---------- 文章页：标题 ----------
   注：这里原本有 .cw-crumb（面包屑「Cakewalk Sonar 帮助中心 / 栏目」）的样式。
   2026-09-15 用户要求去掉整条面包屑，页面里已经不再输出 .cw-crumb，
   所以对应规则一并删掉，免得留下永远不会命中的死样式。 */

.page-cw-help .cw-article > h1 {
  margin: 0 0 10px;
  font-size: clamp(1.6rem, 4.4vw, 2.2rem);
  line-height: 1.25;
  letter-spacing: -.01em;
  color: var(--ink);
}

.page-cw-help .cw-meta {
  margin: 0 0 22px;
  font-size: .84rem;
  color: var(--ink-3);
}

.page-cw-help .cw-meta a { color: var(--brand-deep); }

/* 署名说明：官方原文通篇用第一人称（"我们"），直译会让读者误以为本页就是官方。
   一行全局说明覆盖全部这种表述，比逐处改写 20 多处更可靠，也不用篡改原文。 */
.page-cw-help .cw-attrib {
  margin: -14px 0 22px;
  font-size: .82rem;
  line-height: 1.65;
  color: var(--ink-3);
}

/* 版权 / 许可声明块（2026-10-03）：BandLab / Cakewalk 授权要求，
   每篇译文页脚都要带这句话（措辞固定，在 render.py 的 DISCLAIMER_TPL 里）。
   样式只求「看得见、读得清、不抢戏」——用浅底 + 品牌色左条，
   和目录块（.cw-toc）同一套视觉语言。
   ⚠ 原文链接是完整 URL，长，所以要 overflow-wrap 兜住手机窄屏。 */
.page-cw-help .cw-disclaimer {
  margin: 34px 0 0;
  padding: 13px 16px;
  border: 1px solid var(--line);
  border-left: 3px solid var(--brand);
  border-radius: 10px;
  background: var(--brand-wash);
  font-size: .82rem;
  line-height: 1.75;
  color: var(--ink-3);
  overflow-wrap: anywhere;
}

.page-cw-help .cw-disclaimer a { color: var(--brand-deep); }

/* ---------- 本页目录 ---------- */
.page-cw-help .cw-toc {
  margin: 0 0 26px;
  padding: 15px 18px;
  border: 1px solid var(--line);
  border-left: 3px solid var(--brand);
  border-radius: 10px;
  background: var(--brand-wash);
}

.page-cw-help .cw-toc-t {
  margin: 0 0 8px;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--brand-deep);
}

.page-cw-help .cw-toc ol { margin: 0; padding-left: 20px; }

.page-cw-help .cw-toc li { margin: 0 0 5px; font-size: .9rem; line-height: 1.5; }
/* ⚠ 这里原来写的是 `margin-left: 14px; list-style: circle;`——
   前者会把整行（含编号）推走，编号列立刻不齐；后者会把 <ol> 的编号换成圆点，
   目录显示成「1 ○ 3」，看着像漏了一项。层级改由下方「可读性打磨」那段处理：
   编号在同一列，只缩进文字。 */
.page-cw-help .cw-toc li.lv3 { font-size: .88rem; }
.page-cw-help .cw-toc a { color: var(--ink-2); text-decoration: none; }
.page-cw-help .cw-toc a:hover { color: var(--brand-deep); text-decoration: underline; }

/* ---------- 正文排版 ---------- */
.page-cw-help .cw-body { font-size: 1.02rem; line-height: 1.8; color: var(--ink-2); }

.page-cw-help .cw-body p { margin: 0 0 15px; }

.page-cw-help .cw-body h2 {
  margin: 40px 0 14px;
  padding-top: 10px;
  font-size: 1.34rem;
  line-height: 1.35;
  color: var(--ink);
  border-top: 1px solid var(--line);
}

.page-cw-help .cw-body h3 {
  margin: 28px 0 11px;
  font-size: 1.1rem;
  line-height: 1.4;
  color: var(--ink);
}

.page-cw-help .cw-body h4 {
  margin: 22px 0 9px;
  font-size: 1rem;
  color: var(--ink);
}

.page-cw-help .cw-body strong { color: var(--ink); font-weight: 600; }

.page-cw-help .cw-body a { color: var(--brand-deep); text-decoration: underline; text-underline-offset: 2px; }
.page-cw-help .cw-body a:hover { color: var(--brand); }

.page-cw-help .cw-body ul,
.page-cw-help .cw-body ol { margin: 0 0 16px; padding-left: 24px; }
.page-cw-help .cw-body li { margin: 0 0 7px; }
.page-cw-help .cw-body li > p { margin: 0 0 6px; }

.page-cw-help .cw-body ol.list-colored { counter-reset: cwli; list-style: none; padding-left: 0; }

.page-cw-help .cw-body ol.list-colored > li {
  position: relative;
  counter-increment: cwli;
  padding-left: 34px;
  margin-bottom: 12px;
}

.page-cw-help .cw-body ol.list-colored > li::before {
  content: counter(cwli);
  position: absolute;
  left: 0;
  top: 1px;
  width: 23px;
  height: 23px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--brand);
  color: #fff;
  font-size: .76rem;
  font-weight: 700;
  line-height: 1;
}

/* ---------- 行内代码 / 快捷键 ---------- */
.page-cw-help .cw-body code {
  padding: 2px 6px;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: var(--line-2);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .88em;
  color: var(--ink);
  word-break: break-word;
}

.page-cw-help .cw-body pre {
  overflow-x: auto;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--line-2);
}

.page-cw-help .cw-body pre code { padding: 0; border: 0; background: none; }

/* ---------- 图片 ---------- */
.page-cw-help .cw-body figure { margin: 20px 0; }

.page-cw-help .cw-body img {
  display: block;
  max-width: 100%;
  height: auto;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
}

.page-cw-help .cw-body figcaption {
  margin-top: 8px;
  font-size: .84rem;
  color: var(--ink-3);
  text-align: center;
}

.page-cw-help .cw-caption {
  display: block;
  margin: 6px 0 16px;
  font-size: .84rem;
  font-style: italic;
  color: var(--ink-3);
}

/* ---------- 表格 ---------- */
.page-cw-help .cw-body table {
  width: 100%;
  margin: 20px 0;
  border-collapse: collapse;
  font-size: .93rem;
}

.page-cw-help .cw-body th,
.page-cw-help .cw-body td {
  padding: 10px 12px;
  border: 1px solid var(--line);
  text-align: left;
  vertical-align: top;
  line-height: 1.6;
}

.page-cw-help .cw-body thead th {
  background: var(--brand-wash);
  color: var(--ink);
  font-weight: 600;
  white-space: nowrap;
}

.page-cw-help .cw-body tbody tr:nth-child(even) td { background: #fafafa; }

.page-cw-help .cw-body td.text-center,
.page-cw-help .cw-body th.text-center { text-align: center; }

.page-cw-help .cw-body td.category-header {
  background: var(--brand-wash) !important;
  color: var(--brand-deep);
  font-weight: 700;
}

.page-cw-help .cw-body th.th-highlight { color: var(--brand-deep); }

/* 表格窄屏可横向滚动，不撑破页面 */
.page-cw-help .cw-body .cw-tablewrap { overflow-x: auto; margin: 20px 0; }
.page-cw-help .cw-body .cw-tablewrap table { margin: 0; min-width: 460px; }

/* ---------- 定义列表 ---------- */
.page-cw-help .cw-body dl.dl-horizontal {
  display: grid;
  grid-template-columns: minmax(120px, 32%) 1fr;
  gap: 10px 18px;
  margin: 18px 0;
  padding: 15px 17px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fcfcfc;
}

.page-cw-help .cw-body dl.dl-horizontal dt {
  font-weight: 600;
  color: var(--ink);
  font-size: .94rem;
}

.page-cw-help .cw-body dl.dl-horizontal dd { margin: 0; font-size: .94rem; }
.page-cw-help .cw-body dl.dl-horizontal dd p:last-child { margin-bottom: 0; }

/* ---------- 引言块 ---------- */
.page-cw-help .cw-body .article-intro {
  margin: 0 0 26px;
  padding: 17px 19px;
  border: 1px solid var(--brand-soft);
  border-radius: 12px;
  background: var(--brand-wash);
  font-size: 1.02rem;
  line-height: 1.75;
  color: var(--ink-2);
}

.page-cw-help .cw-body .article-intro p:last-child { margin-bottom: 0; }

/* ---------- 提示框 ---------- */
.page-cw-help .cw-body blockquote.callout-important,
.page-cw-help .cw-body blockquote.callout-membership,
.page-cw-help .cw-body blockquote.callout-tip,
.page-cw-help .cw-body blockquote.callout-note {
  margin: 20px 0;
  padding: 14px 17px;
  border: 1px solid var(--line);
  border-left: 3px solid var(--brand);
  border-radius: 10px;
  background: #fcfcfc;
}

.page-cw-help .cw-body blockquote.callout-important p:last-child,
.page-cw-help .cw-body blockquote.callout-membership p:last-child { margin-bottom: 0; }

.page-cw-help .cw-body .callout-title {
  display: inline-block;
  margin-bottom: 5px;
  font-size: .74rem;
  font-weight: 700;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: var(--brand-deep);
}

/* 会员专属提示：深色底，和普通提示区分开 */
.page-cw-help .cw-body blockquote.callout-membership {
  border-left-color: var(--brand);
  background: var(--ink);
  border-color: var(--ink);
}

.page-cw-help .cw-body blockquote.callout-membership .callout-title { color: var(--brand-mid); }

.page-cw-help .cw-body blockquote.callout-membership,
.page-cw-help .cw-body blockquote.callout-membership p,
.page-cw-help .cw-body blockquote.callout-membership strong { color: #f2f2f2; }

.page-cw-help .cw-body blockquote.callout-membership a { color: var(--brand-mid); }

.page-cw-help .cw-body .membership-icon {
  display: inline-block;
  width: 15px;
  height: 15px;
  margin-right: 6px;
  vertical-align: -2px;
  background: var(--brand);
  clip-path: polygon(0 20%, 28% 42%, 50% 0, 72% 42%, 100% 20%, 88% 100%, 12% 100%);
}

/* ---------- 本站补充说明（.cw-tip）----------
   和官方原文里的「提示框」(.callout-*) 刻意做得不一样：
   官方的那种是浅底 + 橙色细左边框，这个用**整块橙色实底 + 白字**，
   一眼能看出「这不是官方文档，是站主自己加的」。

   ⚠️ 页面上必须同时有明确文字标注（「肖闻提示 · 非官方」），
   光靠颜色区分不够 —— 色盲用户、打印黑白都分辨不出来。 */
.page-cw-help .cw-tip {
  margin: 22px 0;
  padding: 16px 18px 15px;
  border-radius: 12px;
  background: var(--brand);
  color: #fff;
}

.page-cw-help .cw-tip-t {
  display: inline-block;
  margin: 0 0 8px;
  padding: 2px 9px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .22);
  font-size: .74rem;
  font-weight: 700;
  letter-spacing: .06em;
  color: #fff;
}

.page-cw-help .cw-tip p {
  margin: 0 0 8px;
  font-size: 1rem;
  line-height: 1.75;
}

.page-cw-help .cw-tip p:last-child { margin-bottom: 0; }
.page-cw-help .cw-tip strong { color: #fff; font-weight: 700; }
.page-cw-help .cw-tip a { color: #fff; text-decoration: underline; }
.page-cw-help .cw-tip code {
  background: rgba(255, 255, 255, .2);
  border-color: rgba(255, 255, 255, .3);
  color: #fff;
}

/* ---------- 手风琴（原生 details）---------- */
.page-cw-help .cw-acc {
  margin: 10px 0;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  overflow: hidden;
}

.page-cw-help .cw-acc[open] { border-color: var(--brand-soft); }

.page-cw-help .cw-acc-h {
  position: relative;
  padding: 13px 40px 13px 16px;
  cursor: pointer;
  font-size: .97rem;
  color: var(--ink);
  list-style: none;
  user-select: none;
}

.page-cw-help .cw-acc-h::-webkit-details-marker { display: none; }

.page-cw-help .cw-acc-h::after {
  content: "+";
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1.15rem;
  line-height: 1;
  color: var(--brand);
}

.page-cw-help .cw-acc[open] > .cw-acc-h::after { content: "\2212"; }
.page-cw-help .cw-acc-h:hover { color: var(--brand-deep); }

.page-cw-help .cw-acc-b { padding: 0 16px 14px; border-top: 1px solid var(--line-2); }
.page-cw-help .cw-acc-b > *:first-child { margin-top: 12px; }
.page-cw-help .cw-acc-b > *:last-child { margin-bottom: 0; }

.page-cw-help .cw-acc--more > .cw-acc-h { color: var(--brand-deep); font-weight: 600; }

/* ---------- 标签页 ---------- */
.page-cw-help .cw-tabs { margin: 22px 0; }

.page-cw-help .cw-tabs-menu {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 16px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--line);
}

.page-cw-help .cw-tab {
  padding: 7px 15px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  font: inherit;
  font-size: .9rem;
  color: var(--ink-2);
  cursor: pointer;
  transition: color .16s, border-color .16s, background .16s;
}

.page-cw-help .cw-tab:hover { border-color: var(--brand-soft); color: var(--brand-deep); }

.page-cw-help .cw-tab.is-active {
  border-color: var(--brand);
  background: var(--brand);
  color: #fff;
  font-weight: 600;
}

.page-cw-help .cw-tabpanel { display: none; }
.page-cw-help .cw-tabpanel.is-active { display: block; }

/* ---------- bento 网格 / 图文并排 ---------- */
.page-cw-help .cw-body .bento-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap: 14px;
  margin: 20px 0;
}

.page-cw-help .cw-body .bento-item {
  padding: 15px 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}

.page-cw-help .cw-body .bento-item h3 { margin: 0 0 7px; font-size: 1rem; }
.page-cw-help .cw-body .bento-item p { font-size: .92rem; margin-bottom: 10px; }
.page-cw-help .cw-body .bento-item figure { margin: 0; }

.page-cw-help .cw-body .text-media-row {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  align-items: flex-start;
  margin: 20px 0;
}

.page-cw-help .cw-body .text-media-row .text-col { flex: 1 1 300px; min-width: 0; }
.page-cw-help .cw-body .text-media-row figure { flex: 1 1 280px; width: auto !important; margin: 0; min-width: 0; }

.page-cw-help .cw-body .text-media-row::after { content: ""; flex-basis: 100%; }

/* ---------- 页尾 ----------
   注：这里原本有「上一篇 / 下一篇」(.cw-sibling) 的样式。
   2026-09-15 用户要求整块去掉，页面里已不再输出，故一并删除。 */

/* ---------- 锚点定位时别被固定页头挡住 ---------- */
.page-cw-help .cw-body h2,
.page-cw-help .cw-body h3 { scroll-margin-top: calc(var(--header-h) + 16px); }

/* ---------- 窄屏 ---------- */
/* ==========================================================================
   可读性打磨（2026-09-26 · 分支 readability）
   与 style.css 里那一套同一目标，只是这份样式表管的是官方文档搬运页。
   ========================================================================== */

/* ---------- ① 本页目录：编号要对齐，层级只缩进文字 ---------- */
/* 这段改过两轮，两个坑都踩到了，写下来免得再犯：
   ① 原来 li.lv3（h3 小标题）设了 list-style: circle，把 <ol> 的编号顶掉了，
      目录显示成「1 ○ 3」，读者以为漏了一项。
   ② 改成 list-style: decimal + margin-left 之后串号回来了，但**编号列不齐**——
      因为缩进把「2.」也一起推走了，1/2/3 三个数字不在同一竖线上，更难看。
   正解：号码用自定义计数器画在固定宽度的第一列，层级只缩进**文字**那一列。
   于是：
       1. Sonar 版本概览
       2.   为什么要升级到高级版？   ← 号码仍在同一列，只有文字缩进
       3. Sonar 版本对比
   编号用等宽数字（tabular-nums），保证 1/2/3 的宽度一致。 */
.page-cw-help .cw-toc ol {
  margin: 0; padding-left: 0; list-style: none;
  counter-reset: cwtoc;
}
.page-cw-help .cw-toc li {
  counter-increment: cwtoc;
  display: grid;
  grid-template-columns: 1.7em minmax(0, 1fr);
  margin: 0 0 5px;
  font-size: .9rem; line-height: 1.5;
}
.page-cw-help .cw-toc li::before {
  content: counter(cwtoc) ".";
  color: var(--ink-3);
  font-variant-numeric: tabular-nums;
}
/* 子项（h3）：号码留在原位、颜色淡一档，只把文字推后一点 */
.page-cw-help .cw-toc li.lv3 { font-size: .88rem; }
.page-cw-help .cw-toc li.lv3::before { color: var(--ink-3); opacity: .7; }
.page-cw-help .cw-toc a { display: block; }   /* 让折行的文字也跟着缩进，不会顶回号码列 */
.page-cw-help .cw-toc li.lv3 a { padding-left: 1.4em; }

/* ---------- ② 目录只列大项，小项留给正文 ---------- */
/* 目录里把小标题也编上号（1、2、3…）会让人以为它们和大项平级，
   而实际结构是「大项 + 它下面的小项」。所以：页面同时有大项和小项时，
   目录只列大项；小标题在正文里一个字都不少。

   ⚠ 不能无脑隐藏 lv3：有 3 个页面的标题**全是 h3**（没有 h2），
     一律隐藏会让那些页面的目录变成空壳。所以先判断「列表里有没有大项」。 */
.page-cw-help .cw-toc ol:has(> li:not(.lv3)) > li.lv3 { display: none; }

/* 反过来：整页目录都是小项时，按正常条目排版，不缩进、不缩小字号 */
.page-cw-help .cw-toc ol:not(:has(> li:not(.lv3))) > li.lv3 { font-size: .9rem; }
.page-cw-help .cw-toc ol:not(:has(> li:not(.lv3))) > li.lv3 a { padding-left: 0; }

/* ---------- ② 行长 ---------- */
/* 正文原先 860px（一行约 51 个汉字），收到 46rem＝736px（约 44 个）。
   style.css 那边的长文也收到了同一尺度，两种页面读起来节奏一致。 */
.page-cw-help .cw-layout { max-width: 46rem; }

/* ---------- ③ 行距与段距 ---------- */
.page-cw-help .cw-body { line-height: 1.85; }
.page-cw-help .cw-body p { margin-bottom: 16px; }
/* 列表项之间也要喘气：原来 7px 在长列表里会挤成一坨 */
.page-cw-help .cw-body li { margin-bottom: 9px; }

/* ---------- 点了本页目录之后，让目标标题闪一下 ---------- */
/* 目录项跳过去之后，如果标题安安静静地待在那儿，人常常不确定"我到底跳到哪了"。
   这里给目标标题罩一层极浅的品牌色、1.5 秒淡出：告诉眼睛"你落在这里"。
   用 box-shadow 而不是 background —— 前者不外扩元素尺寸，不会让下面的文字跳一下。 */
.page-cw-help .cw-body h2.is-target,
.page-cw-help .cw-body h3.is-target,
.page-cw-help .cw-body h4.is-target {
  border-radius: 8px;
  animation: cw-target-flash 1.5s cubic-bezier(.2, .7, .3, 1);
}
@keyframes cw-target-flash {
  0%   { box-shadow: 0 0 0 12px var(--brand-wash); }
  60%  { box-shadow: 0 0 0 12px var(--brand-wash); }
  100% { box-shadow: 0 0 0 12px rgba(255, 246, 238, 0); }
}
@media (prefers-reduced-motion: reduce) {
  .page-cw-help .cw-body h2.is-target,
  .page-cw-help .cw-body h3.is-target,
  .page-cw-help .cw-body h4.is-target { animation-duration: .01s; }
}

@media (max-width: 700px) {
  .page-cw-help .cw-main { padding: 22px 0 52px; }
  .page-cw-help .cw-cards { grid-template-columns: 1fr; }
  .page-cw-help .cw-body dl.dl-horizontal { grid-template-columns: 1fr; gap: 4px; }
  .page-cw-help .cw-body dl.dl-horizontal dd { margin-bottom: 10px; }
  .page-cw-help .cw-body .text-media-row figure { flex-basis: 100%; }
  .page-cw-help .cw-body table { font-size: .86rem; }
  .page-cw-help .cw-body th,
  .page-cw-help .cw-body td { padding: 8px 9px; }
}

/* ---------- 页头里的入口（2026-09-26） ----------
   「Cakewalk Sonar 是什么？先看这篇」从页面底部挪到页头（搜索框上方）。
   ⚠ 一开始它保持"描边胶囊按钮"的样子，但页头正下方就是搜索框 ——
     两个可点的大家伙挨着，互相抢注意力，整体看着别扭（用户反馈）。
   所以在这里把它**降成一行安静的链接**（下划线 + 主色），
   位置不动、标记也不动，只改外观：搜索依然是这一页唯一的主角。
   这样做还有个好处：生成器模板不用跟着改，重新生成也不会丢。 */
.page-head-cta { margin: 16px 0 0; }
.page-head-cta .btn {
  padding: 0; border: 0; border-radius: 0; background: none;
  font-size: 15px; color: var(--brand-deep);
  border-bottom: 1px solid rgba(255, 106, 0, .35);
}
.page-head-cta .btn:hover {
  background: none; color: var(--brand);
  border-bottom-color: var(--brand);
}