/* ==========================================================================
   tutorial.css — setup.html 教程页专属样式
   步骤块:唱片曲目式编号 + 生纸白面板;行尾等宽「时长位」;
   完成标志用日光黄高亮条;正文链接用陈纸白下划线高亮。
   ========================================================================== */

/* ------------------------------------------------------------- 页头 */
.band-panel .badge{ margin-bottom:24px; }
.tut-lede{
  font-size:17px;
  line-height:1.8;
  max-width:64ch;
  margin:0 0 30px;
}
.tut-lede strong{
  font-weight:800;
  padding:0 .1em;
  box-shadow:inset 0 -.52em 0 var(--bg);
}

/* ------------------------------------------- 正文内链接(下划线高亮) */
.step-block p a,
.step-block li a,
.callout p a{
  font-weight:600;
  box-shadow:inset 0 -.45em 0 var(--bgPanel2);
  transition:box-shadow .12s ease;
}
.step-block p a:hover,
.step-block li a:hover,
.callout p a:hover{
  box-shadow:inset 0 -.45em 0 var(--bg);
}

/* ------------------------------------------------------------- 步骤块 */
.step-block{
  background:var(--bgPanel);
  border:2px solid var(--border);
  box-shadow:var(--shadow-md);
  padding:30px 32px 26px;
  margin-bottom:40px;
  scroll-margin-top:24px;
}
.step-head{
  display:flex;
  align-items:baseline;
  gap:18px;
  padding-bottom:16px;
  margin-bottom:22px;
  border-bottom:2px solid var(--border);
}
.step-no{
  font-family:var(--fontMono);
  font-weight:800;
  font-size:clamp(30px,3.6vw,44px);
  line-height:1;
  letter-spacing:.02em;
  flex:none;
}
.step-head h2{
  margin:0;
  font-size:clamp(21px,2.5vw,28px);
  min-width:0;
}
.step-time{
  margin-left:auto;
  font-family:var(--fontMono);
  font-size:12px;
  letter-spacing:.1em;
  color:var(--textMuted);
  white-space:nowrap;
  flex:none;
}
.step-block h3{
  font-size:18px;
  margin:1.6em 0 .6em;
}

/* --------------------------------------------------------- 完成标志条 */
.step-check{
  display:flex;
  align-items:baseline;
  gap:12px;
  flex-wrap:wrap;
  margin:22px 0 0;
  padding:14px 18px;
  background:var(--bg);
  border:2px solid var(--border);
  box-shadow:var(--shadow-sm);
  font-size:15px;
}
.step-check .ck-tag{
  flex:none;
  font-family:var(--fontMono);
  font-size:11px;
  font-weight:700;
  letter-spacing:.14em;
  padding:3px 8px;
  border:2px solid var(--border);
  background:var(--bgPanel);
}

/* --------------------------------------------------------- 深入方向 */
#next-steps{ scroll-margin-top:24px; }
a.term-card{ display:block; }
.dl-cta{ margin-top:56px; }

/* ------------------------------------------------------------- 响应式 */
@media (max-width:900px){
  #next-steps .grid-3{ grid-template-columns:minmax(0,1fr); }
}
@media (max-width:640px){
  .step-block{ padding:20px 18px 18px; margin-bottom:28px; }
  .step-head{ flex-wrap:wrap; gap:6px 14px; }
  .step-time{ margin-left:0; width:100%; }
}
@media (prefers-reduced-motion: reduce){
  .step-block p a,.step-block li a,.callout p a{ transition:none; }
}