/* 手册独立样式：不修改首页共用规则，正文默认可见，不依赖入场脚本。 */
.guide-page { background: radial-gradient(ellipse at 85% 0, #eee7fb80, transparent 520px), #faf9fd; }
.guide-page .site-header { background: #ffffffed; }
.guide-page .site-nav .nav-download { border-radius: 11px; background: #1d1729; box-shadow: none; }
.guide-page .site-nav .nav-download:hover { background: #38294f; }
.guide-page a:focus-visible { outline: 2px solid #8052d2; outline-offset: 4px; }
.guide-main { max-width: 1240px; margin: 0 auto; padding: 64px 40px 88px; }
.guide-hero { margin-bottom: 44px; }
.guide-hero .eyebrow { margin-bottom: 14px; color: #7952bd; font-size: 12px; font-weight: 700; letter-spacing: .12em; }
.guide-hero h1 { margin-bottom: 16px; color: #211a2e; font-size: clamp(32px, 4vw, 48px); font-weight: 750; letter-spacing: -.04em; line-height: 1.2; }
.guide-lead { max-width: 650px; margin: 0; color: #786e85; font-size: 16px; line-height: 1.8; }

/* 父容器覆盖七个章节，目录只在阅读区内停留；保持与DOM相同的左→右顺序。 */
.guide-layout { display: grid; grid-template-columns: 184px minmax(0, 1fr); gap: 48px; align-items: start; }
/* 矮窗口允许目录自身纵向滚动，最后一项也能到达，正文高度不受影响。 */
.guide-toc { position: sticky; top: 100px; max-height: calc(100vh - 124px); padding: 4px 0 4px 12px; overflow-y: auto; border-left: 1px solid #e6dff0; scrollbar-width: thin; }
.toc-phase { margin: 22px 10px 9px; color: #7c6d88; font-size: 11px; font-weight: 600; letter-spacing: .06em; }
.toc-phase:first-child { margin-top: 3px; }
.guide-toc a { display: flex; align-items: center; gap: 9px; min-height: 40px; margin: 2px 0; padding: 8px 10px; border-radius: 8px; color: #796c88; font-size: 13px; transition: color .18s, background .18s; }
.toc-num { color: #ac99c2; font-size: 10px; font-variant-numeric: tabular-nums; }
.guide-toc a:hover { background: #f1ecf8; color: #7442c5; }
.guide-toc a.is-active { background: #ece4f8; color: #6d3bbd; font-weight: 600; }
.guide-toc a.is-active .toc-num { color: inherit; }

/* 用一个阅读面板承载正文，分隔线区分章节，避免每一步都成为厚重的大卡片。 */
.guide-content { min-width: 0; padding: 4px 40px; border: 1px solid #e9e3f0; border-radius: 22px; background: #fff; box-shadow: 0 16px 50px #39234f04; }
.guide-section { padding: 32px 0; border-bottom: 1px solid #eee9f3; scroll-margin-top: 100px; }
.guide-section:last-child { border-bottom: 0; }
.guide-section h2 { display: flex; align-items: baseline; gap: 12px; margin: 0 0 17px; color: #282033; font-size: 23px; font-weight: 650; letter-spacing: -.02em; }
.step-badge { flex: 0 0 auto; color: #946bcf; font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums; }
.guide-section:target h2 { color: #7345be; }
.guide-section p { margin: 0 0 10px; color: #655c70; font-size: 15px; line-height: 1.9; }
.guide-section p:last-child { margin-bottom: 0; }
.guide-section ul, .guide-section ol { margin: 0 0 10px; padding-left: 20px; color: #655c70; font-size: 15px; line-height: 1.9; }
.guide-section li + li { margin-top: 6px; }
.guide-section strong { color: #3b2d4d; font-weight: 600; }
.guide-section .guide-instructions { display: grid; gap: 14px; margin: 0; padding: 0; list-style: none; }
.guide-instructions li { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 16px; }
.guide-instructions li + li { margin-top: 0; }
.guide-instructions strong { color: #77519f; font-size: 13px; }
.guide-section .guide-note { margin-top: 18px; padding: 10px 14px; border-radius: 8px; background: #f7f4fb; color: #756380; font-size: 12px; line-height: 1.8; }
.guide-page .site-footer { border-color: #e9e3f0; background: #f6f3fa; color: #8e839a; }

@media (max-width: 1000px) {
  .guide-main { padding-inline: 28px; }
  .guide-layout { grid-template-columns: 166px minmax(0, 1fr); gap: 28px; }
  .guide-content { padding-inline: 28px; }
}

@media (max-width: 760px) {
  .guide-main { padding: 40px 20px 56px; }
  .guide-hero { margin-bottom: 28px; }
  .guide-hero h1 { margin-bottom: 12px; font-size: 32px; }
  .guide-lead { font-size: 14px; }
  .guide-layout { display: block; }
  /* 目录内部横滚，页头下单行吸顶；正文锚点同时避开页头和目录两层。 */
  .guide-toc { z-index: 5; top: 72px; max-height: none; display: flex; gap: 5px; margin: 0 -20px 20px; padding: 8px 20px; overflow-x: auto; overflow-y: hidden; border: 0; border-block: 1px solid #eae3f1; background: #faf9fdf5; scrollbar-width: thin; }
  .guide-toc a { flex: 0 0 auto; min-height: 36px; margin: 0; padding: 7px 10px; font-size: 12px; white-space: nowrap; }
  .toc-num, .toc-phase { display: none; }
  .guide-content { padding: 0 24px; border-radius: 16px; }
  .guide-section { padding-block: 26px; scroll-margin-top: 150px; }
  .guide-section h2 { font-size: 21px; }
  .guide-section p, .guide-section ul, .guide-section ol { font-size: 14px; }
  .guide-page .site-nav .nav-web { display: flex; align-items: center; min-height: 40px; padding-inline: 10px; border-radius: 10px; background: #eee6fa; color: #7442c5; }
  .guide-page .site-nav { gap: 8px; }
}

@media (max-width: 620px) {
  .guide-page .brand-text small { display: none; }
  .guide-page .brand-link { gap: 7px; }
  .guide-page .brand-link img { width: 32px; height: 32px; }
  .guide-page .site-nav .nav-download { display: flex; align-items: center; min-height: 40px; padding-inline: 10px; }
  .guide-toc { top: 64px; }
  .guide-section { scroll-margin-top: 142px; }
  .guide-instructions li { grid-template-columns: 1fr; gap: 2px; }
}

@media (max-width: 380px) {
  .guide-main { padding-inline: 16px; }
  .guide-hero h1 { font-size: 29px; }
  .guide-toc { margin-inline: -16px; padding-inline: 16px; }
  .guide-content { padding-inline: 20px; }
}

@media (prefers-reduced-motion: reduce) {
  .guide-page .guide-toc a { transition: none; }
}

@media print {
  .guide-page .site-header, .guide-toc, .guide-page .site-footer { display: none; }
  .guide-main { padding: 0; }
  .guide-layout { display: block; }
  .guide-content { border: 0; box-shadow: none; }
  .guide-section { break-inside: avoid; }
}
