:root { scroll-padding-top: 24px; }

.docs-shell {
  width: min(1180px, calc(100% - 40px));
  margin: 28px auto 84px;
  display: grid;
  grid-template-columns: 238px minmax(0, 1fr);
  gap: clamp(34px, 6vw, 76px);
  align-items: start;
}

.docs-sidebar {
  position: sticky;
  top: 24px;
  min-width: 0;
  padding: 18px;
  background: rgba(255, 255, 255, .66);
  border: 1.5px solid var(--ink);
  border-radius: 12px;
  box-shadow: 4px 4px 0 rgba(28, 26, 23, .1);
}

.docs-sidebar-title {
  margin: 0 0 14px;
  color: var(--ink-soft);
  font: 800 11px/1.4 var(--mono);
  letter-spacing: .12em;
  text-transform: uppercase;
}

.docs-nav-group + .docs-nav-group { margin-top: 20px; }
.docs-nav-group h2 { margin: 0 0 7px; font-size: 13px; }
.docs-nav-group a {
  display: block;
  margin: 2px 0;
  padding: 8px 10px;
  color: var(--ink-soft);
  border-radius: 7px;
  font-size: 13.5px;
  line-height: 1.45;
  text-decoration: none;
}
.docs-nav-group a:hover { color: var(--ink); background: var(--paper-dim); }
.docs-nav-group a.docs-external-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.docs-external-link::after { content: "↗"; color: var(--red-dark); font: 800 12px/1 var(--mono); }
.docs-nav-group a[aria-current="page"] {
  color: var(--red-dark);
  background: #fff;
  box-shadow: inset 3px 0 0 var(--red);
  font-weight: 800;
}

.docs-main { min-width: 0; max-width: 820px; }
.docs-breadcrumbs { margin: 2px 0 26px; color: var(--ink-soft); font: 12.5px/1.5 var(--mono); }
.docs-breadcrumbs a { color: inherit; }
.docs-breadcrumbs span { margin: 0 7px; color: #aaa092; }

.docs-hero { padding: 12px 0 38px; border-bottom: 2px solid var(--ink); }
.docs-kicker { color: var(--red-dark); font: 850 12px/1.4 var(--mono); letter-spacing: .12em; }
.docs-title {
  margin: 12px 0 18px;
  font-size: clamp(36px, 6vw, 58px);
  line-height: 1.1;
  letter-spacing: -2px;
}
.docs-lead { max-width: 720px; color: var(--ink-soft); font-size: 18px; line-height: 1.8; }
.docs-meta { margin-top: 18px; color: var(--ink-soft); font: 12px/1.5 var(--mono); }

.docs-search {
  display: flex;
  gap: 10px;
  margin-top: 24px;
  padding: 10px 13px;
  background: #fff;
  border: 1.5px solid var(--ink);
  border-radius: 9px;
  box-shadow: 3px 3px 0 rgba(28, 26, 23, .08);
}
.docs-search label { flex: none; color: var(--ink-soft); font: 700 13px/28px var(--mono); }
.docs-search input { min-width: 0; width: 100%; border: 0; outline: 0; background: transparent; color: var(--ink); font: 15px/28px var(--sans); }
.activation-start { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr) auto; gap: 18px; align-items: center; margin-top: 24px; padding: 20px; background: #fff; border: 1.5px solid var(--ink); border-radius: 11px; box-shadow: 4px 4px 0 rgba(28, 26, 23, .1); }
.activation-start h2 { margin: 8px 0 6px; font-size: 21px; }
.activation-start p { margin: 0; color: var(--ink-soft); font-size: 13.5px; line-height: 1.6; }
.activation-examples { display: grid; gap: 7px; }
.activation-example { display: flex; justify-content: space-between; gap: 10px; padding: 9px 11px; color: var(--ink); background: var(--paper-dim); border: 1px solid #d8cfbc; border-radius: 7px; text-decoration: none; font-size: 13px; }
.activation-example:hover { border-color: var(--red); }
.activation-example span { color: var(--ink-soft); font-size: 12px; white-space: nowrap; }
.activation-cta { white-space: nowrap; text-decoration: none; }

.docs-section { padding: 38px 0 8px; }
.docs-section + .docs-section { border-top: 1.5px dashed #d8cfbc; }
.docs-section-head { margin-bottom: 20px; }
.docs-section-head h2 { margin-bottom: 7px; font-size: 24px; }
.docs-section-head p { color: var(--ink-soft); font-size: 14.5px; }

.guide-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.guide-card {
  min-width: 0;
  padding: 22px;
  color: var(--ink);
  background: #fff;
  border: 1.5px solid var(--ink);
  border-radius: 11px;
  box-shadow: 4px 4px 0 rgba(28, 26, 23, .1);
  text-decoration: none;
  transition: transform .15s ease, box-shadow .15s ease;
}
.guide-card:hover { transform: translate(-2px, -2px); box-shadow: 7px 7px 0 rgba(28, 26, 23, .13); }
.guide-card-tag { color: var(--red-dark); font: 800 11px/1.4 var(--mono); letter-spacing: .08em; }
.guide-card h3 { margin: 10px 0 7px; font-size: 19px; }
.guide-card p { color: var(--ink-soft); font-size: 14px; line-height: 1.65; }
.guide-card-arrow { display: block; margin-top: 18px; color: var(--red-dark); font: 800 13px/1 var(--mono); }
.guide-card[hidden] { display: none; }
.guide-grid-single { grid-template-columns: 1fr; }
.guide-card-external { background: var(--paper-dim); border-style: dashed; }

.docs-empty { padding: 22px; color: var(--ink-soft); border: 1.5px dashed #cfc4b0; border-radius: 9px; text-align: center; }

.docs-article { color: var(--ink); font-size: 16px; line-height: 1.82; }
.docs-article > section { padding: 34px 0 4px; }
.docs-article > section + section { border-top: 1.5px dashed #d8cfbc; }
.docs-article h2 { margin: 0 0 15px; font-size: 26px; line-height: 1.35; }
.docs-article h3 { margin: 24px 0 8px; font-size: 18px; }
.docs-article p { margin: 11px 0; }
.docs-article ul, .docs-article ol { margin: 12px 0; padding-left: 24px; }
.docs-article li { margin: 7px 0; }
.docs-article code {
  padding: 2px 6px;
  background: var(--paper-dim);
  border: 1px solid #cfc4b0;
  border-radius: 4px;
  font: 13.5px/1.5 var(--mono);
}

.docs-answer, .docs-note {
  margin: 22px 0;
  padding: 17px 19px;
  background: #fff;
  border: 1.5px solid var(--ink);
  border-left: 6px solid var(--red);
  border-radius: 9px;
}
.docs-answer strong, .docs-note strong { display: block; margin-bottom: 5px; }
.docs-note { border-left-color: #db9e19; background: #fffaf0; }

.docs-table-wrap { margin: 18px 0 8px; overflow-x: auto; border: 1.5px solid var(--ink); border-radius: 9px; background: #fff; }
.docs-table { width: 100%; min-width: 680px; border-collapse: collapse; font-size: 14px; line-height: 1.55; }
.docs-table th, .docs-table td { padding: 12px 13px; border-bottom: 1px solid #ddd3c2; text-align: left; vertical-align: top; }
.docs-table th { background: var(--paper-dim); font-size: 12px; letter-spacing: .03em; }
.docs-table tr:last-child td { border-bottom: 0; }
.docs-table code { white-space: nowrap; }

.docs-command {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 12px 0;
  padding: 12px 14px;
  color: #f5efe3;
  background: #1c1a17;
  border: 1.5px solid var(--ink);
  border-radius: 8px;
}
.docs-command code { flex: 1; min-width: 0; overflow-x: auto; padding: 0; color: inherit; background: transparent; border: 0; white-space: nowrap; }
.docs-copy { flex: none; padding: 5px 9px; color: var(--ink); background: var(--paper); border: 1px solid #f5efe3; border-radius: 5px; font: 750 12px/1.3 var(--sans); cursor: pointer; }
.docs-copy.is-copied { color: #fff; background: var(--red); }

.docs-sources { font-size: 14px; color: var(--ink-soft); }
.docs-sources a { overflow-wrap: anywhere; }
.docs-prev-next { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 42px; }
.docs-prev-next a { padding: 15px 16px; color: var(--ink); background: #fff; border: 1.5px solid var(--ink); border-radius: 8px; text-decoration: none; }
.docs-prev-next small { display: block; margin-bottom: 4px; color: var(--ink-soft); }

.docs-getting-started { padding-top: 10px; }
.docs-getting-started .g-tabs { margin-top: 28px; }
.docs-getting-started .g-step { scroll-margin-top: 24px; }
.docs-pricing #price-table { margin-top: 18px; }
.docs-pricing .table-card { margin-left: 0; margin-right: 0; }
.docs-pricing .honest { margin-top: 18px; }
.docs-pricing .docs-answer { margin-bottom: 18px; }
.docs-standalone-section { padding-top: 34px; }
.docs-main .ann-log { margin-top: 34px; }
.docs-main .cl-more { margin-bottom: 0; }
.docs-main.about-main > .docs-breadcrumbs { margin-bottom: 8px; }

@media (max-width: 820px) {
  .docs-shell { width: min(100% - 32px, 760px); grid-template-columns: 1fr; gap: 24px; margin-top: 18px; }
  .docs-sidebar { position: static; display: flex; gap: 12px; overflow-x: auto; padding: 10px; }
  .docs-sidebar-title { display: none; }
  .docs-nav-group { display: flex; align-items: center; gap: 3px; flex: none; }
  .docs-nav-group + .docs-nav-group { margin-top: 0; padding-left: 12px; border-left: 1px solid #d8cfbc; }
  .docs-nav-group h2 { margin: 0 4px 0 0; white-space: nowrap; }
  .docs-nav-group a { white-space: nowrap; }
  .docs-main { max-width: none; }
  .activation-start { grid-template-columns: 1fr; }
  .activation-cta { justify-self: start; }
}

@media (max-width: 580px) {
  .docs-shell { width: min(100% - 24px, 760px); margin-bottom: 56px; }
  .docs-title { font-size: 38px; letter-spacing: -1.3px; }
  .docs-lead { font-size: 16.5px; }
  .guide-grid, .docs-prev-next { grid-template-columns: 1fr; }
  .docs-search { display: block; }
  .docs-search label { display: block; line-height: 1.4; }
  .docs-command { align-items: flex-start; }
  .docs-copy { margin-top: -2px; }
}

/* 服务端渲染的双语块(价格页 FAQ):按 i18n.js 设置的 <html lang> 只显示一份 */
html[lang="en"] [data-l="zh"], html:not([lang="en"]) [data-l="en"] { display: none; }
.docs-faq-item + .docs-faq-item { margin-top: 18px; }
.docs-faq-item h3 { margin: 0 0 6px; font-size: 17px; }
.docs-faq-item p { margin: 0; }
