/* Docs layout — extends styles.css (Workbench light), loaded after it. */

.docs-shell{display:grid;grid-template-columns:220px 1fr;gap:56px;align-items:start;padding-top:48px;padding-bottom:96px}

/* sidebar */
.docs-side{position:sticky;top:96px;display:flex;flex-direction:column;gap:2px}
.docs-side .lbl{margin-bottom:10px}
.docs-side a{font-size:13.5px;color:var(--ink2);padding:6px 10px;border-left:2px solid var(--line);transition:color .13s,border-color .13s}
.docs-side a:hover{color:var(--ink)}
.docs-side a.on{color:var(--ink);border-left-color:var(--ink);font-weight:600}

/* content */
.docs-main{min-width:0;max-width:760px}
.docs-main h1{font-size:clamp(26px,3vw,34px);font-weight:700;letter-spacing:-0.03em}
.docs-main .sub{font-size:16px;line-height:1.6;color:var(--ink2);margin-top:14px;max-width:640px}
.docs-main section{margin-top:64px;scroll-margin-top:88px}
.docs-main h2{font-size:22px;font-weight:600;letter-spacing:-0.02em;padding-bottom:12px;border-bottom:1px solid var(--line)}
.docs-main h3{font-size:16px;font-weight:600;margin-top:28px}
.docs-main p{font-size:14.5px;line-height:1.65;color:var(--ink2);margin-top:12px}
.docs-main p strong{color:var(--ink)}
.docs-main ul,.docs-main ol{margin:12px 0 0 20px;display:flex;flex-direction:column;gap:7px}
.docs-main li{font-size:14.5px;line-height:1.6;color:var(--ink2)}
.docs-main li strong{color:var(--ink)}
.docs-main a:not(.wbtn){color:var(--ink);text-decoration:underline;text-decoration-color:var(--lineS);text-underline-offset:3px}
.docs-main a:not(.wbtn):hover{text-decoration-color:var(--ink)}

/* inline code + blocks */
.docs-main code{font-family:var(--mono);font-size:12.5px;background:var(--inset);border-radius:5px;padding:2px 6px;color:var(--ink)}
.docs-main pre{background:#1B1D21;color:#E7E8EA;font-family:var(--mono);font-size:12.5px;line-height:1.6;border-radius:10px;padding:16px 18px;margin-top:14px;overflow-x:auto}
.docs-main pre code{background:none;padding:0;color:inherit;font-size:inherit}
.docs-main pre .cmt{color:#7B8089}

/* reference tables (handwritten + generated) */
.docs-main table{width:100%;border-collapse:collapse;margin-top:14px;font-size:13.5px;background:var(--pane);border:1px solid var(--line);border-radius:10px;overflow:hidden}
.docs-main th{font-family:var(--mono);font-size:10.5px;letter-spacing:0.1em;text-transform:uppercase;color:var(--ink3);text-align:left;font-weight:600;padding:10px 14px;border-bottom:1px solid var(--line);background:var(--list)}
.docs-main td{padding:10px 14px;border-bottom:1px solid var(--line);vertical-align:top;line-height:1.55;color:var(--ink2)}
.docs-main tr:last-child td{border-bottom:none}
.docs-main td:first-child{font-family:var(--mono);font-size:12.5px;color:var(--ink);white-space:nowrap}

/* endpoint reference */
.endpoint{display:flex;align-items:baseline;gap:10px;margin-top:22px;font-family:var(--mono)}
.endpoint .method{font-size:10.5px;font-weight:600;letter-spacing:0.08em;border:1px solid var(--line);border-radius:6px;padding:3px 8px;background:var(--pane);color:var(--ink)}
.endpoint .path{font-size:13.5px;font-weight:500;color:var(--ink)}
.endpoint + p{margin-top:8px}

/* callouts */
.callout{display:flex;gap:12px;border:1px solid var(--line);border-left:3px solid var(--ink);border-radius:10px;background:var(--pane);padding:14px 16px;margin-top:16px;font-size:13.5px;line-height:1.6;color:var(--ink2)}
.callout.soon{border-left-color:var(--sevl)}

/* generated-section marker */
.gen-note{font-family:var(--mono);font-size:10.5px;letter-spacing:0.08em;color:var(--ink3);margin-top:8px}

@media (max-width:880px){
  .docs-shell{grid-template-columns:1fr;gap:32px}
  .docs-side{position:static;flex-direction:row;flex-wrap:wrap;gap:6px}
  .docs-side .lbl{display:none}
  .docs-side a{border:1px solid var(--line);border-radius:7px;padding:6px 12px}
  .docs-side a.on{border-color:var(--ink)}
}
