  /* ── Docs shell ──────────────────────────────────────────── */
  .docs-shell { display: flex; gap: 0; min-height: calc(100vh - 108px); }
  .docs-toc   { width: 220px; flex-shrink: 0; padding: 1.25rem .75rem; border-right: 1px solid var(--gw-border); position: sticky; top: 0; height: calc(100vh - 108px); overflow-y: auto; background: var(--gw-surface); }
  .docs-main  { flex: 1; padding: 1.5rem 2rem; max-width: 860px; }
  .docs-toc h6 { font-size: .7rem; text-transform: uppercase; letter-spacing: .06em; color: var(--gw-muted); margin-bottom: .5rem; }
  .toc-item   { display: block; font-size: .82rem; color: var(--gw-muted); padding: .2rem .25rem .2rem .6rem; border-left: 2px solid transparent; text-decoration: none; line-height: 1.4; transition: all .12s; }
  .toc-item:hover { color: var(--gw-text); border-left-color: var(--gw-border); }
  .toc-item.toc-h1 { font-weight: 600; color: var(--gw-text); padding-left: .25rem; }
  .toc-item.toc-h2 { padding-left: .75rem; }
  .toc-item.toc-h3 { padding-left: 1.25rem; font-size: .78rem; }
  .toc-item.active  { color: var(--gw-primary); border-left-color: var(--gw-primary); }

  /* ── Docs toolbar ────────────────────────────────────────── */
  .docs-toolbar { display: flex; align-items: center; gap: .5rem; padding: .6rem 1rem; border-bottom: 1px solid var(--gw-border); background: var(--gw-surface); }

  /* ── Rendered markdown ───────────────────────────────────── */
  .md-body { line-height: 1.75; color: var(--gw-text); }
  .md-body h1 { font-size: 1.75rem; font-weight: 700; margin: 1.5rem 0 .75rem; padding-bottom: .4rem; border-bottom: 1px solid var(--gw-border); }
  .md-body h2 { font-size: 1.3rem; font-weight: 600; margin: 1.5rem 0 .6rem; padding-bottom: .3rem; border-bottom: 1px solid var(--gw-border); }
  .md-body h3 { font-size: 1.05rem; font-weight: 600; margin: 1.25rem 0 .5rem; }
  .md-body h4 { font-size: .95rem; font-weight: 600; margin: 1rem 0 .4rem; }
  .md-body p  { margin: 0 0 .85rem; }
  .md-body ul, .md-body ol { padding-left: 1.4rem; margin: 0 0 .85rem; }
  .md-body li { margin-bottom: .3rem; }
  .md-body code { background: var(--gw-surface-variant); padding: .15em .35em; border-radius: 4px; font-size: .875em; font-family: monospace; }
  .md-body pre  { background: #0d1117; border: 1px solid var(--gw-border); border-radius: 8px; padding: 1rem; overflow-x: auto; margin: 0 0 1rem; }
  .md-body pre code { background: none; padding: 0; font-size: .82rem; }
  .md-body blockquote { border-left: 3px solid var(--gw-primary); padding: .5rem 1rem; margin: 0 0 .85rem; color: var(--gw-muted); background: var(--gw-tonal-bg); border-radius: 0 6px 6px 0; }
  .md-body hr  { border: none; border-top: 1px solid var(--gw-border); margin: 1.5rem 0; }
  .md-body a   { color: var(--gw-link); }
  .md-body table { width: 100%; border-collapse: collapse; margin: 0 0 1rem; font-size: .88rem; }
  .md-body th, .md-body td { padding: .45rem .75rem; border: 1px solid var(--gw-border); }
  .md-body th { background: var(--gw-surface-variant); font-weight: 600; }
  .md-body strong { font-weight: 600; }
  .md-body em { font-style: italic; }

  /* ── Edit textarea ───────────────────────────────────────── */
  #docs-editor { display: none; }
  #docs-editor textarea { width: 100%; min-height: 60vh; font-family: monospace; font-size: .82rem; background: var(--gw-bg); color: var(--gw-text); border: 1px solid var(--gw-border); border-radius: 8px; padding: .75rem; resize: vertical; outline: none; }

  /* ── Empty state ─────────────────────────────────────────── */
  .docs-empty { text-align: center; padding: 4rem 2rem; color: var(--gw-muted); }
  .docs-empty i { font-size: 3rem; display: block; margin-bottom: 1rem; }
