/* Developer docs: one layout for every /docs page. Loaded after product.css and
   scoped to .docs-shell so it overrides the older doc rules without touching other pages. */
.docs-shell{
  --d-ink:#342d32;--d-muted:#6b5a64;--d-line:#ead9df;--d-soft:#f8e3ea;--d-action:#c8446f;
  --d-action-ink:#a8325a;--d-surface:#fffdfc;--d-code:#fbf3f6;--d-code-ink:#4a2f3c;--d-warn:#8a5200;--d-warn-soft:#fdf3e1;
  max-width:1360px;margin:0 auto;display:grid;grid-template-columns:252px minmax(0,1fr) 208px;align-items:start;color:var(--d-ink)
}
.docs-shell:not(:has(>.toc)){grid-template-columns:252px minmax(0,1fr)}
.docs-shell .docs-menu-toggle{display:none}

/* Sidebar */
.docs-shell .doc-nav{position:sticky;top:0;max-height:100vh;overflow:auto;display:block;white-space:normal;padding:28px 18px 48px 24px;border-right:1px solid var(--d-line);border-bottom:0;background:transparent}
.docs-shell .docs-nav-group+.docs-nav-group{margin-top:22px}
.docs-shell .doc-nav .nav-group{display:block;margin:0 0 6px 12px;font-size:12px;font-weight:600;letter-spacing:.06em;color:var(--d-muted)}
.docs-shell .doc-nav a{display:block;margin:1px 0;padding:7px 12px;border-radius:6px;font-size:14px;line-height:1.5;font-weight:400;color:var(--d-ink);text-decoration:none;background:none;box-shadow:none}
.docs-shell .doc-nav a:hover{background:var(--d-soft)}
.docs-shell .doc-nav a.selected{background:var(--d-soft);color:var(--d-action-ink);font-weight:600;box-shadow:inset 2px 0 var(--d-action)}

/* Article */
.docs-shell .doc-body{min-width:0;max-width:840px;padding:34px clamp(20px,4vw,56px) 80px}
.docs-crumb{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 14px;font-size:13px;color:var(--d-muted)}
.docs-crumb a{color:var(--d-muted);text-decoration:none}
.docs-crumb a:hover{color:var(--d-action-ink);text-decoration:underline}
.docs-shell .doc-body>h1,.docs-shell .markdown-body>h1{margin:0 0 12px;font-size:clamp(28px,3.2vw,38px);line-height:1.25;letter-spacing:-.01em;text-wrap:balance}
.docs-shell .doc-lead{max-width:40em;margin:0 0 8px;font-size:17px;line-height:1.75;color:var(--d-muted)}
.docs-shell .doc-section{margin-top:48px;scroll-margin-top:24px}
.docs-shell .doc-section h2,.docs-shell .markdown-body h2{display:flex;align-items:center;gap:12px;margin:0 0 10px;font-size:22px;line-height:1.35;text-wrap:balance;scroll-margin-top:24px}
.docs-shell .markdown-body h2{margin-top:48px}
.docs-shell .doc-section h3,.docs-shell .markdown-body h3{margin:28px 0 8px;font-size:17px;line-height:1.4}
.docs-shell .doc-section p,.docs-shell .markdown-body p,.docs-shell .doc-body li{max-width:44em;font-size:15px;line-height:1.85;color:var(--d-ink)}
.docs-shell .doc-section p,.docs-shell .markdown-body p{margin:10px 0}
.docs-shell .doc-body ul,.docs-shell .doc-body ol{padding-left:1.3em;margin:10px 0}
.docs-shell .doc-body li{margin:6px 0}
.docs-shell .doc-body a:not(.doc-nav a):not(.docs-crumb a):not(.docs-next a){color:var(--d-action-ink);text-decoration:underline;text-underline-offset:3px}
.docs-shell .doc-body code:not(pre code){font:500 .88em var(--mono);color:#9d2f55;background:var(--d-code);padding:1px 5px;border-radius:4px;overflow-wrap:anywhere}
.docs-shell .muted{color:var(--d-muted)}
.docs-shell .step{display:inline-grid;place-items:center;flex:none;width:30px;height:30px;border-radius:50%;background:var(--d-action);color:#fff;font:700 14px var(--mono)}

/* Callouts */
.docs-shell .callout{max-width:44em;margin:20px 0;padding:14px 18px;border-left:3px solid var(--d-action);border-radius:0 8px 8px 0;background:var(--d-soft);font-size:14px;line-height:1.8;color:var(--d-ink)}
.docs-shell .callout.warn{border-left-color:#c98a1b;background:var(--d-warn-soft)}
.docs-shell .callout b{display:block;margin-bottom:2px}

/* Four-step flow */
.flow{list-style:none;margin:22px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;counter-reset:flow}
.flow li{counter-increment:flow;position:relative;display:grid;gap:4px;align-content:start;margin:0;padding:16px 16px 18px;border:1px solid var(--d-line);border-radius:10px;background:var(--d-surface);font-size:14px;line-height:1.7}
.flow li::before{content:counter(flow);display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--d-action);color:#fff;font:700 13px var(--mono)}
.flow li:not(:last-child)::after{content:"→";position:absolute;right:-12px;top:18px;width:12px;text-align:center;color:var(--d-muted);font-size:14px}
.flow .who{font-size:12px;font-weight:600;letter-spacing:.04em;color:var(--d-muted)}
.flow li.browser{background:var(--d-soft);border-color:#efcbd8}
.flow b{font-size:15px}

/* Glossary */
.glossary{display:grid;grid-template-columns:minmax(150px,max-content) 1fr;gap:0;margin:16px 0 0;border-top:1px solid var(--d-line)}
.glossary dt,.glossary dd{margin:0;padding:12px 0;border-bottom:1px solid var(--d-line);font-size:14.5px;line-height:1.75}
.glossary dt{padding-right:24px;font-weight:600}
.glossary dt code{font-weight:500}

/* Code */
.docs-shell .codebox{margin:16px 0;border:1px solid var(--d-line);border-radius:10px;overflow:hidden;background:var(--d-code)}
.docs-shell .code-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:6px 8px 6px 14px;border-bottom:1px solid var(--d-line);background:var(--d-surface);font:12px var(--mono);color:var(--d-muted)}
.code-tabs{display:flex;flex-wrap:wrap;gap:4px}
.code-tabs button{padding:6px 11px;border:0;border-radius:6px;background:none;font:600 12.5px inherit;font-family:inherit;color:var(--d-muted);cursor:pointer}
.code-tabs button:hover{color:var(--d-ink)}
.code-tabs button[aria-pressed="true"]{background:var(--d-soft);color:var(--d-action-ink)}
.docs-shell .copy-btn{flex:none;padding:5px 11px;border:1px solid var(--d-line);border-radius:6px;background:#fff;font:600 12px inherit;font-family:inherit;color:var(--d-action-ink);cursor:pointer}
.docs-shell .copy-btn:hover{border-color:var(--d-action)}
.docs-shell .codebox pre,.docs-shell .markdown-body pre{margin:0;padding:16px 18px;overflow:auto;max-height:620px;white-space:pre;tab-size:2;font:13px/1.75 var(--mono);color:var(--d-code-ink)}
.docs-shell .markdown-body pre{margin:16px 0;border:1px solid var(--d-line);border-radius:10px;background:var(--d-code)}
.docs-shell pre:focus-visible,.docs-shell .reference-scroll:focus-visible,.docs-shell .table-scroll:focus-visible{outline:2px solid var(--d-action);outline-offset:2px}
.docs-shell a:focus-visible,.docs-shell button:focus-visible{outline:2px solid var(--d-action);outline-offset:2px;border-radius:4px}

/* Tables */
.docs-shell .reference-scroll,.docs-shell .table-scroll{margin:14px 0;overflow-x:auto;border:1px solid var(--d-line);border-radius:10px;background:var(--d-surface)}
.docs-shell .reference-table,.docs-shell .table-scroll table{width:100%;border-collapse:collapse;font-size:14px;line-height:1.7}
.docs-shell .reference-table th,.docs-shell .table-scroll th{padding:10px 14px;background:#fbf5f7;text-align:left;font-weight:600;font-size:13px;color:var(--d-muted);white-space:nowrap}
.docs-shell .reference-table td,.docs-shell .table-scroll td{padding:11px 14px;border-top:1px solid var(--d-line);vertical-align:top}
.docs-shell .reference-table td:first-child{white-space:nowrap}
.docs-shell .reference-table td:first-child code{white-space:nowrap}
.docs-shell .reference-table .http{font:600 13px var(--mono);color:var(--d-muted);white-space:nowrap}
.docs-shell .reference-table tr:target td{background:var(--d-soft)}
.docs-shell .pending{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:999px;background:var(--d-warn-soft);color:var(--d-warn);font-size:12px;font-weight:600;white-space:nowrap}
.docs-shell details.more{margin-top:18px;border:1px solid var(--d-line);border-radius:10px;background:var(--d-surface)}
.docs-shell details.more>summary{padding:12px 16px;cursor:pointer;font-weight:600}
.docs-shell details.more>*:not(summary){margin:0 16px 16px}

/* Error-code reference: one block per code instead of a wide table */
.error-list{margin:16px 0 0;border-top:1px solid var(--d-line)}
.error-item{padding:16px 2px 14px;border-bottom:1px solid var(--d-line);scroll-margin-top:24px}
.error-item:target{background:var(--d-soft);padding-inline:12px;border-radius:8px}
.error-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;margin-bottom:4px}
.docs-shell .error-head code{font:600 14px var(--mono);color:#9d2f55;background:none;padding:0}
.error-head .http{font:600 12.5px var(--mono);color:var(--d-muted)}
.error-where{font-size:13px;color:var(--d-muted)}
.docs-shell .error-item p{margin:4px 0;font-size:14.5px;line-height:1.75}
.docs-shell .error-item .error-action{color:var(--d-ink)}
.error-action b{font-weight:600}
.docs-shell details.more .error-list{margin-top:0}

/* Next links */
.docs-next{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin-top:56px}
.docs-next a{display:grid;gap:2px;padding:16px 18px;border:1px solid var(--d-line);border-radius:10px;background:var(--d-surface);color:var(--d-ink);text-decoration:none}
.docs-next a:hover{border-color:var(--d-action)}
.docs-next small{font-size:12px;color:var(--d-muted)}
.docs-next b{font-size:15px;color:var(--d-action-ink)}

/* Right-hand contents */
.docs-shell .toc{position:sticky;top:0;align-self:start;padding:40px 18px;font-size:13px}
.docs-shell .toc p{margin:0 0 10px;font:600 12px inherit;font-family:inherit;letter-spacing:.06em;color:var(--d-muted)}
.docs-shell .toc a{display:block;padding:6px 0;color:var(--d-muted);text-decoration:none}
.docs-shell .toc a:hover{color:var(--d-action-ink)}

@media(max-width:1180px){
  .docs-shell,.docs-shell:not(:has(>.toc)){grid-template-columns:232px minmax(0,1fr)}
  .docs-shell .toc{display:none}
}
@media(max-width:900px){
  .flow{grid-template-columns:repeat(2,minmax(0,1fr))}
  .flow li:nth-child(2)::after{display:none}
}
@media(max-width:760px){
  .docs-shell,.docs-shell:not(:has(>.toc)){display:block}
  .docs-shell .docs-menu-toggle{display:flex;align-items:center;justify-content:space-between;gap:12px;position:sticky;top:0;z-index:6;width:100%;padding:12px 20px;border:0;border-bottom:1px solid var(--d-line);background:var(--d-surface);font:inherit;font-size:14px;color:var(--d-ink);text-align:left;cursor:pointer}
  .docs-menu-label{font-weight:600}
  .docs-menu-label::after{content:" ▾";color:var(--d-muted)}
  .docs-shell[data-menu="open"] .docs-menu-label::after{content:" ▴"}
  .docs-menu-current{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--d-action-ink)}
  .docs-shell .doc-nav{position:static;max-height:none;padding:8px 16px 18px;border-right:0;border-bottom:1px solid var(--d-line);background:var(--d-surface)}
  .docs-shell[data-menu="closed"] .doc-nav{display:none}
  .docs-shell .doc-nav .nav-group{display:block;margin-top:10px}
  .docs-shell .doc-body{padding:24px 20px 64px}
  .docs-shell .doc-section{margin-top:40px}
  .docs-shell .doc-section h2,.docs-shell .markdown-body h2{font-size:20px}
  .flow{grid-template-columns:1fr}
  .flow li::after{display:none}
  .glossary{grid-template-columns:1fr}
  .glossary dt{padding-bottom:0;border-bottom:0}
  .glossary dd{padding-top:4px}
}
@media(prefers-reduced-motion:reduce){.docs-shell *{scroll-behavior:auto}}
