/* The public API reference (/docs on every shop's address).

   The storefront's own look: the same tokens, neutral dark by default with the
   light theme one click away (shared "theme" choice with the shop), crisp 1px
   borders, one blue accent, no gradients. */

:root,:root[data-theme="dark"]{
  --bg:#050506; --bg-soft:#0a0a0c; --surface:#0c0c0e; --surface-2:#131316; --surface-3:#1a1a1e;
  --line:#1f1f23; --line-2:#2a2a2f; --line-3:#3a3a41;
  --text:#f5f5f7; --text-2:#a8a8b0; --text-3:#6f6f78;
  --accent:#1a73ff; --accent-2:#3b87ff; --accent-soft:rgba(26,115,255,.12); --accent-line:rgba(26,115,255,.4);
  --code-bg:#09090b; --code-text:#d6d6dc;
  --tk-key:#7cb4ff; --tk-str:#9fd49a; --tk-num:#f0b86e; --tk-lit:#d7a6ff; --tk-com:#62626c; --tk-var:#f0b86e; --tk-flag:#7cb4ff;
  --get:#2fbf71; --get-soft:rgba(47,191,113,.12); --post:#3b87ff; --post-soft:rgba(59,135,255,.14);
  --put:#f0a73a; --put-soft:rgba(240,167,58,.13); --del:#f05d5d; --del-soft:rgba(240,93,93,.12);
  --shadow:0 1px 2px rgba(0,0,0,.4); --pop:0 24px 60px -24px rgba(0,0,0,.8),0 0 0 1px var(--line-2);
  --ring:0 0 0 3px rgba(26,115,255,.35);
  color-scheme:dark;
}
:root[data-theme="light"]{
  --bg:#f4f5f7; --bg-soft:#eceef1; --surface:#ffffff; --surface-2:#f5f6f8; --surface-3:#eceef2;
  --line:#e2e5ea; --line-2:#d3d8df; --line-3:#b9c0ca;
  --text:#0c0f14; --text-2:#4a5260; --text-3:#818a97;
  --accent:#0b63e5; --accent-2:#0a56c7; --accent-soft:rgba(11,99,229,.08); --accent-line:rgba(11,99,229,.35);
  --code-bg:#f7f8fa; --code-text:#1c2330;
  --tk-key:#0b57c9; --tk-str:#16803c; --tk-num:#b45309; --tk-lit:#7c3aed; --tk-com:#8a93a0; --tk-var:#b45309; --tk-flag:#0b57c9;
  --get:#15803d; --get-soft:rgba(21,128,61,.09); --post:#0b63e5; --post-soft:rgba(11,99,229,.09);
  --put:#b45309; --put-soft:rgba(217,119,6,.1); --del:#c62828; --del-soft:rgba(198,40,40,.08);
  --shadow:0 1px 2px rgba(16,20,28,.06); --pop:0 24px 60px -22px rgba(16,20,28,.28),0 0 0 1px var(--line-2);
  --ring:0 0 0 3px rgba(11,99,229,.25);
  color-scheme:light;
}
:root{
  --r-sm:8px; --r:12px; --r-lg:16px; --top:64px; --side:272px;
  --sans:ui-sans-serif,system-ui,-apple-system,"Segoe UI Variable Display","Segoe UI",Inter,Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,"Cascadia Mono","SF Mono",Consolas,"Roboto Mono",monospace;
}

*,*::before,*::after{box-sizing:border-box}
*{margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;background:var(--bg)}
body{background:var(--bg);color:var(--text);font:15px/1.6 var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit;text-decoration:none}
img,svg{display:block}
button,input{font:inherit;color:inherit}
button{cursor:pointer}
[hidden]{display:none !important}
:focus{outline:none}
:focus-visible{box-shadow:var(--ring);border-radius:var(--r-sm)}
::selection{background:rgba(26,115,255,.28)}
.i{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.if-light{display:none !important}
:root[data-theme="light"] .if-light{display:block !important}
:root[data-theme="light"] .if-dark{display:none !important}

/* ── buttons ─────────────────────────────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:38px;padding:0 15px;border-radius:999px;
  border:1px solid var(--line-2);background:var(--surface-2);color:var(--text);font:650 13.5px/1 var(--sans);white-space:nowrap;
  transition:background .15s,border-color .15s,color .15s}
.btn:hover{border-color:var(--line-3);background:var(--surface-3)}
.btn .i{width:15px;height:15px}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.btn.primary:hover{background:var(--accent-2);border-color:var(--accent-2)}
.btn.ghost{background:transparent}
.icon-btn{width:38px;height:38px;border-radius:999px;display:grid;place-items:center;flex:none;border:1px solid var(--line-2);
  background:var(--surface-2);color:var(--text-2);transition:color .15s,border-color .15s,background .15s}
.icon-btn:hover{color:var(--text);border-color:var(--line-3)}
.icon-btn .i{width:17px;height:17px}

/* ── top bar ─────────────────────────────────────────────────────────────── */
.top{position:sticky;top:0;z-index:40;height:var(--top);border-bottom:1px solid var(--line);
  background:var(--bg);background:color-mix(in srgb,var(--bg) 86%,transparent);
  -webkit-backdrop-filter:saturate(1.4) blur(12px);backdrop-filter:saturate(1.4) blur(12px)}
.top-in{display:flex;align-items:center;gap:12px;height:100%;max-width:1360px;margin:0 auto;padding:0 20px}
.brand{display:flex;align-items:center;gap:10px;min-width:0;flex:none}
.mark{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;flex:none;overflow:hidden;
  font:850 16px var(--sans);background:var(--text);color:var(--bg)}
.mark.has-img{background:var(--surface-2);border:1px solid var(--line-2)}
.mark img{width:100%;height:100%;object-fit:cover}
.brand .name{font:780 17px var(--sans);letter-spacing:-.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:220px}
.brand .tag{font:700 11px var(--mono);letter-spacing:.04em;padding:3px 8px;border-radius:999px;color:var(--accent);
  background:var(--accent-soft);border:1px solid var(--accent-line)}
.search{position:relative;flex:1;max-width:420px;margin:0 auto;display:flex;align-items:center}
.search .i{position:absolute;left:14px;color:var(--text-3);pointer-events:none}
.search input{width:100%;height:40px;padding:0 44px 0 40px;border-radius:999px;border:1px solid var(--line-2);background:var(--surface-2);
  font-size:14px;transition:border-color .15s,box-shadow .15s}
.search input::placeholder{color:var(--text-3)}
.search input:focus{border-color:var(--accent);box-shadow:var(--ring)}
.search input::-webkit-search-cancel-button{display:none}
.search kbd{position:absolute;right:10px;font:600 11px var(--mono);color:var(--text-3);border:1px solid var(--line-2);
  border-radius:6px;padding:1px 7px;background:var(--bg)}
.top-a{display:flex;align-items:center;gap:8px;flex:none}
.menu-btn{display:none}

/* ── layout ──────────────────────────────────────────────────────────────── */
.layout{display:grid;grid-template-columns:var(--side) minmax(0,1fr);max-width:1360px;margin:0 auto}
.side{position:sticky;top:var(--top);height:calc(100vh - var(--top));overflow-y:auto;border-right:1px solid var(--line);
  scrollbar-width:thin;scrollbar-color:var(--line-2) transparent}
.side-in{padding:22px 14px 60px}
.grp + .grp{margin-top:18px}
.grp-t{display:block;padding:5px 10px;border-radius:8px;font:700 13px var(--sans);color:var(--text)}
.grp-t:hover{background:var(--surface-2)}
.grp-t.on{color:var(--accent)}
.grp ul{list-style:none;margin-top:2px}
.grp li a{display:flex;align-items:center;gap:9px;padding:5px 10px;border-radius:8px;color:var(--text-2);font:560 13px/1.35 var(--sans);
  transition:background .12s,color .12s}
.grp li a:hover{background:var(--surface-2);color:var(--text)}
.grp li a.on{background:var(--accent-soft);color:var(--text)}
.grp li a.ep .t{font:600 12px var(--mono);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.m{flex:none;min-width:44px;text-align:center;font:750 9.5px/1 var(--mono);letter-spacing:.03em;padding:4px 0;border-radius:6px}
.m-get{color:var(--get);background:var(--get-soft)}
.m-post{color:var(--post);background:var(--post-soft)}
.m-put,.m-patch{color:var(--put);background:var(--put-soft)}
.m-delete{color:var(--del);background:var(--del-soft)}
.side .none{padding:10px;color:var(--text-3);font-size:13px}
.side-cta{display:none}
.scrim{display:none}

/* ── the page ────────────────────────────────────────────────────────────── */
.main{min-width:0;padding:44px 56px 80px}
.hero,.doc,.foot{max-width:820px}
.eyebrow{font:700 12px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--text-3)}
.hero h1{font:800 clamp(30px,4.2vw,44px)/1.08 var(--sans);letter-spacing:-.035em;margin:10px 0 12px}
.lead{color:var(--text-2);font-size:17px;line-height:1.65;max-width:62ch}
.base-card{margin-top:24px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--shadow);overflow:hidden}
.bc-row{display:flex;align-items:center;gap:14px;padding:12px 12px 12px 18px;min-width:0}
.bc-row + .bc-row{border-top:1px solid var(--line)}
.bc-l{flex:none;width:72px;font:650 12.5px var(--sans);color:var(--text-3)}
.bc-v{flex:1;min-width:0;font:600 14px var(--mono);color:var(--text);overflow-x:auto;white-space:nowrap;scrollbar-width:none}
.bc-v::-webkit-scrollbar{display:none}
.copy-btn{width:34px;height:34px;flex:none;border-radius:9px;display:grid;place-items:center;border:1px solid var(--line-2);
  background:var(--surface-2);color:var(--text-3);transition:color .15s,border-color .15s}
.copy-btn:hover{color:var(--text);border-color:var(--line-3)}
.copy-btn .i{width:15px;height:15px}
.copy-btn.done{color:var(--get);border-color:var(--get)}
.quick{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:14px}
.qcard{display:flex;flex-direction:column;gap:2px;padding:14px;border-radius:var(--r);border:1px solid var(--line);background:var(--surface);
  transition:border-color .15s,background .15s}
.qcard:hover{border-color:var(--line-3);background:var(--surface-2)}
.qcard .i{color:var(--accent);width:18px;height:18px;margin-bottom:8px}
.qcard b{font:700 14px var(--sans)}
.qcard span{color:var(--text-3);font-size:12.5px;line-height:1.45}

/* rendered API.md */
.doc{margin-top:8px}
.doc h1{display:none}
.doc h2{font:780 24px/1.25 var(--sans);letter-spacing:-.025em;margin:56px 0 14px;padding-top:30px;border-top:1px solid var(--line);scroll-margin-top:calc(var(--top) + 12px)}
.doc h3{font:700 17px var(--sans);letter-spacing:-.01em;margin:30px 0 10px;scroll-margin-top:calc(var(--top) + 12px)}
.doc p{color:var(--text-2);line-height:1.75;margin:0 0 14px;font-size:15px}
.doc ul,.doc ol{margin:0 0 16px;padding-left:22px;color:var(--text-2)}
.doc li{line-height:1.7;margin:4px 0;padding-left:4px}
.doc li::marker{color:var(--text-3)}
.doc a{color:var(--accent);font-weight:560}
.doc a:hover{text-decoration:underline;text-underline-offset:3px}
.doc strong{color:var(--text);font-weight:680}
.doc code{font:600 .86em var(--mono);padding:2px 6px;border-radius:6px;background:var(--surface-2);border:1px solid var(--line);color:var(--text);
  overflow-wrap:anywhere}

.endpoint{margin:22px 0;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--shadow);
  scroll-margin-top:calc(var(--top) + 12px)}
.ep-h{display:flex;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid var(--line);min-width:0}
.verb{flex:none;font:780 11px/1 var(--mono);letter-spacing:.04em;padding:6px 9px;border-radius:7px}
.v-get{color:var(--get);background:var(--get-soft)}
.v-post{color:var(--post);background:var(--post-soft)}
.v-put,.v-patch{color:var(--put);background:var(--put-soft)}
.v-delete{color:var(--del);background:var(--del-soft)}
.doc .epath{background:none;border:0;padding:0;font:650 15px var(--mono);color:var(--text);overflow-wrap:anywhere}
.ep-link{margin-left:auto;flex:none;width:28px;height:28px;border-radius:7px;display:grid;place-items:center;color:var(--text-3);
  font:700 14px var(--mono);opacity:0;transition:opacity .15s,background .15s,color .15s}
.endpoint:hover .ep-link,.ep-link:focus-visible{opacity:1}
.ep-link:hover{background:var(--surface-2);color:var(--text);text-decoration:none !important}
.ep-b{padding:16px 16px 4px}
.ep-b > p:first-child{color:var(--text);font-size:15px}

.note{display:flex;gap:12px;margin:0 0 16px;padding:13px 16px;border-radius:var(--r);border:1px solid var(--accent-line);background:var(--accent-soft)}
.note::before{content:"";flex:none;width:3px;border-radius:3px;background:var(--accent)}
.note p{margin:0;color:var(--text)}

/* code blocks (docs.js adds the label, copy button and colours) */
.cblock{position:relative;margin:0 0 16px;border:1px solid var(--line);border-radius:var(--r);background:var(--code-bg);overflow:hidden}
.cb-h{display:flex;align-items:center;justify-content:space-between;gap:10px;height:38px;padding:0 6px 0 14px;border-bottom:1px solid var(--line);
  background:var(--surface-2)}
.cb-lang{font:700 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--text-3)}
.cb-h .copy-btn{width:30px;height:28px;border-radius:7px;background:transparent;border-color:transparent}
.cb-h .copy-btn:hover{background:var(--surface-3)}
.doc pre.code{margin:0;padding:14px 16px;overflow-x:auto;scrollbar-width:thin;scrollbar-color:var(--line-2) transparent}
.doc pre.code code{display:block;background:none;border:0;padding:0;font:500 13px/1.75 var(--mono);color:var(--code-text);white-space:pre;
  overflow-wrap:normal}
.tk-key{color:var(--tk-key)} .tk-str{color:var(--tk-str)} .tk-num{color:var(--tk-num)} .tk-lit{color:var(--tk-lit)}
.tk-com{color:var(--tk-com);font-style:italic} .tk-var{color:var(--tk-var)} .tk-flag{color:var(--tk-flag)} .tk-pun{color:var(--text-3)}
.tk-cmd{color:var(--text);font-weight:700}

/* tables */
.tablewrap{margin:0 0 18px;border:1px solid var(--line);border-radius:var(--r);overflow-x:auto;background:var(--surface)}
.doc table{width:100%;border-collapse:collapse;font-size:14px;min-width:460px}
.doc th{text-align:left;font:650 12.5px var(--sans);color:var(--text-3);padding:11px 14px;background:var(--surface-2);border-bottom:1px solid var(--line);white-space:nowrap}
.doc td{padding:11px 14px;border-top:1px solid var(--line);color:var(--text-2);vertical-align:top}
.doc tbody tr:first-child td{border-top:0}
.doc tbody tr:hover td{background:var(--surface-2)}
.doc td code{white-space:nowrap}

.foot{margin-top:64px;padding-top:22px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px;
  flex-wrap:wrap;color:var(--text-3);font-size:13.5px}
.foot a{color:var(--text-2);font-weight:600}
.foot a:hover{color:var(--text)}
.to-top{display:inline-flex;align-items:center;gap:6px}

/* ── narrower screens ────────────────────────────────────────────────────── */
@media (max-width:1100px){ .main{padding:36px 36px 72px} .quick{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:960px){
  .layout{grid-template-columns:minmax(0,1fr)}
  .menu-btn{display:grid}
  .side{position:fixed;top:0;left:0;bottom:0;z-index:60;width:min(86vw,320px);height:100%;background:var(--surface);
    border-right:1px solid var(--line-2);transform:translateX(-102%);transition:transform .24s cubic-bezier(.3,.7,.2,1)}
  .menu-open .side{transform:none;box-shadow:0 0 60px rgba(0,0,0,.45)}
  .scrim{display:block;position:fixed;inset:0;z-index:55;background:rgba(0,0,0,.5);opacity:0;pointer-events:none;transition:opacity .2s}
  .menu-open .scrim{opacity:1;pointer-events:auto}
  .hide-s{display:none}
  .side-cta{display:grid;gap:8px;padding:2px 0 18px;margin-bottom:16px;border-bottom:1px solid var(--line)}
  .side-cta .btn{width:100%}
  .search{max-width:none}
  .main{padding:28px 20px 64px}
}
@media (max-width:620px){
  .top-in{padding:0 12px;gap:8px}
  .brand .name{display:none}
  .search kbd{display:none}
  .search input{padding-right:14px}
  .quick{grid-template-columns:minmax(0,1fr)}
  .bc-row{padding-left:14px}
  .bc-l{width:auto}
  .lead{font-size:16px}
  .ep-h{padding:12px 14px;gap:10px}
  .ep-b{padding:14px 14px 2px}
  .ep-link{opacity:1}
}
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} *{transition:none !important} }
