.getting-started {
  position: relative;
  border-block: 1px solid var(--line-soft);
  background:
    radial-gradient(circle at 8% 18%, rgba(241, 184, 93, 0.12), transparent 26rem),
    radial-gradient(circle at 92% 82%, rgba(86, 214, 194, 0.13), transparent 28rem),
    rgba(255, 255, 255, 0.018);
}

.starter-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.starter-card {
  position: relative;
  display: flex;
  min-height: 358px;
  flex-direction: column;
  align-items: flex-start;
  overflow: hidden;
  padding: 28px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.025));
  box-shadow: 0 16px 52px rgba(0, 0, 0, 0.18);
}

.starter-card::after {
  content: "";
  position: absolute;
  right: -72px;
  bottom: -92px;
  width: 210px;
  height: 210px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 50%;
  opacity: 0.48;
}

.starter-card--wechat::before,
.starter-card--agent::before,
.starter-card--xapp::before,
.starter-card--operations::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.85;
}

.starter-card--wechat::before { background: radial-gradient(circle at 96% 5%, rgba(86, 214, 194, 0.22), transparent 16rem); }
.starter-card--agent::before { background: radial-gradient(circle at 96% 5%, rgba(132, 168, 255, 0.22), transparent 16rem); }
.starter-card--xapp::before { background: radial-gradient(circle at 96% 5%, rgba(241, 184, 93, 0.2), transparent 16rem); }
.starter-card--operations::before { background: radial-gradient(circle at 96% 5%, rgba(152, 119, 255, 0.2), transparent 16rem); }

.starter-card > * { position: relative; }
.starter-index { color: rgba(245, 240, 231, 0.32); font-size: 13px; font-weight: 900; letter-spacing: 0.12em; }
.starter-kicker { margin-top: 20px; color: var(--teal); font-size: 12px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.starter-card h3 { max-width: 510px; margin-top: 8px; font-size: 28px; line-height: 1.2; }
.starter-card > p:not(.starter-kicker):not(.starter-note) { max-width: 550px; margin-top: 13px; color: var(--muted); }
.starter-points { display: grid; gap: 7px; margin-top: 18px; color: rgba(245, 240, 231, 0.82); font-size: 14px; }
.starter-points li { position: relative; padding-left: 18px; }
.starter-points li::before { content: ""; position: absolute; left: 0; top: 0.62em; width: 7px; height: 7px; border-radius: 50%; background: var(--gold); box-shadow: 0 0 12px rgba(241, 184, 93, 0.42); }
.starter-note { margin-top: 13px; color: var(--subtle); font-size: 12px; line-height: 1.55; }
.starter-action { margin-top: auto; padding-top: 14px; }
.starter-card .btn { padding-inline: 18px; }

.guide-hero {
  position: relative;
  overflow: hidden;
  padding: 102px 0 62px;
  background:
    linear-gradient(90deg, rgba(7, 9, 11, 0.95), rgba(7, 9, 11, 0.74) 53%, rgba(7, 9, 11, 0.22)),
    var(--guide-hero-bg, radial-gradient(circle at 80% 8%, rgba(86, 214, 194, 0.2), transparent 34rem));
  background-position: center;
  background-size: cover;
}

.guide-hero::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(rgba(255,255,255,.026) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.022) 1px, transparent 1px); background-size: 72px 72px; mask-image: linear-gradient(180deg, #000, transparent 90%); }
.guide-hero .shell { position: relative; z-index: 1; }
.guide-hero h1 { max-width: 800px; margin-top: 14px; font-size: clamp(38px, 5.4vw, 62px); line-height: 1.08; }
.guide-hero-lede { max-width: 720px; margin-top: 20px; color: var(--muted); font-size: 18px; }
.guide-status-row { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 28px; }
.guide-status { display: inline-flex; align-items: center; min-height: 30px; padding: 5px 10px; border: 1px solid var(--line); border-radius: 999px; color: rgba(245, 240, 231, 0.84); background: rgba(8, 11, 13, 0.45); font-size: 13px; }
.guide-status::before { content: ""; width: 6px; height: 6px; margin-right: 7px; border-radius: 50%; background: var(--teal); box-shadow: 0 0 10px rgba(86, 214, 194, 0.65); }

.guide-layout { display: grid; grid-template-columns: 220px minmax(0, 1fr) 250px; gap: 36px; align-items: start; }
.guide-toc { position: sticky; top: 96px; display: grid; gap: 6px; padding-block: 10px; }
.guide-toc strong { margin-bottom: 8px; color: var(--subtle); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; }
.guide-toc a { padding: 8px 10px; border-left: 2px solid transparent; color: var(--subtle); font-size: 14px; line-height: 1.35; }
.guide-toc a:hover, .guide-toc a.is-active { border-left-color: var(--gold); color: var(--text); background: rgba(241, 184, 93, .08); }
.guide-main { min-width: 0; }
.guide-section { scroll-margin-top: 104px; padding-bottom: 54px; margin-bottom: 54px; border-bottom: 1px solid var(--line-soft); }
.guide-section:last-child { margin-bottom: 0; }
.guide-section h2 { font-size: 34px; line-height: 1.18; }
.guide-section-intro { margin-top: 14px; color: var(--muted); }
.guide-aside { position: sticky; top: 96px; display: grid; gap: 14px; }
.guide-callout, .guide-checklist, .guide-copy-card { padding: 18px; border: 1px solid var(--line-soft); border-radius: 10px; background: rgba(255, 255, 255, .038); }
.guide-callout h3, .guide-checklist h3, .guide-copy-card h3 { font-size: 16px; line-height: 1.3; }
.guide-callout p, .guide-checklist p, .guide-copy-card p { margin-top: 8px; color: var(--muted); font-size: 14px; }
.guide-callout--gold { border-color: rgba(241, 184, 93, .3); background: rgba(241, 184, 93, .07); }
.guide-callout--teal { border-color: rgba(86, 214, 194, .28); background: rgba(86, 214, 194, .065); }
.guide-checklist ul { display: grid; gap: 8px; margin-top: 12px; }
.guide-checklist li { position: relative; padding-left: 18px; color: rgba(245, 240, 231, .78); font-size: 14px; line-height: 1.45; }
.guide-checklist li::before { content: "✓"; position: absolute; left: 0; color: var(--teal); font-weight: 900; }

.guide-steps { display: grid; gap: 14px; margin-top: 26px; }
.guide-step { display: grid; grid-template-columns: 46px minmax(0, 1fr); gap: 16px; padding: 22px; border: 1px solid var(--line-soft); border-radius: 10px; background: rgba(255, 255, 255, .026); }
.guide-step-num { display: grid; width: 38px; height: 38px; place-items: center; border: 1px solid rgba(241, 184, 93, .4); border-radius: 50%; color: #ffe0a3; font-size: 13px; font-weight: 900; }
.guide-step h3 { font-size: 21px; line-height: 1.26; }
.guide-step p { margin-top: 9px; color: var(--muted); }
.guide-step-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 14px; }
.guide-step-meta div { padding: 10px 12px; border-radius: 7px; background: rgba(255, 255, 255, .04); color: var(--subtle); font-size: 13px; line-height: 1.45; }
.guide-step-meta strong { display: block; margin-bottom: 2px; color: var(--teal); font-size: 12px; }

.guide-tabs { margin-top: 26px; }
.guide-tablist { display: flex; flex-wrap: wrap; gap: 8px; border-bottom: 1px solid var(--line-soft); padding-bottom: 12px; }
.guide-tab { cursor: pointer; border: 1px solid var(--line); border-radius: 999px; padding: 8px 14px; color: var(--muted); background: rgba(255,255,255,.035); font-weight: 800; }
.guide-tab[aria-selected="true"] { border-color: rgba(241,184,93,.5); color: #ffe0a3; background: rgba(241,184,93,.12); }
.guide-tabpanel { display: none; padding-top: 22px; }
.guide-tabpanel.is-active { display: block; }
.guide-tabpanel h3 { font-size: 23px; }
.guide-tabpanel > p { margin-top: 9px; color: var(--muted); }
.guide-tab-action { display: inline-flex; margin-top: 18px; }
.guide-list { display: grid; gap: 10px; margin-top: 16px; }
.guide-list li { position: relative; padding-left: 20px; color: rgba(245, 240, 231, .82); }
.guide-list li::before { content: ""; position: absolute; left: 0; top: .66em; width: 7px; height: 7px; border-radius: 50%; background: var(--teal); }
.guide-code { position: relative; margin-top: 16px; padding: 18px 56px 18px 18px; border: 1px solid rgba(132, 168, 255, .23); border-radius: 9px; background: #090d11; color: #d9e5ff; font: 13px/1.65 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; white-space: pre-wrap; word-break: break-word; }
.guide-copy { position: absolute; top: 10px; right: 10px; cursor: pointer; border: 1px solid var(--line); border-radius: 6px; padding: 5px 8px; color: var(--muted); background: rgba(255,255,255,.05); font: 12px/1.2 inherit; }
.guide-copy:hover { color: var(--text); border-color: rgba(241,184,93,.5); }

.guide-topic-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 24px; }
.guide-topic-grid--single { grid-template-columns: minmax(0, 1fr); }
.guide-topic { padding: 20px; border: 1px solid var(--line-soft); border-radius: 10px; background: rgba(255,255,255,.03); }
.guide-topic h3 { font-size: 19px; line-height: 1.28; }
.guide-topic p { margin-top: 9px; color: var(--muted); font-size: 14px; }
.guide-topic a { display: inline-flex; margin-top: 12px; color: #ffe0a3; font-size: 14px; font-weight: 800; }
@media (min-width: 781px) { .guide-topic--wide { grid-column: 1 / -1; } }
.guide-matrix { display: grid; gap: 1px; margin-top: 24px; border: 1px solid var(--line-soft); border-radius: 10px; overflow: hidden; background: var(--line-soft); }
.guide-matrix-row { display: grid; grid-template-columns: 170px 1fr 1fr; gap: 1px; background: var(--line-soft); }
.guide-matrix-row > * { padding: 14px; background: rgba(11, 15, 18, .98); }
.guide-matrix-row strong { color: #ffe0a3; font-size: 14px; }
.guide-matrix-row span { color: var(--muted); font-size: 14px; }
.guide-matrix-head > * { color: var(--subtle); font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.guide-next { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 42px; padding: 24px; border: 1px solid rgba(86,214,194,.28); border-radius: 12px; background: linear-gradient(135deg, rgba(86,214,194,.1), rgba(255,255,255,.025)); }
.guide-next h2 { font-size: 25px; }
.guide-next p { margin-top: 6px; color: var(--muted); }

@media (max-width: 1040px) {
  .guide-layout { grid-template-columns: 190px minmax(0, 1fr); }
  .guide-aside { display: none; }
}

@media (max-width: 780px) {
  .starter-grid, .guide-topic-grid { grid-template-columns: 1fr; }
  .starter-card { min-height: 0; }
  .starter-action { margin-top: 14px; padding-top: 0; }
  .guide-hero { padding: 84px 0 52px; }
  .guide-hero-lede { font-size: 16px; }
  .guide-layout { grid-template-columns: 1fr; gap: 22px; }
  .guide-toc { position: static; grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 12px; border: 1px solid var(--line-soft); border-radius: 9px; background: rgba(255,255,255,.025); }
  .guide-toc strong { grid-column: 1 / -1; }
  .guide-toc a { border-left: 0; border-radius: 6px; padding: 8px; }
  .guide-step-meta { grid-template-columns: 1fr; }
  .guide-matrix { overflow-x: auto; }
  .guide-matrix-row { min-width: 610px; }
}

@media (max-width: 540px) {
  .starter-card { padding: 22px; }
  .starter-card h3 { font-size: 24px; }
  .guide-section h2 { font-size: 28px; }
  .guide-step { grid-template-columns: 1fr; gap: 12px; padding: 18px; }
  .guide-next { align-items: flex-start; flex-direction: column; }
}

/* ===== V2.62 新手教程入口 / 移动安全区 / 教程互链 ===== */
.nav-sub-group{display:block;padding:10px 14px 2px;font-size:10.5px;letter-spacing:.1em;color:var(--ink-3,#9C8E80);font-weight:700}
.nav-drawer nav .nav-drawer-group{font-size:11px;letter-spacing:.1em;color:var(--ink-3,#9C8E80);padding:16px 0 2px;font-weight:700}
@supports (padding-bottom: env(safe-area-inset-bottom)){
  body{padding-bottom:env(safe-area-inset-bottom)}
  footer,.site-footer,.foot-base{padding-bottom:calc(20px + env(safe-area-inset-bottom))}
}


/* ===== V2.63 排版修复：米黄主题（与主站一致）===== */
/* 根因：--text/--muted/--gold/--teal/--line-soft 在 guides 页从未定义（base.css 未被引用），
   变量空值继承深色 => 暗底深字。此处补全为米黄体系。 */
.guide-page{
  --text:#221A14;
  --muted:#6E6156;
  --subtle:#9C8E80;
  --gold:#EE5F27;
  --gold-soft:rgba(238,95,39,.14);
  --teal:#2FA08A;
  --blue:#5B7FD4;
  --line:rgba(34,26,20,.10);
  --line-soft:rgba(34,26,20,.08);
  --panel:#FFFFFF;
  --panel-strong:#FFFDF9;
  --shadow:0 14px 40px rgba(34,26,20,.14);
  --bg:#FBF7F1;--bg-soft:#F4EDE3;
  background:#FBF7F1;
  color:#221A14;
}
/* Hero 重做：米黄+橙渐变，去装饰网格 */
.guide-hero{
  background:linear-gradient(180deg,#FFF6EC 0%,#FBF7F1 62%) !important;
  color:#221A14;
}
.guide-hero::after{display:none}
.guide-hero h1{color:#221A14}
.guide-hero-lede{color:#6E6156}
.guide-status{border:1px solid rgba(238,95,39,.22);background:rgba(238,95,39,.08);color:#B84A16}
/* 卡片实底化（原半透白在米黄底上无边无影） */
.starter-card{background:#fff;border:1px solid rgba(34,26,20,.10);box-shadow:0 12px 34px -18px rgba(34,26,20,.20)}
.starter-card::after{display:none}
.starter-points{color:#4A4038}
.starter-index{color:rgba(34,26,20,.22)}
.starter-note{color:#9C8E80}
.guide-callout,.guide-checklist,.guide-copy-card{background:#fff;border:1px solid rgba(34,26,20,.10);box-shadow:0 8px 24px -14px rgba(34,26,20,.14)}
.getting-started{background:
  radial-gradient(circle at 8% 18%,rgba(238,95,39,.07),transparent 26rem),
  radial-gradient(circle at 92% 82%,rgba(47,160,138,.07),transparent 28rem)}
.guide-section{border-bottom:1px solid rgba(34,26,20,.08)}
/* 暗色表格保留（信息层级），文字全部提亮为高对比 */
.guide-matrix-row > *{background:#14171B}
.guide-matrix-row strong{color:#FFE0A3}
.guide-matrix-row span{color:#F4EDE3}
.guide-matrix-head > *{color:#EE5F27}
.guide-matrix-row{background:#23272C}
.guide-matrix{border-color:#23272C}
/* z-index：目录/右栏提升防覆盖；H2 提升防穿透 */
.guide-toc{z-index:10;background:#FBF7F1}
.guide-aside{z-index:10}
.guide-section h2,.guide-layout h2{position:relative;z-index:5}
.guide-section h3,.guide-layout h3{position:relative;z-index:5}
/* guide-next：米黄化 + 按钮防竖排 */
.guide-next{background:linear-gradient(135deg,rgba(238,95,39,.08),rgba(255,255,255,.55));border:1px solid rgba(238,95,39,.26)}
.guide-next h2{color:#221A14}
.guide-next p{color:#6E6156}
.guide-next .btn,.guide-next a.btn{min-width:210px;white-space:nowrap;text-align:center;flex-shrink:0}
/* 移动端目录：侧栏改顶部横滑 chips */
@media (max-width:760px){
  .guide-toc{
    display:flex;gap:8px;overflow-x:auto;padding:10px 2px;
    position:sticky;top:58px;z-index:20;background:#FBF7F1;
    border-radius:12px;scrollbar-width:none;
  }
  .guide-toc::-webkit-scrollbar{display:none}
  .guide-toc strong{display:none}
  .guide-toc a{
    flex:0 0 auto;border-left:0;background:#F4EDE3;border-radius:999px;
    padding:7px 14px;font-size:12.5px;color:#6E6156;
  }
  .guide-toc a.is-active,.guide-toc a:hover{background:#EE5F27;color:#fff}
  .guide-next .btn,.guide-next a.btn{min-width:100%;white-space:normal}
}

/* ===== V2.64 表格米黄化 + hero 按钮间距 + 移动端 ===== */
/* 表格：米黄底 + 深色字（与主站一致） */
.guide-matrix{border:1px solid var(--line,rgba(34,26,20,.1));background:#fff;border-radius:12px;overflow:hidden}
.guide-matrix-row{background:transparent;gap:1px}
.guide-matrix-row > *{background:transparent;padding:14px 16px;color:var(--ink,#221A14)}
.guide-matrix-row + .guide-matrix-row > *{border-top:1px solid var(--line,rgba(34,26,20,.06))}
.guide-matrix-row strong{color:var(--orange,#EE5F27);font-size:14px;font-weight:700}
.guide-matrix-row span{color:var(--ink-2,#6E6156);font-size:13.5px;line-height:1.6}
.guide-matrix-head > *{background:var(--cream-2,#F4EDE3);color:var(--ink,#221A14);font-size:12.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
/* 行 hover 浅米黄 */
.guide-matrix-row:not(.guide-matrix-head):hover > *{background:#FAF1E5}
/* hero 按钮与状态 pills 间距 */
.hero-actions{margin-top:20px;display:flex;gap:12px;flex-wrap:wrap}
/* 移动端 hero 间距缩小 */
@media (max-width:760px){
  .hero-actions{margin-top:14px}
  .hero-actions a{font-size:13.5px;padding:10px 16px}
}
/* 移动端 hero padding 顶部留出状态栏 */
@media (max-width:760px){
  .guide-hero{padding:48px 0 28px}
  .guide-hero h1{font-size:24px;line-height:1.25;margin-top:10px}
  .guide-hero-lede{font-size:13.5px;line-height:1.7;margin-top:10px}
}
/* 移动端 site-header 加 safe-area */
.site-header{padding-top:env(safe-area-inset-top)}
/* 移动端 m-hero / mbody 顶部安全区 */
@media (max-width:760px){
  .mhero{padding-top:calc(16px + env(safe-area-inset-top))}
  .mobnav{padding-top:calc(10px + env(safe-area-inset-top))}
}
/* mtabs 与 mobnav 在 mobile 错位 */
.mobnav{position:sticky;top:0;z-index:30}
.mtabs{position:sticky;top:58px;z-index:20}

/* ===== V2.65 INSTALL 模块米黄化 + grid 安全（防竖排堆叠） ===== */
/* 1) 安装方式 tabs（agent/xapp「选择一种工作方式」） */
.guide-tabs{margin-top:24px}
.guide-tablist{display:flex;flex-wrap:wrap;gap:8px;border-bottom:1px solid var(--line,rgba(34,26,20,.1));padding-bottom:12px}
.guide-tab{
  cursor:pointer;border:1px solid var(--line,rgba(34,26,20,.1));border-radius:999px;
  padding:8px 16px;color:var(--ink-2,#6E6156);background:#fff;font-weight:600;font-size:13px;
}
.guide-tab:hover{border-color:rgba(238,95,39,.35);color:var(--orange,#EE5F27)}
.guide-tab[aria-selected="true"]{
  border-color:rgba(238,95,39,.35);color:var(--orange,#EE5F27);
  background:rgba(238,95,39,.10);
}
.guide-tabpanel{padding-top:18px}
/* 2) 步骤卡：实白底 + 深褐字 + 橙编号 */
.guide-step-list{display:grid;gap:14px;margin-top:20px}
.guide-step{
  grid-template-columns:46px minmax(0,1fr);gap:16px;padding:18px 20px;
  border:1px solid var(--line,rgba(34,26,20,.1));border-radius:12px;background:#fff;
  box-shadow:0 4px 16px -10px rgba(34,26,20,.10);
}
.guide-step-index{border-color:rgba(238,95,39,.3);background:rgba(238,95,39,.08);color:var(--orange,#EE5F27)}
.guide-step h3,.guide-step strong,.guide-step b{color:var(--ink,#221A14)}
.guide-step p,.guide-step span,.guide-step li,.guide-step div{color:var(--ink-2,#6E6156)}
.guide-step em,.guide-step code{
  background:#fff;border:1px solid var(--line,rgba(34,26,20,.1));
  color:var(--ink,#221A14);padding:1px 6px;border-radius:5px;
}
.guide-step-note{background:#fff;border:1px solid var(--line,rgba(34,26,20,.1));color:var(--ink-2,#6E6156)}
/* 3) grid 安全：防止某元素撑爆列导致竖排堆叠 */
.guide-layout{grid-template-columns:220px minmax(0,1fr) 250px}
.guide-main,.guide-section,.guide-tabpanel,.guide-step>*{min-width:0}
.guide-main *{max-width:100%}
.guide-main h2,.guide-main h3,.guide-main p,.guide-main li,.guide-main span{
  overflow-wrap:anywhere;word-break:break-word;
}
.guide-main img,.guide-main pre,.guide-main code,.guide-main table{max-width:100%;height:auto}
.guide-main pre{overflow-x:auto;white-space:pre-wrap;word-break:break-word}
/* 4) 移动端：步骤卡单列 */
@media (max-width:760px){
  .guide-step{grid-template-columns:1fr;gap:12px;padding:18px}
  .guide-tab{font-size:12.5px;padding:7px 14px}
}


/* ===== V2.66 guides 三页：移动端汉堡/抽屉补齐 + 真类名文字配色修复 + ≤760 断点统一 =====
   根因：① nav-toggle / nav-drawer 的 CSS 从未落地（首页样式内联在 index.html 的 <style> 里，
         子页从未共享；guides 三页只有 HTML + JS，没有样式 → 按钮不可见、抽屉无定位）
        ② .guide-list li / .guide-checklist li 仍是暗色体系浅米字 rgba(245,240,231,.8x) → 白底隐形
        ③ V2.65 误用不存在的类名 .guide-step-index / .guide-step-list → 整段补丁静默失效
   范围：guides.css 仅 guides 三页引用，不影响其他页面。 */

/* ① 移动端汉堡按钮 + 全屏抽屉（自首页内联 <style> 移植，补齐从未存在的样式） */
.nav-toggle{display:none}
.nav-toggle-bars{display:grid;gap:5px;width:22px}
.nav-toggle-bars i{display:block;height:2px;background:currentColor;border-radius:2px}
.nav-drawer{
  position:fixed;inset:0;z-index:300;background:var(--cream,#FBF7F1);
  padding:calc(76px + env(safe-area-inset-top)) 24px calc(28px + env(safe-area-inset-bottom));
  overflow-y:auto;transform:translateX(100%);transition:transform .25s ease;
}
.nav-drawer.is-open{transform:translateX(0)}
.nav-drawer nav{display:grid}
.nav-drawer a{padding:15px 0;font-size:17px;font-weight:700;border-bottom:1px solid var(--line);color:var(--ink,#221A14)}
.nav-drawer .btn{margin-top:16px;width:100%;border-bottom:0}
.nav-drawer-close{
  position:absolute;top:calc(14px + env(safe-area-inset-top));right:16px;
  width:44px;height:44px;border:0;background:transparent;font-size:28px;
  line-height:1;color:var(--ink,#221A14);cursor:pointer;
}
body.nav-open{overflow:hidden}
/* V2.74.1 移除 .nav-drawer-book-cta 覆盖规则（该样式已由 book-demo.css V2.74 统一处理，！important 覆盖导致橙背景块不消失） */

/* ② 真类名文字配色修复（覆盖暗色体系遗留的浅色字面量，取代失效的 V2.65 选择器） */
.guide-list li{color:#4A4038}
.guide-list li::before{background:rgba(238,95,39,.6)}
.guide-checklist li{color:#4A4038}
.guide-checklist li::before{color:#EE5F27}
.guide-step-num{color:#EE5F27 !important;background:rgba(238,95,39,.10);border-color:rgba(238,95,39,.32) !important}
.guide-step-meta div{background:#FBF7F1;border:1px solid rgba(34,26,20,.08);color:#6E6156}
.guide-step-meta strong{color:#EE5F27}
.guide-topic{background:#fff;border:1px solid rgba(34,26,20,.10);box-shadow:0 8px 24px -14px rgba(34,26,20,.14)}
.guide-topic a{color:#EE5F27}
.guide-topic a:hover{text-decoration:underline}
.guide-code{background:#FFFDF9;color:#3A322B;border:1px solid rgba(34,26,20,.12)}
.guide-code .guide-copy{background:#fff;color:#6E6156;border:1px solid rgba(34,26,20,.14)}
.guide-toc a{color:#6E6156}
.guide-toc a:hover,.guide-toc a.is-active{color:#EE5F27;border-left-color:#EE5F27;background:rgba(238,95,39,.08)}
.guide-callout--gold{border-color:rgba(238,95,39,.30);background:rgba(238,95,39,.06)}
.guide-callout--teal{border-color:rgba(47,160,138,.30);background:rgba(47,160,138,.07)}
.guide-callout h3,.guide-checklist h3{color:#221A14}

/* ③ ≤760px：汉堡显示 + 右栏回归 + 单列（原断点分散在 780/540，此处统一到 760） */
@media (max-width:760px){
  .nav{position:relative}
  .nav-toggle{
    display:inline-flex;align-items:center;justify-content:center;
    width:44px;height:44px;margin-left:auto;border:0;background:transparent;
    color:var(--ink,#221A14);cursor:pointer;
  }
  .guide-toc{
    position:static;grid-template-columns:repeat(2,minmax(0,1fr));
    padding:12px;border:1px solid var(--line);border-radius:12px;background:#fff;
  }
  .guide-toc strong{grid-column:1 / -1}
  .guide-toc a{border-left:0;border-radius:8px;padding:9px 10px;background:#FBF7F1;font-size:13.5px}
  .guide-aside{display:grid;position:static}
  .guide-section{padding-bottom:34px;margin-bottom:34px}
  .guide-section h2{font-size:24px;line-height:1.3}
  .guide-step{grid-template-columns:1fr;gap:12px;padding:18px}
  .guide-step-num{width:34px;height:34px;margin-bottom:2px}
  .guide-next{flex-direction:column;align-items:flex-start;gap:16px;padding:20px}
  .guide-next .btn,.guide-next a.btn{width:100%;min-width:0}
}
@media (max-width:400px){
  .brand-mark{font-size:19px !important}
  .nav-cta .btn{padding:0 11px !important;font-size:13px !important}
}


/* ===== V2.67：撤销 V2.65 L327 的 3 列重置 + guide-next 跨列 =====
   根因：V2.65 L327 写了 .guide-layout{grid-template-columns:220px minmax(0,1fr) 250px}
        但没有 @media 包裹（无条件生效），按 CSS 级联后胜 L162 (780 media) 的 1fr，
        导致移动端永远保持 3 列、内容被压成「单字竖排」。此处在 760 media 内重写撤销。
   另：operations 页 .guide-layout 有 4 个直接子元素（toc/main/aside/next），
       3 列 grid 让第 4 个 guide-next 占第一列宽 220px → PC 端 H2/P 单字竖排，
       故 PC 端让 guide-next 跨满全宽（grid-column:1/-1）。 */

/* PC：guide-next 跨满 3 列 + 内部可收缩，避免文字被撑爆成单字竖排 */
.guide-next{grid-column:1 / -1}
.guide-next > div{min-width:0;flex:1}
.guide-next h2{overflow-wrap:break-word;word-break:break-word}
.guide-next p{overflow-wrap:break-word}

/* ≤760：撤销 V2.65 L327 的无条件 3 列，恢复单列 */
@media (max-width:760px){
  .guide-layout{grid-template-columns:1fr;gap:20px;padding:28px 0}
  .guide-topic-grid{grid-template-columns:1fr;gap:12px}
  .guide-aside{display:grid;position:static}
  .guide-next{flex-direction:column;align-items:flex-start;gap:16px;padding:20px;grid-column:auto}
  .guide-next .btn,.guide-next a.btn{width:100%;min-width:0}
}

/* ===== V2.68 移动端正文区视觉精修 =====
   仅作用于 ≤760，不动 PC。目标：呼吸感 + 层级感 + 节奏感。 */
@media (max-width:760px){
  /* section 节奏：章节之间拉开 */
  .guide-section{padding-bottom:48px;margin-bottom:48px;border-bottom:1px solid rgba(34,26,20,.08)}
  .guide-section:last-child{padding-bottom:34px;margin-bottom:34px;border-bottom:0}
  .guide-section h2{font-size:24px;line-height:1.3;margin-bottom:6px}

  /* topic 卡片：呼吸感 + 字号层级 */
  .guide-topic-grid{gap:18px;margin-top:28px}
  .guide-topic{
    padding:24px 22px;border-radius:14px;
    box-shadow:0 6px 22px -10px rgba(34,26,20,.18);
    display:flex;flex-direction:column;gap:10px;
  }
  .guide-topic h3{font-size:19px;font-weight:900;letter-spacing:-.005em;line-height:1.35}
  .guide-topic p{margin:0;font-size:14.5px;line-height:1.7}
  /* 链接顶到卡片底部对齐（真站文本自带「→」，不再用 ::after 追加） */
  .guide-topic a{margin-top:auto;padding-top:4px;font-size:14px;font-weight:800;color:#EE5F27;align-self:flex-start}

  /* aside：与上方 topic-grid 明确分层 */
  .guide-aside{gap:16px;margin-top:28px}

  /* checklist：橙色竖条 + 标题强化 */
  .guide-checklist{padding:22px 20px;border-radius:14px;box-shadow:0 6px 22px -10px rgba(34,26,20,.18)}
  .guide-checklist h3{
    font-size:18px;font-weight:900;line-height:1.3;
    border-left:3px solid #EE5F27;padding-left:12px;margin-bottom:14px;
  }
  .guide-checklist ul{gap:11px;margin:0}
  .guide-checklist li{padding-left:22px;font-size:14.5px;line-height:1.65}
  .guide-checklist li::before{top:1px;font-size:14px}

  /* callout：呼吸 + 主色阴影呼应 */
  .guide-callout{padding:22px 20px;border-radius:14px;box-shadow:0 6px 22px -10px rgba(34,26,20,.18)}
  .guide-callout--gold{border-color:rgba(238,95,39,.32);box-shadow:0 6px 22px -10px rgba(238,95,39,.18)}
  .guide-callout--teal{border-color:rgba(47,160,138,.32);box-shadow:0 6px 22px -10px rgba(47,160,138,.18)}
  .guide-callout h3{font-size:17px;font-weight:900;margin-bottom:10px;line-height:1.35}
  .guide-callout p{margin:0;font-size:14.5px;line-height:1.7}
}
