:root{
  --bg:#ffffff;
  --fg:#1a1f36;
  --fg-strong:rgb(26,44,68);
  --fg-soft:rgb(80,97,122);
  --fg-mid:#3c4257;
  --muted:#697386;
  --line:#e6ebf1;
  --line-2:#eef1f6;
  --accent:#635bff;
  --accent-2:#0a2540;
  --code-bg:#0a2540;
  --code-fg:#c7d2fe;
  --code-string:#86efac;
  --code-key:#93c5fd;
  --green:#0a7c41;
  --blue:#0969da;
  --orange:#b5681a;
  --red:#cf222e;
  --purple:#8250df;
  --pill-bg:#f6f9fc;
  --hover:#f6f9fc;
  --card-bg:#fbfcfd;
  --card-title-bg:#ffffff;
  --code-inline-bg:#f4f7fa;
  --topbar-bg:#ffffff;
  --search-bg:var(--card-bg);
  color-scheme:light;
}

[data-theme="dark"]{
  --bg:#0f1525;
  --fg:#e6e8ef;
  --fg-strong:#f2f4f8;
  --fg-soft:#a6adbe;
  --fg-mid:#c4c9d4;
  --muted:#8792a8;
  --line:#24304a;
  --line-2:#1b2538;
  --accent:#9ea0ff;
  --accent-2:#e8eaf0;
  --green:#4ec77e;
  --blue:#6aa8ff;
  --orange:#f0a868;
  --red:#ff7b7b;
  --purple:#c5a7ff;
  --pill-bg:#1a2236;
  --hover:#1a2236;
  --card-bg:#141c2e;
  --card-title-bg:#19213a;
  --code-inline-bg:#1a2236;
  --topbar-bg:#0f1525;
  --search-bg:#1a2236;
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:-apple-system,"system-ui","Segoe UI",Roboto,"Helvetica Neue",Ubuntu,sans-serif;
  color:var(--fg); background:var(--bg);
  font-size:14px; line-height:22px;
  -webkit-font-smoothing:antialiased;
}
code, .mono{
  font-family:"Source Code Pro","SF Mono",ui-monospace,Menlo,Monaco,Consolas,monospace;
  font-size:0.85em;
  font-weight:500;
}
h1,h2,h3,h4,h5{color:var(--accent-2); margin:0; letter-spacing:-0.01em; font-weight:700}
a{color:var(--accent); text-decoration:none}
a:hover{text-decoration:underline}
.mini{font-size:12px}
.muted{color:var(--muted)}
.badge{display:inline-block; padding:1px 6px; border-radius:4px; background:var(--pill-bg); color:var(--muted); font-size:11px}

/* Top bar */
.topbar{
  position:sticky; top:0; z-index:50;
  display:flex; align-items:center; gap:16px;
  padding:12px 22px; background:var(--topbar-bg); border-bottom:1px solid var(--line);
  backdrop-filter:saturate(1.6) blur(6px);
}
.topbar .brand{color:var(--accent-2); font-size:15px; font-weight:600; display:flex; align-items:center; gap:10px; text-decoration:none}
.topbar .brand:hover{text-decoration:none; opacity:0.85}
.topbar .brand-icon{display:block; flex-shrink:0}
.topbar .brand-title{color:var(--accent-2); letter-spacing:-0.01em}
.topbar .meta{color:var(--muted); font-size:12.5px}
.topbar .search{margin-left:auto; width:260px; padding:7px 12px; border:1px solid var(--line); border-radius:8px; font-size:13px; background:var(--search-bg); outline:none}
.topbar .search:focus{border-color:var(--accent)}
.topbar .built-with{font-size:12px; color:var(--muted)}
.topbar .built-with a{color:var(--accent); text-decoration:none; font-weight:500}

.theme-toggle{
  display:inline-flex; align-items:center; justify-content:center;
  width:32px; height:32px; padding:0;
  background:transparent; border:1px solid var(--line); border-radius:8px;
  color:var(--muted); cursor:pointer;
  transition:background .12s ease, color .12s ease, border-color .12s ease;
}
.theme-toggle:hover{background:var(--pill-bg); color:var(--accent-2); border-color:var(--fg-soft)}
.theme-toggle .icon-sun{display:none}
.theme-toggle .icon-moon{display:block}
[data-theme="dark"] .theme-toggle .icon-sun{display:block}
[data-theme="dark"] .theme-toggle .icon-moon{display:none}

/* Layout */
.layout{display:grid; grid-template-columns:280px minmax(0, 1fr); width:100%; margin:0}
.sidebar{
  border-right:1px solid var(--line);
  padding:16px 16px 80px 16px; position:sticky; top:49px;
  align-self:start; max-height:calc(100vh - 49px); overflow:auto;
  color:var(--fg-soft);
}
.nav-root{list-style:none; margin:0; padding:0}
.nav-root .group{margin:2px 0}
.nav-root .group-row{
  display:flex; align-items:center; gap:4px;
  padding:0 4px;
  border-radius:4px;
  transition:background .12s ease;
}
.nav-root .group.collapsible > .group-row:hover{background:var(--hover)}
.nav-root .group.collapsible > .group-row:hover .group-title{text-decoration:none}
.nav-root a{text-decoration:none}
.nav-root a:hover{text-decoration:none}
.nav-root .group-title{
  display:block; color:var(--fg-strong); font-weight:600;
  padding:4px 8px; font-size:14px; line-height:20px; border-radius:4px;
  flex:1; min-width:0;
  text-transform:capitalize;
}
.nav-root .group:not(.collapsible) > .group-row > .group-title:hover{background:var(--hover); text-decoration:none}
.nav-root .g2{margin-top:2px}
.nav-root .g2:first-child{margin-top:0}
.nav-root .group-children:empty{display:none}
.nav-root .g2 > .group-row > .group-title{font-size:12px; letter-spacing:0.06em; text-transform:uppercase; color:var(--muted); font-weight:700}
.nav-root .g3 > .group-row > .group-title{font-size:14px; color:var(--fg-strong); font-weight:600}
.nav-root .g4 > .group-row > .group-title{font-size:14px; color:var(--fg-soft); font-weight:500; padding-left:28px}
.nav-root .g5 > .group-row > .group-title{font-size:13px; color:var(--fg-soft); font-weight:500; padding-left:44px}
.nav-root .g6 > .group-row > .group-title{font-size:13px; color:var(--fg-soft); font-weight:500; padding-left:60px}

/* Collapsible toggle */
.nav-root .group-toggle{
  flex-shrink:0;
  display:inline-flex; align-items:center; justify-content:center;
  width:20px; height:20px; padding:0;
  background:transparent; border:0; color:var(--muted);
  border-radius:4px; cursor:pointer;
  transition:transform .15s ease, background .12s ease;
}
.nav-root .group-toggle:hover{color:var(--fg)}
.nav-root .group-toggle svg{transition:transform .18s ease}
.nav-root .group.collapsed > .group-row > .group-toggle svg{transform:rotate(-90deg)}
.nav-root .group.collapsed > .group-children{display:none}
.nav-root .group-children{list-style:none; margin:0; padding:0}
.nav-root .ep a{
  display:flex; align-items:center; gap:8px;
  padding:5px 10px 5px 16px;
  color:var(--fg); font-size:13px; border-radius:6px; line-height:1.3;
}
.nav-root .g2 .ep a{padding-left:20px}
.nav-root .g3 .ep a{padding-left:28px}
.nav-root .g4 .ep a{padding-left:44px}
.nav-root .g5 .ep a{padding-left:56px}
.nav-root .g6 .ep a{padding-left:68px}
.nav-root .ep a:hover{background:var(--hover); text-decoration:none}
.nav-root .ep a.active{background:var(--hover); color:var(--accent-2)}
.nav-root .method{
  font-family:"Source Code Pro",ui-monospace,Menlo,monospace; font-size:10px;
  min-width:48px; text-align:left; font-weight:700;
  padding:2px 0; border-radius:3px;
  flex-shrink:0;
}
.method.m-get{color:var(--green)}
.method.m-post{color:var(--blue)}
.method.m-put{color:var(--orange)}
.method.m-patch{color:var(--purple)}
.method.m-delete{color:var(--red)}

/* Content */
.content{padding:28px 44px 120px 44px; min-width:0}
.content > article > h1{font-size:24px; line-height:32px; font-weight:700; margin:0 0 10px 0}
.content > article > h2{font-size:21px; line-height:28px; font-weight:700; border-top:1px solid var(--line); padding-top:44px; margin:56px 0 16px 0}
.content > article > h3{font-size:16px; line-height:24px; font-weight:600; margin:36px 0 12px 0; color:var(--accent-2)}
.content > article > h4{font-size:16px; line-height:22px; font-weight:600; margin:28px 0 10px 0; color:var(--accent-2)}
.content > article > h5{font-size:14px; line-height:20px; font-weight:600; margin:24px 0 8px 0; color:var(--accent-2)}
.content > article > h6{font-size:13px; line-height:18px; font-weight:600; margin:20px 0 6px 0; color:var(--accent-2); text-transform:uppercase; letter-spacing:0.04em}
.content p{margin:14px 0 0 0}
.content > article > p:first-child{margin-top:0}
.content > article > h1 + p,
.content > article > h2 + p,
.content > article > h3 + p,
.content > article > h4 + p{margin-top:10px}
.content > article > ul, .content > article > ol{margin:14px 0 0 0; padding-left:22px}
.content > article > ul li, .content > article > ol li{margin-top:4px}
.content > article > ul li p, .content > article > ol li p{margin:0}

/* Intro */
.intro-box{color:var(--muted); font-size:14px; margin:6px 0 22px 0}
.intro-box code{background:var(--pill-bg); padding:1px 6px; border-radius:4px; color:var(--accent-2)}

/* Callout */
.callout{
  background:var(--card-bg); border:1px solid var(--line); border-left:3px solid var(--accent);
  border-radius:8px; padding:14px 18px; margin:18px 0;
}
.callout-title{font-weight:600; color:var(--accent-2); margin-bottom:6px}
.callout-body p{margin:6px 0}
.callout-body table{border-collapse:collapse; font-size:13px; margin:8px 0}
.callout-body th, .callout-body td{border:1px solid var(--line); padding:6px 10px; text-align:left}
.callout-body th{background:var(--pill-bg)}

.folder-desc{color:var(--fg); margin:12px 0 24px 0; font-size:14px; line-height:22px}
.folder-desc h3{font-size:16px; font-weight:700; color:var(--accent-2); margin:20px 0 8px 0}
.folder-desc h4{font-size:14px; font-weight:700; color:var(--accent-2); margin:16px 0 6px 0}
.folder-desc h5, .folder-desc h6{font-size:13px; font-weight:700; color:var(--accent-2); margin:14px 0 4px 0; text-transform:uppercase; letter-spacing:0.04em}
.folder-desc p{margin:10px 0 0 0}
.folder-desc p:first-child{margin-top:0}
.folder-desc code{background:var(--code-inline-bg); padding:2px 4px; border-radius:6px; color:var(--fg-strong); font-size:0.85em}
.folder-desc a{color:var(--accent)}
.folder-desc table{
  width:100%; border-collapse:collapse; margin:14px 0;
  font-size:14px; line-height:20px;
}
.folder-desc table th, .folder-desc table td{
  border-bottom:1px solid var(--line-2);
  padding:12px; vertical-align:top; text-align:left;
}
.folder-desc table th{
  background:var(--pill-bg); color:var(--accent-2);
  font-weight:600; font-size:12px;
  text-transform:uppercase; letter-spacing:0.05em; padding:10px 12px;
}
.folder-desc table td:first-child{font-weight:600; white-space:nowrap; color:var(--fg-strong)}
.folder-desc table code{background:var(--code-inline-bg); padding:2px 4px; border-radius:6px; font-size:0.85em}
.folder-desc ul, .folder-desc ol{margin:10px 0 0 0; padding-left:22px}
.folder-desc li{margin-top:4px}

/* Consecutive headings (no content between) — tighten spacing */
.content > article > h2 + h3{margin-top:20px}
.content > article > h3 + h4{margin-top:16px}
.content > article > h4 + h5{margin-top:12px}
.content > article > h5 + h6{margin-top:10px}

/* Stripe-style summary card */
.summary{
  margin:24px 0;
  border:1px solid var(--line);
  border-radius:8px;
  background:var(--card-bg);
  overflow:hidden;
}
.summary-title{
  padding:14px 20px;
  font-size:12px;
  font-weight:700;
  letter-spacing:0.06em;
  text-transform:uppercase;
  color:var(--accent-2);
  border-bottom:1px solid var(--line);
  background:var(--card-title-bg);
}
.summary-body{padding:4px 0}
.summary-body table{
  width:100%;
  border-collapse:collapse;
  background:transparent;
  margin:0;
  font-size:14px;
  line-height:22px;
}
.summary-body thead{display:none}
.summary-body td{
  padding:12px;
  vertical-align:top;
  border:0;
}
.summary-body tbody tr + tr td{border-top:1px solid var(--line)}
.summary-body td:first-child{
  font-weight:700;
  white-space:nowrap;
  width:14%;
  color:var(--accent-2);
}
.summary-body td:nth-child(2){
  width:30%;
  color:var(--fg);
}
.summary-body td code{
  background:transparent;
  padding:0;
  color:inherit;
  font-weight:inherit;
  font-size:13px;
}

/* Sidebar: plain anchor items (no method pill) */
.nav-root .ep-anchor a{padding-left:20px}
.nav-root .g2 .ep-anchor a{padding-left:24px}
.nav-root .g3 .ep-anchor a{padding-left:32px}

/* Endpoint grid */
.endpoint{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,520px); gap:40px;
  margin:32px 0 46px 0;
}
.ep-main{min-width:0}
.ep-side{min-width:0}
.ep-head{margin-bottom:10px}
.ep-title{font-size:21px; font-weight:700; color:var(--accent-2); margin:0 0 8px 0}
.ep-url{
  display:flex; align-items:baseline; gap:10px; flex-wrap:wrap;
  padding:10px 12px; background:var(--pill-bg); border-radius:6px; font-size:14px;
}
.ep-url .path{color:var(--accent-2); word-break:break-all}
.method{font-weight:700; font-family:"Source Code Pro",ui-monospace,Menlo,monospace; font-size:11px; letter-spacing:0.03em}
.ep-body > p:first-child{margin-top:14px}
.ep-body p{margin:14px 0 0 0; color:var(--fg-mid)}
.ep-body table.params-table{border-collapse:collapse; margin:14px 0; font-size:14px; line-height:20px; width:100%}
.ep-body table.params-table th, .ep-body table.params-table td{
  border-bottom:1px solid var(--line-2); padding:12px; text-align:left; vertical-align:top;
}
.ep-body table.params-table th{background:var(--pill-bg); color:var(--accent-2); font-weight:600; font-size:12px; text-transform:uppercase; letter-spacing:0.05em; padding:10px 12px}
.ep-body table.params-table td:first-child{font-weight:700}
.ep-body table.params-table code{background:var(--code-inline-bg); padding:2px 4px; border-radius:6px; color:var(--fg-strong); font-size:0.85em; font-weight:500}
.ep-body .mini{display:block; color:var(--muted); font-size:12px; margin-top:2px; font-weight:400}

/* Params blocks */
.params-block{margin:18px 0}
.params-title{font-weight:600; font-size:12px; color:var(--accent-2); margin-bottom:8px; text-transform:uppercase; letter-spacing:0.05em}

/* ---------- Code frame (Stripe-style) ---------- */
.code-frame{
  --frame-bg:#f6f9fc;
  --frame-fg:#2a2f45;
  --frame-chrome:#eef1f6;
  --frame-gutter:#b4bbc8;
  --frame-border:var(--line);
  --pill-bg:#e5e9f1;
  --pill-hover:#d9dee7;
  --pill-fg:#3c4257;
  margin:10px 0;
  background:var(--frame-bg);
  border:1px solid var(--frame-border);
  border-radius:10px;
  overflow:hidden;
  position:relative;
  font-family:"SF Mono",ui-monospace,Menlo,Monaco,Consolas,monospace;
}
.code-frame.dark{
  --frame-bg:#3c4049;
  --frame-fg:#e8e5db;
  --frame-chrome:#383b43;
  --frame-gutter:#8b8f97;
  --frame-border:transparent;
  --pill-bg:#555961;
  --pill-hover:#666a73;
  --pill-fg:#e8e5db;
}
/* In dark theme, the rare light code frame should still read against the page */
[data-theme="dark"] .code-frame:not(.dark){
  --frame-bg:#17203a;
  --frame-fg:#d8dce7;
  --frame-gutter:#4e5a78;
  --frame-border:var(--line);
  --pill-bg:#2a3450;
  --pill-hover:#38426a;
  --pill-fg:#d8dce7;
}
.code-chrome{
  display:flex; align-items:center; justify-content:flex-end; gap:6px;
  padding:8px 10px 0 10px;
  background:transparent;
}
.code-lang, .code-copy{
  display:inline-flex; align-items:center; justify-content:center;
  height:26px; padding:0;
  background:var(--pill-bg); color:var(--pill-fg);
  border:0; border-radius:6px; cursor:pointer;
  font:500 11.5px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  letter-spacing:0.01em;
  transition:background .12s ease;
}
.code-lang{padding:0 10px}
.code-copy{width:26px}
.code-lang:hover, .code-copy:hover{background:var(--pill-hover)}
.code-copy:hover{background:var(--pill-hover)}
.code-copy.copied{background:#0a7c41; color:#fff}
.code-copy.copied .icon-copy{display:none}
.code-copy.copied .icon-check{display:block !important}

pre.code{
  margin:0; padding:8px 16px 14px;
  background:transparent; color:var(--frame-fg);
  overflow:auto;
  font-size:14px; line-height:18.2px;
  font-family:inherit;
  counter-reset:line;
}
pre.code code{background:transparent; padding:0; color:inherit; font-family:inherit; font-size:inherit; font-weight:400}
pre.code .ln{
  display:block;
  padding-left:40px;
  position:relative;
  white-space:pre;
}
pre.code .ln::before{
  counter-increment:line;
  content:counter(line);
  position:absolute; left:0; top:0;
  width:28px; text-align:right;
  color:var(--frame-gutter);
  font-variant-numeric:tabular-nums;
  user-select:none;
  opacity:0.85;
}

/* Token colours */
.code-frame.dark .tok-flag  { color:#b5d3ff }
.code-frame.dark .tok-str   { color:#ff8a80 }
.code-frame.dark .tok-key   { color:#9cdcfe }
.code-frame.dark .tok-num   { color:#f3c875 }
.code-frame.dark .tok-bool  { color:#c8a8ff }
.code-frame.dark .tok-dim   { color:#8b8f97 }
.code-frame:not(.dark) .tok-flag  { color:#0969da }
.code-frame:not(.dark) .tok-str   { color:#cf222e }
.code-frame:not(.dark) .tok-key   { color:#0550ae }
.code-frame:not(.dark) .tok-num   { color:#953800 }
.code-frame:not(.dark) .tok-bool  { color:#8250df }
.code-frame:not(.dark) .tok-dim   { color:#8a8f98 }

/* Chip-style highlight for <PLACEHOLDERS> */
.tok-chip{
  background:rgba(0,0,0,0.22);
  padding:0 5px; border-radius:4px;
  color:inherit;
}
.code-frame:not(.dark) .tok-chip{
  background:#e0e6ef; color:#2a2f45;
}

/* Hidden textarea with raw code for clipboard */
.code-raw{
  position:absolute; left:-9999px; top:-9999px;
  width:1px; height:1px; opacity:0; pointer-events:none;
}

/* Right column: cURL + Request body + Responses stacked */
.ep-side{min-width:0}
.ep-side .params-block{margin:0 0 18px 0}
.ep-side .params-block:last-child{margin-bottom:0}
.ep-side .params-title{margin-bottom:10px}
.code-col{margin:0 0 18px 0}
.ep-side > aside.code-col:last-child{margin-bottom:0}
.code-col .code-frame{margin-top:0}
.ep-side .resp-panel pre.code{max-height:480px}

/* Responses */
.resp-tabs{display:flex; flex-wrap:wrap; gap:6px; margin-bottom:8px}
.resp-tab{
  border:1px solid var(--line); background:var(--card-bg); cursor:pointer;
  padding:5px 10px; border-radius:6px; font-family:inherit; font-size:12px; color:var(--fg);
}
.resp-tab:hover{background:var(--pill-bg)}
.resp-tab.active{border-color:var(--st)}
.resp-dot{display:inline-block; width:8px; height:8px; min-width:8px; border-radius:50%; margin-right:6px; vertical-align:-1px; flex-shrink:0; box-sizing:border-box}
.resp-panel{display:none}
.resp-panel.active{display:block}
.resp-panel pre.code{max-height:520px}

/* Responsive */
@media (max-width:1200px){
  .endpoint{grid-template-columns:1fr}
  .code-col{position:static}
}
@media (max-width:860px){
  .layout{grid-template-columns:1fr}
  .sidebar{display:none}
  .content{padding:20px}
}

html{scroll-behavior:auto}
.nav-root .group.collapsible > .group-row{cursor:pointer; user-select:none}
section[id]{scroll-margin-top:70px}
h1[id],h2[id],h3[id],h4[id]{scroll-margin-top:70px}