@font-face{font-family:Geist;src:url('/assets/geist.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}
/* Marketing tokens from DESIGN-MARKETING.md. Terracotta has three jobs here: the primary button, link hover and the focus ring. */
:root{--paper:#faf9f6;--white:#fff;--sand:#f3eee6;--sand-2:#ebe4d8;--night:#1f1a17;--ink:#242320;--ink-2:#4d4943;--body:#5b5750;--ink-3:#6b665e;--terra:#b55135;--terra-hover:#963f29;--line:#e7e5df;--line-strong:#d6d2ca;--hover:#f1eee8;--press:#eae7df;--get:#00734f;--get-bg:#e0f3ed;--post:#8a5000;--post-bg:#feefd6;--put:#51494c;--put-bg:#f0eeea;--del:#c8000f;--del-bg:#fbebec;--mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;--sidebar:252px;--toc:218px;--header:120px}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:144px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Geist,Arial,sans-serif;font-size:16px;font-weight:400;line-height:1.625;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button,input{font:inherit}button{cursor:pointer}button svg{flex-shrink:0}
:focus-visible{outline:2px solid var(--terra);outline-offset:4px;border-radius:3px}
.sidebar :focus-visible,#search-results :focus-visible,#navigation-dialog :focus-visible,.section-tabs :focus-visible{outline-offset:-2px}
::selection{background:var(--sand-2);color:var(--ink)}
h1,h2,h3{text-wrap:balance}
.skip-link{position:fixed;top:-70px;left:16px;z-index:20;padding:10px 16px;border-radius:4px;background:var(--ink);color:var(--white);font-size:14px;font-weight:500;line-height:20px}.skip-link:focus{top:10px}

/* Header */
.site-header{position:sticky;top:0;z-index:5;height:var(--header);background:rgba(250,249,246,.97);border-bottom:1px solid var(--line)}
.header-inner{max-width:1440px;margin:auto;height:76px;padding:0 38px;display:flex;align-items:center;gap:24px}
.brand{display:flex;align-items:center;min-width:var(--sidebar);white-space:nowrap}.brand img{display:block;width:135px;height:31px}
.docs-label{margin-left:14px;padding-left:14px;border-left:1px solid var(--line-strong);font-size:14px;font-weight:500;line-height:20px;color:var(--ink-3)}
.search-trigger{height:40px;width:340px;display:flex;align-items:center;gap:9px;padding:0 12px;border:1px solid transparent;border-radius:6px;background:var(--hover);color:var(--ink-3);font-size:14px;line-height:20px;text-align:left}.search-trigger:hover{border-color:var(--line-strong)}.search-trigger svg{width:16px;height:16px}.search-trigger kbd{margin-left:auto;white-space:nowrap}
kbd{font:500 13px/18px Geist,Arial,sans-serif;padding:0 5px;background:var(--white);border:1px solid var(--line);border-radius:4px;color:var(--ink-3)}
.header-links{margin-left:auto;display:flex;align-items:center;gap:4px}
.site-link,.text-link{display:inline-flex;align-items:center;padding:8px 12px;border-radius:4px;font-size:14px;font-weight:500;line-height:20px;color:var(--ink-2);white-space:nowrap;transition:background 100ms,color 100ms}.site-link:hover,.text-link:hover{background:var(--press);color:var(--ink)}
.start-button{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:8px 16px;border-radius:4px;background:var(--terra);color:var(--white);font-size:13px;font-weight:600;line-height:20px;white-space:nowrap;box-shadow:inset 0 1px 0 #ffffff13;transition:background 140ms}.start-button:hover{background:var(--terra-hover)}
.menu-trigger{display:none;flex:none;width:44px;height:44px;align-items:center;justify-content:center;border:0;border-radius:6px;background:transparent;color:var(--ink)}
.section-tabs{height:44px;max-width:1440px;margin:auto;padding:0 38px;display:flex;align-items:stretch;gap:28px;font-size:14px;font-weight:500;line-height:20px;overflow-x:auto;scrollbar-width:none}.section-tabs::-webkit-scrollbar{display:none}
.section-tabs a{display:flex;align-items:center;gap:9px;color:var(--body);border-bottom:2px solid transparent;white-space:nowrap}.section-tabs a:hover{color:var(--ink)}.section-tabs a[aria-current=page]{color:var(--ink);border-bottom-color:var(--ink)}
/* A row whose scrollbar is hidden (the tab strip on a phone, a pane's example tabs) fades at an edge that cuts a tab,
   so a reader can tell the row scrolls; app.js sets the classes from the row's scroll position. */
.fade-end{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 40px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 40px),transparent)}
.fade-start{-webkit-mask-image:linear-gradient(90deg,transparent,#000 40px);mask-image:linear-gradient(90deg,transparent,#000 40px)}
.fade-start.fade-end{-webkit-mask-image:linear-gradient(90deg,transparent,#000 40px,#000 calc(100% - 40px),transparent);mask-image:linear-gradient(90deg,transparent,#000 40px,#000 calc(100% - 40px),transparent)}
.coming-soon{padding:1px 6px;border-radius:4px;background:var(--hover);color:var(--ink-3);font-size:13px;font-weight:500;line-height:16px}

/* Layout and sidebar */
.docs-layout{max-width:1440px;margin:0 auto;display:grid;grid-template-columns:var(--sidebar) minmax(0,1fr) var(--toc);padding:0 38px}
.sidebar{grid-column:1;grid-row:1 / span 3;position:sticky;top:var(--header);height:calc(100dvh - var(--header));overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--line-strong) transparent;padding:32px 28px 32px 0}
.nav-group{margin:0 0 24px}
.nav-group-title{margin:0 0 6px;padding:0 12px;font-size:13px;font-weight:500;line-height:18px;color:var(--ink)}
.nav-group a{display:block;margin:2px 0;padding:8px 12px;border-radius:6px;font-size:14px;line-height:20px;color:var(--body);text-wrap:balance;transition:background 140ms,color 140ms}.nav-group a:hover{background:var(--hover);color:var(--ink)}.nav-group a[aria-current=page]{background:var(--sand-2);color:var(--ink);font-weight:500}
.sidebar-foot{display:none;margin-top:32px}.sidebar-foot a{display:block;padding:8px 12px;border-radius:6px;font-size:14px;line-height:20px;color:var(--body)}.sidebar-foot a:hover{color:var(--terra)}.sidebar-foot .account-link{display:none}
.endpoint-group{margin:0 0 8px}.endpoint-group summary{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 12px;border-radius:6px;font-size:14px;font-weight:500;line-height:20px;color:var(--ink-2);cursor:pointer;list-style:none}.endpoint-group summary::-webkit-details-marker{display:none}.endpoint-group summary:hover{background:var(--hover)}.endpoint-group summary svg{width:14px;height:14px;color:var(--ink-3);transition:transform .15s}.endpoint-group[open] summary svg{transform:rotate(90deg)}
.endpoint-group a{display:flex;align-items:flex-start;gap:8px}.endpoint-group a>span:last-child{min-width:0}

/* Article */
main{grid-column:2;grid-row:1;padding:44px clamp(30px,4vw,64px) 0;min-width:0;outline:none}main>*{max-width:690px;margin-left:auto;margin-right:auto}
.article-header{margin-bottom:40px}
/* A platform guide's mark above its eyebrow, drawn like the marketing tile's mark well; the image sizes keep the
   ratios the guide tiles give each logo, scaled from their 20px. */
.article-mark{display:grid;place-items:center;width:48px;height:48px;margin:0 0 20px;border-radius:12px;background:var(--white);box-shadow:0 0 0 1px rgba(36,35,32,.08),0 1px 2px rgba(42,26,16,.04);color:var(--ink-3)}
.article-mark svg,.article-mark img{display:block;width:24px;height:24px}
.article-mark img[src$="/cloudflare.svg"]{width:26px;height:26px}
.article-mark img[src$="/wordpress.svg"]{width:22px;height:22px}
.article-mark img[src$="/vercel.svg"]{width:17px;height:17px}
.eyebrow{margin:0 0 12px;color:var(--ink-3);font-size:14px;font-weight:500;line-height:20px}
h1{margin:0 0 16px;font-size:40px;font-weight:500;line-height:44px;letter-spacing:-.04em}
.article-description{margin:0;max-width:640px;font-size:18px;line-height:28px;color:var(--body);text-wrap:pretty}
.article-section{margin:0}
.section-heading{display:flex;align-items:baseline;gap:8px;margin:48px 0 16px}.article-section:first-child .section-heading{margin-top:0}
.article-section h2{margin:0;font-size:26px;font-weight:500;line-height:32px;letter-spacing:-.03em}
.heading-anchor{font-size:18px;line-height:1;color:var(--ink-3);opacity:0;transition:opacity 140ms}.section-heading:hover .heading-anchor,.heading-anchor:focus-visible{opacity:1}
@media(hover:none){.heading-anchor{display:none}}
article p{margin:0 0 16px;color:var(--ink-2);text-wrap:pretty}
article strong{font-weight:600;color:var(--ink)}
article ol,article ul{margin:16px 0 20px;padding-left:24px}article li{padding-left:4px;margin:8px 0;color:var(--ink-2)}article li p{margin:6px 0}article li::marker{color:var(--ink-3)}
/* The procedural tabs draw their numbered steps on a rail: a 24px ringed number centred on the step's first line,
   joined to the next number by a hairline. The numbers are ::before content, so the list keeps its list role. */
:is([data-tab=crawler-logs],[data-tab=mcp]) article ol{list-style:none;counter-reset:step;padding-left:0}
:is([data-tab=crawler-logs],[data-tab=mcp]) article ol>li{counter-increment:step;position:relative;margin:0;padding:0 0 18px 40px}
:is([data-tab=crawler-logs],[data-tab=mcp]) article ol>li:last-child{padding-bottom:0}
:is([data-tab=crawler-logs],[data-tab=mcp]) article ol>li::before{content:counter(step);position:absolute;left:0;top:1px;width:24px;height:24px;border-radius:50%;background:var(--white);box-shadow:0 0 0 1px rgba(36,35,32,.12);font-size:13px;font-weight:600;line-height:24px;text-align:center;color:var(--ink)}
:is([data-tab=crawler-logs],[data-tab=mcp]) article ol>li:not(:last-child)::after{content:"";position:absolute;left:11.5px;top:29px;bottom:3px;width:1px;background:var(--line)}
article h3{margin:28px 0 8px;font-size:18px;font-weight:600;line-height:24px;letter-spacing:-.01em}
.nowrap{white-space:nowrap}
article a{color:var(--ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}article a:hover{color:var(--terra)}
article .callout a:hover,article aside a:hover,article blockquote a:hover,article th a:hover{color:var(--terra-hover)}
article .heading-anchor,article .endpoint-list a{text-decoration:none}article .endpoint-list a:hover{color:var(--ink)}
article code{font-family:var(--mono);font-size:.9em;background:var(--sand);color:var(--ink);border-radius:4px;padding:.15em .4em;overflow-wrap:anywhere}
article .callout,article aside,article blockquote{margin:24px 0;padding:16px 20px;border-radius:8px;background:var(--sand);color:var(--ink-2);font-size:15px;line-height:24px}article .callout p,article aside p,article blockquote p{margin:0 0 8px;font-size:inherit;line-height:inherit}article .callout p:last-child,article aside p:last-child,article blockquote p:last-child{margin:0}article .callout code,article aside code,article blockquote code,article th code{background:var(--sand-2)}
article table{border-collapse:collapse;width:100%;margin:20px 0;table-layout:fixed;font-size:14px;line-height:22px}article th,article td{border-bottom:1px solid var(--line);padding:12px;text-align:left;vertical-align:top;overflow-wrap:anywhere}article th{background:var(--sand);color:var(--ink);font-weight:600}article td{color:var(--body)}article td:first-child{color:var(--ink);font-weight:500}
/* Table text is 14px, so inline code there is set to the 13px floor instead of .9em. */
article td code,article th code{font-size:13px}
.table-wrap,.table-scroll{overflow:auto;max-width:100%;margin:20px 0}.table-wrap{container-type:inline-size}.table-wrap table,.table-scroll table{margin:0}.table-scroll table{table-layout:auto;min-width:440px}.table-scroll th:nth-child(-n+3),.table-scroll td:nth-child(-n+3){white-space:nowrap}
/* A two-column table in a narrow article (its wrap is the container) reads as a list: each row is its bold term with
   the explanation below, and the header is kept for screen readers only. The build gives these tables explicit
   roles. Tables with three columns keep their columns and scroll sideways on a phone. */
@container (width < 520px){
  .table-wrap>table:not(.tool-table,:has(th:nth-child(3))),.table-wrap>table:not(.tool-table,:has(th:nth-child(3)))>tbody,.table-wrap>table:not(.tool-table,:has(th:nth-child(3))) tr,.table-wrap>table:not(.tool-table,:has(th:nth-child(3))) td{display:block}
  .table-wrap>table:not(.tool-table,:has(th:nth-child(3)))>thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .table-wrap>table:not(.tool-table,:has(th:nth-child(3)))>tbody{border-top:1px solid var(--line)}.table-wrap>table:not(.tool-table,:has(th:nth-child(3))) tr{padding:12px 0;border-bottom:1px solid var(--line)}
  .table-wrap>table:not(.tool-table,:has(th:nth-child(3))) td{padding:0;border:0}.table-wrap>table:not(.tool-table,:has(th:nth-child(3))) td+td{margin-top:4px}
}
/* MCP tool tables. Where the article is 600px or wider (its wrap is the container), each row is a two-column grid:
   the tool name with what it does below it, and Access on the right with the read-only or changes-data label and the
   permission chips. Every table shares the grid, so Access lines up from table to table, and the header is a light
   label row; its "What it does" cell is kept for screen readers only. Narrower, each row stacks: the name, then
   access and permissions, then what the tool does. Names keep one line and cells wrap only between words. The
   underline under a linked name stays light, because 141 underlined chips read as noise. */
.tool-table th,.tool-table td,.tool-table code{overflow-wrap:normal}.tool-table td:first-child{white-space:nowrap}
.tool-table a{text-decoration-color:var(--line-strong)}.tool-table a code{transition:background 120ms,color 120ms}.tool-table a:hover{color:var(--terra-hover);text-decoration-color:currentColor}.tool-table a:hover code{background:var(--sand-2);color:var(--terra-hover)}
.tool-access{display:inline-block;margin-right:4px;padding:0 6px;border-radius:4px;background:var(--get-bg);color:var(--get);font-size:13px;font-weight:500;line-height:20px;white-space:nowrap}.tool-access[data-access=write]{background:var(--post-bg);color:var(--post)}
@container (width >= 600px){
  .tool-table,.tool-table thead,.tool-table tbody{display:block}
  .tool-table tr{display:grid;grid-template-columns:minmax(0,1fr) 176px;column-gap:24px;row-gap:2px}
  .tool-table thead tr{padding-bottom:8px;border-bottom:1px solid var(--line-strong)}
  .tool-table th{padding:0;border:0;background:none;font-size:13px;font-weight:500;line-height:18px;color:var(--ink-3)}
  .tool-table th:nth-child(2){grid-column:2}
  .tool-table th:nth-child(3){position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .tool-table tbody tr{padding:12px 0;border-bottom:1px solid var(--line)}
  .tool-table td{padding:0;border:0}
  .tool-table td:nth-child(2){grid-column:2;grid-row:1 / span 2}
  .tool-table td:nth-child(3){grid-column:1;grid-row:2}
}
@container (width < 600px){
  .table-wrap .tool-table,.tool-table tbody,.tool-table tr,.tool-table td{display:block}
  .tool-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .tool-table tbody{border-top:1px solid var(--line)}.tool-table tr{padding:14px 0;border-bottom:1px solid var(--line)}
  .tool-table td{padding:0;border:0}.tool-table td+td{margin-top:6px}
}
/* The Tools page is one index, so its group headings sit closer to their tables than an article's chapters. */
.article-section:has(.tool-table) .section-heading{margin:36px 0 10px}.article-section:has(.tool-table) h2{font-size:20px;line-height:28px;letter-spacing:-.02em}

/* Guide tiles: the Academy landing's linked groups; the whole tile is the link. They follow the marketing tile
   (components/marketing/kit/kit.css): a hairline ring and warm shadow, a 40px ringed mark well, 16/24 titles whose first
   line is centred on the well, and on hover a lighter fill with a terracotta title (4.9:1 on #fdfcf9). Two columns
   only when each tile gets 248px, so where the sidebar leaves the article narrow the tiles stack instead of squeezing
   their copy. */
.doc-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,248px),1fr));gap:12px;margin-top:16px}
.doc-card{display:flex;gap:14px;align-items:flex-start;padding:20px;border-radius:12px;background:var(--white);box-shadow:0 0 0 1px rgba(36,35,32,.08),0 1px 2px rgba(42,26,16,.04);color:var(--ink);text-decoration:none;transition:background 120ms,box-shadow 120ms,color 120ms}
@media(hover:hover){.doc-card:hover{background:#fdfcf9;box-shadow:0 0 0 1px rgba(36,35,32,.12),0 1px 2px rgba(42,26,16,.05);color:var(--terra)}}
.doc-card:focus-visible{outline:2px solid var(--terra);outline-offset:2px}
.doc-card-icon{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:8px;background:var(--sand);box-shadow:0 0 0 1px rgba(36,35,32,.08);color:var(--ink-3)}
.doc-card-text{min-width:0;padding-top:8px}
.doc-card-title{display:block;font-size:16px;line-height:24px;font-weight:600;letter-spacing:-.01em;text-wrap:balance}
.doc-card-body{display:block;margin-top:2px;font-size:14px;line-height:21px;font-weight:400;color:var(--body);text-wrap:pretty}
/* Platform logos in the same well, sized by eye for the well: Cloudflare and Vercel keep about the 3:2 ratio
   the homepage's MARKS (AgentMcpSection.tsx) gives them, because Vercel's solid triangle reads heavier than any
   outline; the 24-unit WordPress file fills more of its box than the 32-unit files, so it is drawn smaller. Netlify
   keeps the 20px the markup sets. */
.doc-card-logo img[src$="/cloudflare.svg"]{width:22px;height:22px}
.doc-card-logo img[src$="/wordpress.svg"]{width:18px;height:18px}
.doc-card-logo img[src$="/vercel.svg"]{width:14px;height:14px}

/* Code: one mono stack, Night panes, no syntax colours */
article pre,.example-panel pre{margin:0;padding:14px;overflow:auto;border-radius:10px;background:var(--night);color:var(--sand);font:13px/1.6 var(--mono);white-space:pre;tab-size:2;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.22) transparent}
article pre{margin:24px 0}article pre code,.example-panel pre code{padding:0;border-radius:0;background:none;color:inherit;font:inherit;overflow-wrap:normal}
article pre ::selection,.example-panel pre ::selection{background:rgba(255,255,255,.18);color:var(--white)}
.schema-detail summary{display:flex;align-items:center;gap:6px;padding:9px 0;font-size:14px;font-weight:500;line-height:20px;color:var(--ink);cursor:pointer;list-style:none}.schema-detail summary::-webkit-details-marker{display:none}.schema-detail summary::before{content:"";width:14px;height:14px;flex:none;background:var(--ink-3);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 6 6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 6 6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;transition:transform .15s}.schema-detail[open] summary::before{transform:rotate(90deg)}.schema-detail pre{max-width:100%;max-height:440px;margin:0 0 16px}
.download-link{font-weight:500}

/* API: methods, endpoint signature and list */
.method{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;padding:2px 7px;border-radius:4px;background:var(--get-bg);color:var(--get);font-size:13px;font-weight:600;line-height:18px}.method-post{background:var(--post-bg);color:var(--post)}.method-patch,.method-put{background:var(--put-bg);color:var(--put)}.method-delete{background:var(--del-bg);color:var(--del)}
.nav-group .method{width:56px;justify-content:flex-start;padding:0;border-radius:0;background:none;line-height:20px}
.endpoint-signature{display:flex;align-items:flex-start;gap:10px;margin-top:24px;padding:14px 16px;border:1px solid var(--line);border-radius:8px;background:var(--white)}.endpoint-signature code{min-width:0;font-family:var(--mono);font-size:14px;line-height:22px;overflow-wrap:anywhere}
.endpoint-list{margin:20px 0;border:1px solid var(--line);border-radius:8px;background:var(--white);overflow:hidden}.endpoint-list>a{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;border-bottom:1px solid var(--line);transition:background 140ms}.endpoint-list>a:last-child{border:0}.endpoint-list>a:hover{background:var(--hover)}.endpoint-list>a>span:last-child{display:flex;flex-direction:column;gap:4px;min-width:0}.endpoint-list strong{font-size:14px;font-weight:600;line-height:20px;color:var(--ink)}article .endpoint-list code{padding:0;background:none;color:var(--ink-3);font-size:13px;line-height:20px}

/* Right rail: it scrolls on its own when its contents run past the screen (a long page's contents, an example pane), and
   app.js keeps the active entry of a long contents list in view. */
.table-of-contents{grid-column:3;grid-row:1;position:sticky;top:var(--header);align-self:start;max-height:calc(100dvh - var(--header));overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--line-strong) transparent;padding:46px 0 32px 20px;font-size:14px;line-height:21px}
.table-of-contents>p{margin:0 0 14px;font-size:14px;font-weight:600;line-height:20px;color:var(--ink)}
.table-of-contents nav{border-left:1px solid var(--line)}.table-of-contents nav a{display:block;margin-left:-1px;padding:4px 0 4px 14px;border-left:2px solid transparent;line-height:21px;color:var(--body);text-wrap:balance}.table-of-contents nav a:hover{color:var(--ink)}.table-of-contents nav a.active{color:var(--ink);border-left-color:var(--ink)}.table-of-contents nav a:focus-visible{outline-offset:-2px}
.table-of-contents nav a.toc-sub{padding-left:28px;font-size:13px;line-height:20px}
/* A rail that scrolls fades at its bottom edge while more of it sits below (app.js sets the class). */
.table-of-contents.fade-bottom{-webkit-mask-image:linear-gradient(#000 calc(100% - 56px),transparent);mask-image:linear-gradient(#000 calc(100% - 56px),transparent)}
/* A faded row or rail that holds keyboard focus drops its fade, so the focused item and its ring always show in full. */
:is(.fade-start,.fade-end,.table-of-contents.fade-bottom):has(:focus-visible){-webkit-mask-image:none;mask-image:none}
.rail-card{margin-top:32px;padding:18px 18px 20px;border-radius:12px;background:var(--sand)}.rail-card:first-child{margin-top:0}
.rail-card p{margin:4px 0 0;font-size:14px;line-height:20px;color:var(--body)}.rail-card .rail-card-title{margin:0;font-size:15px;font-weight:600;line-height:22px;letter-spacing:-.01em;color:var(--ink);text-wrap:balance}
.rail-card a{display:inline-block;margin-top:12px;font-size:14px;font-weight:500;line-height:20px;text-wrap:balance;color:var(--ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}.rail-card a:hover{color:var(--terra-hover)}
.with-examples{--examples:350px;grid-template-columns:var(--sidebar) minmax(0,1fr) var(--examples)}.with-examples main{padding-left:34px;padding-right:34px}.with-examples .table-of-contents{padding-left:22px;padding-bottom:24px}.with-examples .table-of-contents nav{margin-bottom:24px}
.example-pane{margin-top:24px;border-radius:10px;background:var(--night);color:rgba(255,255,255,.72);overflow:hidden}
.example-pane :focus-visible{outline-color:var(--white);outline-offset:-2px}
/* The tabs keep one row that scrolls, fading at a cut edge; the pane follows the section being read (app.js). */
.example-tabs{display:flex;gap:4px;padding:6px;border-bottom:1px solid rgba(255,255,255,.1);overflow-x:auto;scrollbar-width:none}.example-tabs::-webkit-scrollbar{display:none}
.example-tabs button{flex:none;white-space:nowrap;padding:6px 10px;border:0;border-radius:6px;background:transparent;color:rgba(255,255,255,.72);font-size:13px;font-weight:500;line-height:20px;text-align:left}.example-tabs button:hover{color:var(--white)}.example-tabs button[aria-selected=true]{background:rgba(255,255,255,.1);color:var(--white)}
.code-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 14px 0;font-size:13px;line-height:20px}
.copy-code{min-height:28px;padding:3px 10px;border:1px solid rgba(255,255,255,.22);border-radius:4px;background:rgba(255,255,255,.06);color:var(--white);font-size:13px;font-weight:500;line-height:20px;transition:background 140ms}.copy-code:hover{background:rgba(255,255,255,.12)}
.example-panel pre{max-height:480px;margin:0;border-radius:0}
/* MCP tool calls are JSON, whose line breaks carry no meaning, so in the narrow pane they wrap instead of hiding the
   ends of long values; Copy still copies the example as written. Code whose lines matter scrolls inside its pane.
   Each JSON line is a block (build.mjs) whose wrapped rows hang two characters deeper than its first row. */
[data-tab=mcp] .example-panel[data-language=json] pre,[data-tab=mcp] .example-panel[data-language=json] pre code{white-space:pre-wrap;overflow-wrap:anywhere}
.code-line{display:block;padding-left:var(--hang);text-indent:calc(-1 * var(--hang))}
.example-note{margin:0;padding:0 14px 14px;font-size:13px;line-height:20px}
/* A section's inline example pane sits in the article; it keeps the pane's own note colour, not the article's. */
article .example-pane{margin:24px 0}article .example-panel pre{max-height:none}article .example-note{color:inherit}
/* At 1100px and below a rail pane whose examples span several sections sits after the article (app.js). */
main>.example-pane{margin-top:32px}

/* Pagination and footer */
.page-pagination{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:56px;padding:24px 0;border-top:1px solid var(--line)}
.page-pagination a{display:flex;flex-direction:column;gap:4px;min-height:44px}
.page-pagination span{font-size:13px;font-weight:500;line-height:20px;color:var(--ink-3)}
.page-pagination strong{display:inline-flex;align-items:center;gap:8px;font-size:16px;font-weight:500;line-height:24px;color:var(--ink);transition:color 140ms}.page-pagination a:hover strong{color:var(--terra)}.page-pagination svg{width:16px;height:16px}.page-pagination .previous svg{transform:rotate(180deg)}
.page-pagination .next{text-align:right;align-items:flex-end}
/* A tab's first page has no previous link, so its next link takes the whole row and its title keeps one line on a phone. */
.page-pagination>span:empty{display:none}.page-pagination>span:first-child+.next{grid-column:1 / -1;justify-self:end}
.docs-footer{grid-column:2;grid-row:2;padding:0 clamp(30px,4vw,64px)}.with-examples .docs-footer{padding-inline:34px}.footer-inner{max-width:690px;margin:48px auto 0;border-top:1px solid var(--line);padding-top:32px}
.footer-main{display:grid;grid-template-columns:1fr auto;gap:32px;align-items:start}
.footer-brand img{display:block;width:104px;height:24px}.footer-brand p{margin:12px 0 0;font-size:14px;line-height:22px;color:var(--body)}.footer-brand p a{color:var(--ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}.footer-brand p a:hover{color:var(--terra)}
.footer-links{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px 20px;font-size:14px;line-height:20px;color:var(--body)}.footer-links a{display:inline-flex;align-items:center;min-height:24px;white-space:nowrap}.footer-links a:hover,.footer-legal a:hover{color:var(--terra)}
.footer-legal{display:flex;justify-content:space-between;gap:16px;margin-top:28px;padding:20px 0 32px;border-top:1px solid var(--line);font-size:13px;line-height:20px;color:var(--ink-3)}.footer-legal nav{display:flex;gap:20px}.footer-legal a{display:inline-flex;align-items:center;min-height:24px;white-space:nowrap}
.mobile-toc{display:none}

/* Dialogs */
dialog{max-width:none;padding:0;border:1px solid var(--line-strong);border-radius:12px;background:var(--white);color:var(--ink);box-shadow:0 12px 28px rgba(42,26,16,.1),0 40px 48px -16px rgba(42,26,16,.1)}dialog::backdrop{background:rgba(31,26,23,.32);backdrop-filter:blur(2px)}
#search-dialog{width:min(640px,calc(100vw - 32px));max-height:80dvh;margin:14vh auto auto}
.search-header{display:flex;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid var(--line)}.search-header>svg{color:var(--ink-3)}
.search-header input{flex:1;min-width:0;border:0;outline:none;background:none;color:var(--ink);font-size:16px;line-height:24px}.search-header input::placeholder{color:var(--ink-3);opacity:1}.search-header input::-webkit-search-cancel-button{display:none}
.search-header button,.mobile-nav-header button{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border:0;border-radius:6px;background:none;color:var(--ink-3)}.search-header button:hover,.mobile-nav-header button:hover{color:var(--ink)}
#search-results{max-height:52dvh;overflow-y:auto;padding:8px}
#search-results a{display:flex;flex-direction:column;gap:2px;padding:12px 14px;border-radius:8px;color:var(--ink)}#search-results a:hover,#search-results a:focus{background:var(--hover)}
.result-group{font-size:13px;font-weight:500;line-height:18px;color:var(--ink-3)}#search-results strong{font-size:15px;font-weight:600;line-height:22px}.result-excerpt{font-size:14px;line-height:20px;color:var(--body)}
.search-empty{margin:0;padding:24px 12px;font-size:14px;line-height:22px;color:var(--body)}
.search-footer{display:flex;justify-content:space-between;padding:10px 16px;border-top:1px solid var(--line);font-size:13px;line-height:20px;color:var(--ink-3)}
#navigation-dialog{width:min(360px,calc(100vw - 24px));height:calc(100dvh - 24px);max-height:calc(100dvh - 24px);margin:12px auto 12px 12px;padding:0 20px}#navigation-dialog[open]{display:flex;flex-direction:column}
.mobile-nav-header{display:flex;justify-content:space-between;align-items:center;padding:8px 0 8px 12px;border-bottom:1px solid var(--line);background:var(--white);font-size:14px;font-weight:600;line-height:20px}.mobile-nav-header button{width:44px;height:44px;margin-right:-10px}
#mobile-navigation{flex:1;min-height:0;overflow:auto;padding:16px 0}#mobile-navigation .nav-group a{min-height:44px;display:flex;align-items:center}#mobile-navigation .endpoint-group a{align-items:center}
.mobile-nav-foot{display:flex;flex-direction:column;padding:12px 0 calc(16px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:var(--white)}.mobile-nav-foot a{display:flex;align-items:center;min-height:44px;padding-left:12px;font-size:14px;font-weight:500;line-height:20px;color:var(--ink-2)}.mobile-nav-foot .start-button{margin-top:8px;min-height:44px;font-size:14px;font-weight:600;color:var(--white)}

@media(min-width:1440px){:root{--sidebar:270px;--toc:228px}.with-examples{--examples:400px}}
@media(max-width:1100px){
  :root{--sidebar:220px;--toc:0px}
  .header-inner{padding:0 28px}.brand{min-width:220px}.search-trigger{flex:1 1 300px;min-width:200px;width:auto;max-width:340px}.site-link{display:none}
  .section-tabs{padding:0 28px}
  .docs-layout{padding:0 28px;grid-template-columns:var(--sidebar) minmax(0,1fr)}
  .sidebar{padding-right:20px}.sidebar-foot{display:block}
  main{padding:36px 36px 0}.docs-footer,.with-examples .docs-footer{padding-inline:36px}
  .table-of-contents{display:none}
  .with-examples{grid-template-columns:var(--sidebar) minmax(0,1fr)}.with-examples main{padding-left:36px;padding-right:36px}
  .with-examples .table-of-contents{display:block;position:static;grid-column:2;grid-row:2;max-height:none;padding:0 36px 28px}.with-examples .table-of-contents>p,.with-examples .table-of-contents>nav,.with-examples .rail-card{display:none}
  .docs-footer{grid-row:3}.example-panel pre{max-height:420px}
  /* app.js moves the example pane into the article column, so an emptied rail leaves no band above the footer. */
  .with-examples .table-of-contents:not(:has(.example-pane)){display:none}
  /* The rail is gone, so every page from here down lists its contents under its header. */
  .mobile-toc{display:block;margin:0 0 24px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.mobile-toc summary{display:flex;align-items:center;min-height:44px;font-size:14px;line-height:20px;color:var(--body);cursor:pointer}.mobile-toc nav{display:flex;flex-direction:column;padding:0 0 12px}.mobile-toc nav a{padding:10px 0;font-size:14px;line-height:20px;color:var(--body);text-wrap:balance}.mobile-toc nav a.toc-sub{padding-left:16px}
  .mobile-toc summary{justify-content:space-between;list-style:none}.mobile-toc summary::-webkit-details-marker{display:none}.mobile-toc summary::after{content:"";flex:none;width:14px;height:14px;background:var(--ink-3);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 6 6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 6 6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;transform:rotate(90deg);transition:transform .15s}.mobile-toc[open] summary::after{transform:rotate(-90deg)}
  .footer-legal{flex-wrap:wrap;gap:8px 24px}
}
@media(max-width:760px){
  :root{--header:108px}
  html{scroll-padding-top:130px}
  .header-inner{height:64px;padding:0 16px;gap:0}.brand{min-width:0}.brand img{width:113px;height:26px}.docs-label{margin-left:14px;padding-left:14px}
  .search-trigger{flex:none;width:44px;height:44px;min-width:0;margin-left:auto;padding:0;justify-content:center;border:0;background:transparent;color:var(--ink)}.search-trigger svg{width:20px;height:20px}.search-trigger span,.search-trigger kbd,.header-links{display:none}
  .menu-trigger{display:flex}
  .section-tabs{padding:0 16px;gap:24px}
  .docs-layout{display:block;padding:0}.sidebar{display:none}
  main,.with-examples main{padding:32px 16px 0}.article-header{margin-bottom:32px}
  h1{font-size:34px;line-height:38px}.article-description{font-size:17px;line-height:26px}
  .section-heading{margin:40px 0 12px}.article-section h2{font-size:22px;line-height:28px}
  .table-scroll table,.table-wrap>table:not(.tool-table):has(th:nth-child(3)){min-width:520px}
  .doc-cards{grid-template-columns:1fr}.doc-card{padding:16px;gap:12px}
  .endpoint-signature code{font-size:13px}.endpoint-list>a{padding:13px 12px;gap:10px}
  .with-examples .table-of-contents{padding:0 16px 28px}.example-pane{margin-top:0}.example-tabs button{min-height:36px;font-size:14px}.example-panel pre{max-height:420px}
  .page-pagination{gap:16px;margin-top:40px;padding:20px 0}.page-pagination strong{font-size:15px;line-height:22px}
  .docs-footer,.with-examples .docs-footer{padding-inline:16px}.footer-main{grid-template-columns:1fr;gap:24px}.footer-links{display:grid;grid-template-columns:1fr;justify-content:stretch;gap:0 16px}.footer-links a{min-height:32px}.footer-legal{flex-direction:column;gap:8px}.footer-legal nav{gap:20px}
  #search-dialog{width:calc(100vw - 32px);margin-top:8vh}#search-results{max-height:60dvh}.search-header button{width:44px;height:44px;margin-right:-10px}
}
@media(max-width:560px){.search-footer{display:none}}
@media(max-width:359px){h1{font-size:30px;line-height:34px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}dialog::backdrop{backdrop-filter:none}*,*::before,*::after{transition:none!important}}