  .doc-head { padding: var(--space-12) 0 var(--space-8); border-bottom: 1px solid var(--border); }
  .doc-head h1 { font-size: var(--text-4xl); margin-top: var(--space-3); }
  .doc-head .meta { margin-top: var(--space-4); font-family: var(--font-mono); font-size: var(--text-xs); color: var(--ink-3); display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5); }

  .doc-layout { display: grid; grid-template-columns: 232px 1fr; gap: var(--space-16); align-items: start; padding-block: var(--space-12); }

  /* Sticky ToC */
  .toc { position: sticky; top: calc(var(--header-h) + var(--space-6)); }
  .toc .kicker { display: block; margin-bottom: var(--space-4); }
  .toc ol { list-style: none; padding: 0; margin: 0; counter-reset: t; display: flex; flex-direction: column; gap: 2px; border-left: 2px solid var(--border); }
  .toc a { counter-increment: t; display: flex; gap: var(--space-3); align-items: baseline; padding: 7px var(--space-4); margin-left: -2px; border-left: 2px solid transparent; font-size: var(--text-sm); color: var(--ink-3); transition: color .12s ease, border-color .12s ease; }
  .toc a .tn { font-family: var(--font-mono); font-size: 11px; opacity: 0.7; }
  .toc a:hover { color: var(--ink); }
  .toc a.active { color: var(--accent-ink); border-left-color: var(--accent); font-weight: 500; }

  /* Content */
  .doc-body { max-width: 64ch; }
  .doc-body section { padding-top: var(--space-2); margin-bottom: var(--space-12); scroll-margin-top: calc(var(--header-h) + var(--space-6)); }
  .doc-body h2 { font-size: var(--text-2xl); display: flex; align-items: baseline; gap: var(--space-3); }
  .doc-body h2 .num { font-family: var(--font-mono); font-size: var(--text-sm); color: var(--accent-ink); font-weight: 600; }
  .doc-body h3 { font-size: var(--text-md); margin-top: var(--space-6); }
  .doc-body p { color: var(--ink-2); margin-top: var(--space-4); line-height: var(--leading-relaxed); }
  .doc-body p:first-of-type { margin-top: var(--space-4); }
  .doc-body a.inline { color: var(--accent-ink); border-bottom: 1px solid var(--accent-soft-2); }
  .doc-body a.inline:hover { border-bottom-color: var(--accent); }
  .doc-body strong { color: var(--ink); font-weight: 600; }

  /* Data table */
  .data-table { width: 100%; border-collapse: collapse; margin-top: var(--space-5); font-size: var(--text-sm); }
  .data-table th, .data-table td { text-align: left; padding: var(--space-3) var(--space-4); border-bottom: 1px solid var(--border); vertical-align: top; }
  .data-table th { font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: var(--tracking-wide); text-transform: uppercase; color: var(--ink-3); font-weight: 500; background: var(--surface-2); }
  .data-table td:first-child { font-weight: 600; color: var(--ink); white-space: nowrap; }
  .data-table td { color: var(--ink-2); }

  .callout { display: flex; gap: var(--space-4); margin-top: var(--space-6); padding: var(--space-5) var(--space-6); border-radius: var(--r); background: var(--accent-soft); border: 1px solid transparent; }
  .callout .ic { width: 22px; height: 22px; flex: none; color: var(--accent); }
  .callout p { margin: 0; color: var(--ink); font-size: var(--text-sm); }
  .callout a { color: var(--accent-ink); font-weight: 600; }

  ul.bullets { margin-top: var(--space-4); padding-left: 0; list-style: none; display: flex; flex-direction: column; gap: var(--space-3); }
  ul.bullets li { display: flex; gap: var(--space-3); color: var(--ink-2); font-size: var(--text-base); }
  ul.bullets li::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--accent); margin-top: 9px; flex: none; }
  ul.bullets li b { color: var(--ink); }

  @media (max-width: 880px) {
    .doc-layout { grid-template-columns: 1fr; gap: var(--space-8); }
    .toc { position: static; border: 1px solid var(--border); border-radius: var(--r); padding: var(--space-5); background: var(--surface-2); }
    .toc ol { border-left: none; }
    .toc a { border-left: none; padding: 6px 0; margin-left: 0; }
    .toc a.active { border-left: none; }
    .doc-head h1 { font-size: var(--text-3xl); }
  }
