.ds { max-width:860px; margin:0 auto; padding:24px 24px 60px; }
  .ds-section { background:var(--bg-1); border-radius:12px; padding:28px 32px; margin-bottom:16px; box-shadow:var(--card-shadow); }
  .ds-section h2 { font-size:16px; font-weight:700; color:var(--text-0); margin:0 0 6px; letter-spacing:-0.02em; }
  .ds-section h3 { font-size:13px; font-weight:600; color:var(--text-0); margin:24px 0 8px; letter-spacing:-0.01em; }
  .ds-prose { font-size:14px; color:var(--text-1); line-height:1.7; }
  .ds-prose p { margin:0 0 12px; }
  .ds-prose strong { color:var(--text-0); font-weight:600; }
  .ds-prose a { color:var(--accent); text-decoration:none; }
  .ds-prose a:hover { text-decoration:underline; }
  .ds-dim { color:var(--text-2); font-size:13px; }
  .ds-list { list-style:none; padding:0; margin:8px 0 0; }
  .ds-list li { font-size:13px; color:var(--text-1); line-height:1.7; padding:3px 0; padding-left:18px; position:relative; }
  .ds-list li::before { content:''; position:absolute; left:4px; top:10px; width:5px; height:5px; border-radius:50%; background:var(--text-3); }

  /* Data table */
  .dt { width:100%; margin:12px 0; }
  .dt-row { display:grid; grid-template-columns:140px 1fr 100px; gap:12px; padding:10px 0; border-bottom:1px solid var(--bg-2); align-items:start; }
  .dt-row:last-child { border-bottom:none; }
  .dt-head { font-size:11px; font-weight:600; color:var(--text-3); text-transform:uppercase; letter-spacing:0.05em; border-bottom:1px solid var(--bg-2); }
  .dt-row span:first-child { font-size:13px; font-weight:600; color:var(--text-0); }
  .dt-row span:nth-child(2) { font-size:13px; color:var(--text-2); line-height:1.6; }
  .dt-row span:last-child { font-size:12px; color:var(--text-3); text-align:right; }

  /* API table */
  .api-t { width:100%; margin:12px 0; }
  .api-r { display:grid; grid-template-columns:60px 1fr 1fr; gap:12px; padding:8px 0; border-bottom:1px solid var(--bg-2); align-items:baseline; }
  .api-r:last-child { border-bottom:none; }
  .api-m { font-size:11px; font-weight:700; color:var(--accent); font-family:'SF Mono','Cascadia Code',monospace; }
  .api-r code { font-size:12px; background:var(--bg-2); padding:1px 6px; border-radius:4px; font-family:'SF Mono','Cascadia Code',monospace; }
  .api-r span:last-child { font-size:12px; color:var(--text-2); }

  /* TOC */
  .toc-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:12px; }
  .toc-item { display:flex; align-items:center; gap:12px; padding:12px 16px; background:var(--bg-2); border-radius:10px; text-decoration:none; transition:background .15s; }
  .toc-item:hover { background:var(--bg-hover); }
  .toc-item strong { font-size:13px; color:var(--text-0); display:block; }
  .toc-item span:last-child { font-size:11px; color:var(--text-2); display:block; margin-top:2px; }

  /* Code */
  code[class*="language-"], pre[class*="language-"] {
    font-size:12px; line-height:1.6; font-family:'SF Mono','Cascadia Code','Fira Code',monospace;
    color:var(--text-1); background:none !important; text-shadow:none !important; margin:0; padding:0;
  }
  pre[class*="language-"] { padding:14px 16px !important; overflow-x:auto; }
  .code-block { background:var(--bg-2); border-radius:8px; overflow:hidden; margin:8px 0; }
  .code-header { display:flex; justify-content:space-between; align-items:center; padding:6px 14px; font-size:11px; color:var(--text-3); }
  .copy-btn { font-size:11px; background:none; border:none; color:var(--text-3); cursor:pointer; padding:2px 8px; border-radius:4px; }
  .copy-btn:hover { background:var(--bg-hover); color:var(--text-0); }
  .token { background:none !important; }
  .token.comment, .token.prolog { color:var(--text-3); }
  .token.punctuation { color:var(--text-2); }
  .token.property, .token.tag, .token.constant, .token.deleted, .token.keyword { color:var(--red); }
  .token.boolean, .token.number, .token.builtin { color:var(--accent); }
  .token.string, .token.char, .token.attr-value, .token.inserted { color:var(--green); }
  .token.function, .token.class-name { color:var(--cat-dip); }
  .token.variable { color:var(--orange); }

  @media (max-width:600px) {
    .ds { padding:12px 14px 40px; }
    .ds-section { padding:18px 16px; }
    .dt-row { grid-template-columns:1fr; gap:4px; }
    .api-r { grid-template-columns:1fr; gap:4px; }
    .toc-grid { grid-template-columns:1fr; }
  }