/* unPLUG Loyalty API docs. One stylesheet, no build step. */

/* Colors follow the unPLUG design system (Vercel Geist greys): ink for emphasis and the
   current item, blue only for links and information, status colors only where they carry meaning. */
:root {
  --bg: #ffffff;
  --bg-soft: #fafafa;
  --bg-sunk: #f2f2f2;
  --border: #ebebeb;
  --border-strong: #c9c9c9;
  --text: #171717;
  --text-soft: #4d4d4d;
  --text-faint: #6f6f6f;
  --accent: #171717;
  --accent-soft: #f2f2f2;
  --link: #0068d6;
  --info-soft: #f0f7ff;
  --warn: #a35200;
  --warn-soft: #fff6e6;
  --soon: #7820bc;
  --soon-soft: #f9f0ff;
  --get: #0068d6;    --get-bg: #f0f7ff;
  --post: #297a3a;   --post-bg: #effbef;
  --patch: #a35200;  --patch-bg: #fff6e6;
  --put: #a35200;    --put-bg: #fff6e6;
  --delete: #cb2a2f; --delete-bg: #fff0f0;
  --ink: #0a0a0a;
  --ink-head: #171717;
  --ink-border: #2e2e2e;
  --ink-text: #ededed;
  --ink-faint: #a1a1a1;
  --radius: 8px;
  --sidebar: 280px;
  --toc: 220px;
  --top: 60px;
  --font: Geist, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Roboto, "Helvetica Neue", Arial, sans-serif;
  --mono: "Geist Mono", ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0a0a0a; --bg-soft: #111111; --bg-sunk: #1a1a1a; --border: #2e2e2e; --border-strong: #454545;
    --text: #ededed; --text-soft: #a1a1a1; --text-faint: #8f8f8f;
    --accent: #ededed; --accent-soft: #1f1f1f; --link: #52a8ff; --info-soft: #0f1c2e;
    --warn: #f2a20d; --warn-soft: #291800; --soon: #bf7af0; --soon-soft: #231528;
    --get: #52a8ff; --get-bg: #0f1c2e; --post: #62c073; --post-bg: #0b2212;
    --patch: #f2a20d; --patch-bg: #291800; --put: #f2a20d; --put-bg: #291800;
    --delete: #ff6166; --delete-bg: #2a1314;
    --ink: #000000; --ink-head: #111111; --ink-border: #2e2e2e;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #0a0a0a; --bg-soft: #111111; --bg-sunk: #1a1a1a; --border: #2e2e2e; --border-strong: #454545;
  --text: #ededed; --text-soft: #a1a1a1; --text-faint: #8f8f8f;
  --accent: #ededed; --accent-soft: #1f1f1f; --link: #52a8ff; --info-soft: #0f1c2e;
  --warn: #f2a20d; --warn-soft: #291800; --soon: #bf7af0; --soon-soft: #231528;
  --get: #52a8ff; --get-bg: #0f1c2e; --post: #62c073; --post-bg: #0b2212;
  --patch: #f2a20d; --patch-bg: #291800; --put: #f2a20d; --put-bg: #291800;
  --delete: #ff6166; --delete-bg: #2a1314;
  --ink: #000000; --ink-head: #111111; --ink-border: #2e2e2e;
  color-scheme: dark;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--top) + 20px); }
body { margin: 0; background: var(--bg); color: var(--text); font: 16px/1.65 var(--font); }
a { color: var(--link); text-decoration: none; }
a:hover { text-decoration: underline; }
.skip { position: absolute; left: -999px; }
.skip:focus { left: 16px; top: 8px; z-index: 50; background: var(--bg); padding: 8px 12px; border-radius: var(--radius); }
.muted { color: var(--text-faint); }
.icon { flex: none; }

/* Top bar */
.topbar {
  position: sticky; top: 0; z-index: 20; height: var(--top);
  display: flex; align-items: center; gap: 20px; padding: 0 20px;
  background: var(--bg); border-bottom: 1px solid var(--border);
}
.brand { display: flex; align-items: baseline; gap: 8px; color: var(--text); white-space: nowrap; }
.brand:hover { text-decoration: none; }
.wordmark { font-weight: 750; font-size: 19px; letter-spacing: -0.02em; }
.brand-sub { color: var(--text-faint); font-size: 15px; }
.toptabs { display: flex; align-self: stretch; gap: 4px; }
.toptabs a { display: flex; align-items: center; padding: 0 12px; color: var(--text-soft); font-size: 14px; font-weight: 500; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.toptabs a:hover { color: var(--text); text-decoration: none; }
.toptabs a[aria-current] { color: var(--text); border-bottom-color: var(--accent); }
.menu-toggle, .theme-toggle { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border: 0; background: none; color: var(--text-soft); border-radius: 8px; cursor: pointer; }
.menu-toggle:hover, .theme-toggle:hover { background: var(--bg-soft); }
.menu-toggle { display: none; }
.search { position: relative; flex: 1; max-width: 380px; margin-left: auto; }
.search-icon { position: absolute; left: 11px; top: 11px; color: var(--text-faint); }
.search input { width: 100%; height: 36px; padding: 0 36px 0 32px; border: 1px solid var(--border); border-radius: 8px; background: var(--bg-soft); color: var(--text); font: inherit; font-size: 14px; }
.search input:focus { outline: 2px solid var(--accent); outline-offset: -1px; background: var(--bg); }
.search kbd { position: absolute; right: 10px; top: 8px; font: 12px var(--mono); color: var(--text-faint); border: 1px solid var(--border); border-radius: 4px; padding: 0 5px; }
#search-results { position: absolute; top: 42px; left: 0; right: 0; margin: 0; padding: 6px; list-style: none; background: var(--bg); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: 0 12px 32px rgba(0,0,0,.14); max-height: 60vh; overflow: auto; }
#search-results li a { display: block; padding: 8px 10px; border-radius: 6px; color: var(--text); font-size: 14px; }
#search-results li a span { display: block; color: var(--text-faint); font-size: 12px; }
#search-results li a:hover, #search-results li a[aria-selected="true"] { background: var(--bg-soft); text-decoration: none; }
.toplinks { display: flex; align-items: center; gap: 16px; font-size: 14px; }
.toplinks a { color: var(--text-soft); }
.version { font: 600 12px var(--mono); color: var(--text-soft); background: var(--bg-soft); border: 1px solid var(--border); border-radius: 999px; padding: 2px 9px; white-space: nowrap; }

/* Layout */
.shell { display: grid; grid-template-columns: var(--sidebar) minmax(0, 1fr) var(--toc); max-width: 1480px; margin: 0 auto; }
.wide .shell { grid-template-columns: var(--sidebar) minmax(0, 1fr); max-width: 1640px; }
.wide .toc { display: none; }
.content { min-width: 0; padding: 40px 56px 64px; }
.doc { max-width: 760px; }
.wide .doc, .wide .pagefoot { max-width: 1240px; }

/* Sidebar */
.sidebar { position: sticky; top: var(--top); height: calc(100vh - var(--top)); overflow-y: auto; padding: 18px 12px 48px 16px; border-right: 1px solid var(--border); font-size: 14px; }
.side-tabs { display: none; }
.side-group + .side-group { margin-top: 18px; }
.sidebar h2 { display: flex; align-items: center; gap: 8px; margin: 0 0 4px; padding: 0 8px; font-size: 12px; font-weight: 650; text-transform: uppercase; letter-spacing: .05em; color: var(--text-faint); }
.sidebar ul { list-style: none; margin: 0; padding: 0; }
.sidebar a { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 5px 8px; border-radius: 6px; color: var(--text-soft); }
.sidebar a .badge, .sidebar a .soon-dot { flex: none; white-space: nowrap; }
.sidebar a:hover { background: var(--bg-soft); color: var(--text); text-decoration: none; }
.sidebar a[aria-current="page"] { background: var(--bg-sunk); color: var(--text); font-weight: 600; }
.sidebar .soon-dot { font-size: 11px; color: var(--soon); font-weight: 600; }
.sidebar details > summary { list-style: none; position: relative; cursor: pointer; }
.sidebar details > summary::-webkit-details-marker { display: none; }
.sidebar details > summary::after { content: ""; position: absolute; right: 10px; top: 12px; width: 6px; height: 6px; border-right: 1.5px solid var(--text-faint); border-bottom: 1.5px solid var(--text-faint); transform: rotate(-45deg); transition: transform .15s; pointer-events: none; }
.sidebar details[open] > summary::after { transform: rotate(45deg); top: 10px; }
.sidebar details > summary > a { padding-right: 26px; }
.sidebar .sub { margin: 2px 0 6px 10px; padding-left: 8px; border-left: 1px solid var(--border); }
.sidebar .sub a { justify-content: flex-start; gap: 8px; padding: 3px 8px; font-size: 13px; }
.sidebar .sub a.active { color: var(--text); background: var(--bg-soft); }
.sidebar a.parent { color: var(--text); font-weight: 600; }
.sidebar .sub .t { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.m { flex: none; width: 38px; font: 700 10px/16px var(--mono); text-align: center; border-radius: 4px; }
.m.get { color: var(--get); background: var(--get-bg); } .m.post { color: var(--post); background: var(--post-bg); }
.m.patch, .m.put { color: var(--patch); background: var(--patch-bg); } .m.delete { color: var(--delete); background: var(--delete-bg); }
.m.evt { color: var(--soon); background: var(--soon-soft); }

/* On this page */
.toc { position: sticky; top: var(--top); height: calc(100vh - var(--top)); overflow-y: auto; padding: 40px 20px 40px 8px; font-size: 13px; }
.toc p { margin: 0 0 8px; font-weight: 650; color: var(--text-faint); font-size: 12px; text-transform: uppercase; letter-spacing: .05em; }
.toc ul { list-style: none; margin: 0; padding: 0; }
.toc a { display: block; padding: 3px 0 3px 10px; color: var(--text-faint); border-left: 2px solid var(--border); }
.toc a.active { color: var(--text); border-left-color: var(--text); }

/* Type */
.doc h1 { font-size: 36px; line-height: 1.15; letter-spacing: -0.025em; margin: 0 0 12px; }
.doc h2 { font-size: 24px; line-height: 1.3; letter-spacing: -0.015em; margin: 44px 0 12px; padding-top: 8px; }
.doc h3 { font-size: 17px; margin: 28px 0 8px; }
.doc h4 { font-size: 15px; margin: 22px 0 6px; }
.doc .lead { font-size: 18px; color: var(--text-soft); margin: 0 0 22px; max-width: 760px; }
.doc ul, .doc ol { padding-left: 22px; }
.doc li + li { margin-top: 4px; }
.doc hr { border: 0; border-top: 1px solid var(--border); margin: 40px 0; }
.doc :is(h2, h3) .anchor { margin-left: 6px; color: var(--text-faint); opacity: 0; font-weight: 400; }
.doc :is(h2, h3):hover .anchor { opacity: 1; }
.doc :not(pre) > code { font: 0.86em var(--mono); background: var(--bg-sunk); border-radius: 5px; padding: 1px 5px; word-break: break-word; }

/* Code */
.doc pre { position: relative; margin: 16px 0 20px; padding: 14px 16px; background: var(--ink); color: var(--ink-text); border: 1px solid var(--ink-border); border-radius: var(--radius); overflow-x: auto; font: 13px/1.65 var(--mono); }
.doc pre code { font: inherit; }
.codepanel { margin: 16px 0 20px; border: 1px solid var(--ink-border); border-radius: var(--radius); background: var(--ink); overflow: hidden; }
.codepanel pre { margin: 0; border: 0; border-radius: 0; }
.codepanel-head { display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; gap: 4px 12px; min-height: 42px; padding: 0 8px 0 14px; background: var(--ink-head); border-bottom: 1px solid var(--ink-border); color: var(--ink-faint); font-size: 12.5px; font-weight: 600; }
.codepanel-title { display: flex; align-items: center; gap: 8px; margin-right: auto; color: var(--ink-text); }
.codepanel-title .method { font-size: 11px; }
.langtabs { display: flex; gap: 2px; }
.langtabs button { border: 0; background: none; color: var(--ink-faint); font: 600 12px var(--font); padding: 6px 9px; border-radius: 6px; cursor: pointer; }
.langtabs button:hover { color: var(--ink-text); }
.langtabs button[aria-selected="true"] { color: #fff; background: rgba(255,255,255,.08); }
.status { display: inline-block; font: 700 11px/18px var(--mono); padding: 0 7px; border-radius: 999px; }
.status.ok { color: #62c073; background: #0b2212; }
.status.err { color: #ff6166; background: #2a1314; }
.doc .ep-meta .status.ok { color: var(--post); background: var(--post-bg); }
.copy { position: absolute; top: 8px; right: 8px; padding: 2px 8px; font: 12px var(--font); color: var(--ink-faint); background: var(--ink-head); border: 1px solid var(--ink-border); border-radius: 6px; cursor: pointer; opacity: 0; transition: opacity .15s; }
pre:hover .copy, .copy:focus { opacity: 1; }
.doc pre[hidden] { display: none !important; }
.doc pre.numbered { display: flex; padding-left: 0; }
.doc pre.numbered .gutter { flex: none; min-width: 2.9em; padding: 0 12px 0 10px; text-align: right; color: #5e5e5e; user-select: none; -webkit-user-select: none; white-space: pre; }
.doc pre.numbered code { flex: none; white-space: pre; }
.panel-actions { display: flex; gap: 2px; }
.panel-actions button { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; padding: 0; border: 0; border-radius: 6px; background: none; color: var(--ink-faint); cursor: pointer; }
.panel-actions button:hover { color: var(--ink-text); background: rgba(255,255,255,.08); }
.panel-actions button.done { color: #62c073; }
.codepanel.light { background: var(--bg); border-color: var(--border); }
.codepanel.light .codepanel-head { background: var(--bg-soft); border-color: var(--border); }
.codepanel.light .codepanel-title { color: var(--text); }
.codepanel.light pre { background: var(--bg); color: var(--text); }
.codepanel.light .gutter { color: var(--border-strong); }
.codepanel.light .panel-actions button { color: var(--text-faint); }
.codepanel.light .panel-actions button:hover { color: var(--text); background: var(--bg-sunk); }
.codepanel.light .panel-actions button.done { color: var(--post); }
.codepanel.light .status.ok { color: var(--post); background: var(--post-bg); }
.codepanel.light .status.err { color: var(--delete); background: var(--delete-bg); }
.codepanel.light .tok-key { color: var(--get); }
.codepanel.light .tok-str { color: var(--post); }
.codepanel.light .tok-num { color: var(--delete); }
.codepanel.light .tok-kw { color: var(--soon); }
.codepanel.light .tok-com { color: var(--text-faint); }
.codepanel.expanded { position: fixed; z-index: 80; inset: 5vh max(4vw, 16px); margin: 0; display: flex; flex-direction: column; box-shadow: 0 0 0 100vmax rgba(0,0,0,.6); }
.codepanel.expanded pre { flex: 1; max-height: none !important; overflow: auto; }
body.panel-open { overflow: hidden; }
body.panel-open .ep-code-inner { z-index: 80; }

/* Tabs for parallel sections, such as Node.js and Python */
.codetabs { margin: 18px 0 28px; }
.codetabs-bar { display: flex; flex-wrap: wrap; gap: 4px; border-bottom: 1px solid var(--border); }
.codetabs-bar button { margin-bottom: -1px; padding: 8px 12px; border: 0; border-bottom: 2px solid transparent; background: none; color: var(--text-faint); font: 600 14px var(--font); cursor: pointer; }
.codetabs-bar button:hover { color: var(--text); }
.codetabs-bar button[aria-selected="true"] { color: var(--text); border-bottom-color: var(--text); }
.codetabs-pane > :first-child { margin-top: 18px; }
.tok-key { color: #52a8ff; }
.tok-str { color: #62c073; }
.tok-num { color: #f75f8f; }
.tok-kw { color: #bf7af0; }
.tok-com { color: #8f8f8f; font-style: italic; }
.tok-var { color: #f2a20d; }

/* Badges and callouts */
.badge { display: inline-block; padding: 1px 8px; border-radius: 999px; font-size: 12px; font-weight: 600; line-height: 20px; vertical-align: 2px; white-space: nowrap; }
.badge.launch { color: var(--text); background: var(--bg-sunk); }
.badge.soon { color: var(--soon); background: var(--soon-soft); }
.statusline { margin: 0 0 18px; }
.callout { margin: 20px 0; padding: 12px 16px; border-radius: var(--radius); border: 1px solid var(--border); background: var(--bg-soft); }
.callout p { margin: 0; }
.callout p + p { margin-top: 6px; }
.callout strong:first-child { margin-right: 4px; }
.callout.warning { background: var(--warn-soft); border-color: transparent; }
.callout.warning strong:first-child { color: var(--warn); }
.callout.soon { background: var(--soon-soft); border-color: transparent; }
.callout.soon strong:first-child { color: var(--soon); }

/* Tables */
.doc table { width: 100%; border-collapse: collapse; margin: 16px 0 24px; font-size: 14px; display: block; overflow-x: auto; }
.doc th, .doc td { text-align: left; vertical-align: top; padding: 9px 12px; border-bottom: 1px solid var(--border); }
.doc th { font-weight: 600; color: var(--text-soft); background: var(--bg-soft); }
.doc td code { white-space: nowrap; }

/* Parameter tables read as a field list */
.doc table.params { display: table; table-layout: fixed; border-top: 1px solid var(--border); }
.params tr:first-child { display: none; }
.params td { padding: 12px 0; }
.params td:first-child { width: 36%; padding-right: 16px; white-space: normal; }
.params td:first-child > code { background: none; padding: 0; font-weight: 700; font-size: 13.5px; color: var(--text); word-break: break-all; }
.params .type { display: block; color: var(--text-faint); font: 12px var(--mono); margin-top: 2px; }
.params .req { display: inline-block; margin-top: 3px; color: var(--delete); font-size: 11px; font-weight: 650; text-transform: uppercase; letter-spacing: .04em; }
.params td:last-child { color: var(--text-soft); }

/* Endpoints and objects */
.endpoint, .object { margin: 56px 0 0; padding-top: 32px; border-top: 1px solid var(--border); }
.endpoint h2, .object h2 { margin-top: 0; padding-top: 0; }
.object.event { margin-top: 32px; padding-top: 24px; }
.object.event h3 { margin-top: 0; font-size: 19px; }
.wide .endpoint.has-code, .wide .object.has-code, .wide .model-def.has-code { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 470px); gap: 56px; align-items: start; }
.ep-main { min-width: 0; }
.ep-code { min-width: 0; align-self: stretch; }
.ep-code-inner { position: sticky; top: calc(var(--top) + 20px); }
.ep-code .codepanel { margin: 0 0 16px; }
.ep-code pre { max-height: 62vh; }
.route { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 6px 0 16px; font: 14.5px var(--mono); color: var(--text); }
.method { display: inline-block; font: 700 11.5px/20px var(--mono); letter-spacing: .03em; padding: 0 7px; border-radius: 5px; }
.method.get { color: var(--get); background: var(--get-bg); } .method.post { color: var(--post); background: var(--post-bg); }
.method.put { color: var(--put); background: var(--put-bg); } .method.patch { color: var(--patch); background: var(--patch-bg); }
.method.delete { color: var(--delete); background: var(--delete-bg); }
.method.evt { color: var(--soon); background: var(--soon-soft); }
.codepanel .method { background: rgba(255,255,255,.08); }
.codepanel .method.get { color: #52a8ff; } .codepanel .method.post { color: #62c073; }
.codepanel .method.patch, .codepanel .method.put { color: #f2a20d; } .codepanel .method.delete { color: #ff6166; }
.authline { font-size: 14px; color: var(--text-soft); }
.ep-meta { margin: 0 0 20px; padding: 4px 16px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--bg-soft); font-size: 14px; }
.ep-meta > div { display: grid; grid-template-columns: 116px minmax(0, 1fr); gap: 12px; padding: 6px 0; }
.ep-meta > div + div { border-top: 1px solid var(--border); }
.ep-meta dt { color: var(--text-faint); font-weight: 600; font-size: 12.5px; text-transform: uppercase; letter-spacing: .04em; padding-top: 2px; }
.ep-meta dd { margin: 0; line-height: 1.8; }
.cred { display: inline-block; font-size: 12.5px; font-weight: 650; padding: 1px 9px; border-radius: 999px; margin-right: 4px; white-space: nowrap; }
.cred.secret { color: var(--warn); background: var(--warn-soft); }
.cred.token { color: var(--link); background: var(--info-soft); }
a.model { font: 600 13px var(--mono); }

/* Endpoint summary list */
.ep-summary { margin: 20px 0 28px; border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; }
.ep-summary-head { padding: 9px 16px; background: var(--bg-soft); border-bottom: 1px solid var(--border); font-size: 12.5px; font-weight: 650; text-transform: uppercase; letter-spacing: .05em; color: var(--text-faint); }
.ep-summary-head a { color: var(--text); text-transform: none; letter-spacing: 0; font-size: 14.5px; }
.ep-row { display: grid; grid-template-columns: 64px minmax(0, 1.1fr) minmax(0, 1fr) 52px; align-items: center; gap: 12px; padding: 9px 16px; color: var(--text); font-size: 14px; }
.ep-row + .ep-row { border-top: 1px solid var(--border); }
.ep-row:hover { background: var(--bg-soft); text-decoration: none; }
.ep-row .method { justify-self: start; }
.ep-row .badge { justify-self: end; }
.ep-path { font: 13px var(--mono); color: var(--text-soft); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; background: none !important; padding: 0 !important; }
.ep-name { color: var(--text); }
.ep-objects { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; padding: 10px 16px; border-top: 1px solid var(--border); background: var(--bg-soft); font-size: 13.5px; }
.ep-objects span { color: var(--text-faint); font-weight: 650; font-size: 12px; text-transform: uppercase; letter-spacing: .05em; }

/* Overview page */
.facts { display: grid; gap: 0; margin: 8px 0 28px; border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; }
.fact { display: grid; grid-template-columns: 120px auto 1fr; align-items: center; gap: 16px; padding: 11px 16px; font-size: 14px; }
.fact + .fact { border-top: 1px solid var(--border); }
.fact-label { color: var(--text-faint); font-weight: 650; font-size: 12.5px; text-transform: uppercase; letter-spacing: .04em; }
.fact-note { color: var(--text-soft); }
.doc .group-title { display: flex; align-items: center; gap: 10px; margin-top: 52px; }
.group-title .icon { color: var(--text-soft); }
.group-about { color: var(--text-soft); margin-top: -4px; }

/* Data models */
.model-index { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 18px 24px; margin: 24px 0 8px; padding: 18px 20px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--bg-soft); }
.model-index-group { display: flex; flex-direction: column; gap: 2px; font-size: 13.5px; }
.model-index-group span { display: flex; align-items: center; gap: 7px; margin-bottom: 4px; font-weight: 650; font-size: 12px; text-transform: uppercase; letter-spacing: .05em; color: var(--text-faint); }
.model-index-group a { font-family: var(--mono); font-size: 13px; }
.model-def { margin: 0 0 8px; padding: 24px 0 8px; border-top: 1px solid var(--border); }
.model-def h3 { margin: 0 0 6px; font: 700 18px var(--mono); }
.model-def .ep-main > p { margin: 0 0 10px; color: var(--text-soft); }
.model-def .model-source { font-size: 13.5px; }
.model-def .ep-code pre { max-height: 70vh; }
.used-by { margin: 8px 0 14px; font-size: 13px; }
.used-by > span { display: block; margin-bottom: 6px; color: var(--text-faint); font-weight: 650; font-size: 12px; text-transform: uppercase; letter-spacing: .05em; }
.used-by ul { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; margin: 0; padding: 0 !important; }
.used-by li { display: inline-flex; align-items: center; gap: 6px; margin: 0 !important; padding: 2px 8px 2px 3px; border: 1px solid var(--border); border-radius: 7px; }
.used-by li a { display: inline-flex; align-items: center; gap: 6px; color: var(--text); }
.used-by li .method { font-size: 10px; line-height: 16px; }
.used-by li code { background: none !important; padding: 0 !important; font-size: 12px; }
.use-kind { color: var(--text-faint); font-size: 11.5px; }
.fields { list-style: none; margin: 0; padding: 0 !important; border-top: 1px solid var(--border); }
.fields .field { margin: 0 !important; padding: 11px 0; border-bottom: 1px solid var(--border); }
.field-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.doc .field-name { background: none; padding: 0; font-weight: 700; font-size: 13.5px; color: var(--text); }
.field-type { font: 12.5px var(--mono); color: var(--text-faint); }
.field-desc { margin-top: 3px; font-size: 14px; color: var(--text-soft); }
.enum, .limit { margin-top: 4px; font-size: 13px; color: var(--text-faint); }
.req-tag, .null-tag { font-size: 11px; font-weight: 650; text-transform: uppercase; letter-spacing: .04em; }
.req-tag { color: var(--delete); }
.null-tag { color: var(--text-faint); }
.attrs { margin-top: 8px; }
.attrs > summary { display: inline-flex; align-items: center; gap: 6px; padding: 3px 11px; border: 1px solid var(--border-strong); border-radius: 999px; font-size: 12.5px; font-weight: 600; color: var(--text-soft); cursor: pointer; list-style: none; user-select: none; }
.attrs > summary::-webkit-details-marker { display: none; }
.attrs > summary::before { content: "+"; font-weight: 700; }
.attrs[open] > summary::before { content: "\2212"; }
.attrs > summary:hover { color: var(--text); border-color: var(--text-faint); }
.attrs > .fields { margin: 10px 0 2px; padding: 0 0 0 14px !important; border: 0; border-left: 2px solid var(--border); }
.attrs > .fields .field:last-child { border-bottom: 0; }
.attrs.top > summary { margin-bottom: 2px; }

/* API pages and endpoint pages, laid out like Square's API reference */
:root { --req-bg: #455162; --req-line: rgba(255,255,255,.14); --resp-bg: #f7f7f7; --resp-border: #d4d4d4; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --req-bg: #2b333f; --resp-bg: #111111; --resp-border: #2e2e2e; } }
:root[data-theme="dark"] { --req-bg: #2b333f; --resp-bg: #111111; --resp-border: #2e2e2e; }
.eyebrow { margin: 0 0 6px; font-size: 16px; color: var(--text-faint); }
.eyebrow a { color: var(--text-faint); }
.ep-page h1, .api-page h1 { margin: 0 0 6px; font-size: 44px; letter-spacing: -0.03em; }
.doc h1.event-title { font-size: 34px; overflow-wrap: anywhere; }
.endpoint.ep-page { margin: 0; padding-top: 0; border-top: 0; }
.endpoint.ep-errors { margin-top: 8px; }
.ep-route { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 4px; font-size: 16px; }
.ep-route + .ep-intro { margin-top: 28px; }
.ep-route .path { color: var(--text); overflow-wrap: anywhere; }
.verb { font-weight: 600; }
.verb.get { color: var(--get); } .verb.post { color: var(--post); } .verb.patch, .verb.put { color: var(--patch); }
.verb.delete { color: var(--delete); } .verb.evt { color: var(--soon); }
.ep-intro > :first-child { margin-top: 0; }
.perms { margin: 16px 0 0; font-size: 14px; color: var(--text); }
.guide-row { margin: 28px 0 0; padding: 24px 0 4px; border-top: 1px solid var(--border); font-size: 14px; }
.guide-row .label { margin: 0 0 2px; font-weight: 600; }
.guide-row a { font-weight: 600; }
.doc .ep-page .ep-main > h2 { margin: 52px 0 0; padding: 0 0 14px; border-bottom: 1px solid var(--border); font-size: 25px; }
.ep-page .ep-main > h2 + .fields { border-top: 0; }
.ep-page .fields .field { padding: 18px 0; }
.doc .field-name { font: 600 15px var(--font); }
.field-type, .field-type a.model { font: 12px var(--font); color: var(--text-faint); }
.req-tag, .null-tag { font-size: 12px; font-weight: 500; text-transform: none; letter-spacing: 0; }
.field-desc { margin-top: 6px; font-size: 15px; color: var(--text); }
.limits { display: flex; flex-wrap: wrap; gap: 4px 24px; margin-top: 8px; font-size: 15px; color: var(--text); }
.limits b { margin-left: 6px; color: var(--delete); font: 500 15px var(--font); }
.returns { margin: 16px 0 0; font-size: 14px; color: var(--text-soft); }
.doc .attrs { margin-top: 10px; }
.doc .attrs > summary { padding: 0; border: 0; border-radius: 0; color: var(--link); font: 600 14px var(--font); }
.doc .attrs > summary::before { content: "+"; font: 400 20px/1 var(--font); }
.doc .attrs > summary:hover { color: var(--link); text-decoration: underline; }
.attrs .when-open { display: none; }
.attrs[open] .when-closed { display: none; }
.attrs[open] .when-open { display: inline; }
.doc .attrs[open] { margin-top: 14px; border: 1px solid var(--border-strong); border-radius: var(--radius); background: var(--bg); overflow: hidden; }
.doc .attrs[open] > summary { display: flex; width: 100%; gap: 14px; padding: 14px 16px; border-bottom: 1px solid var(--border); color: var(--text); font: 600 15px var(--font); text-decoration: none; }
.doc .attrs[open] > summary::before { content: "\00d7"; font: 300 26px/0.8 var(--font); color: var(--text); }
.doc .attrs[open] > .fields { margin: 0; padding: 0 16px !important; border: 0; }
.enum-values { list-style: none; margin: 0; padding: 0 16px !important; }
.enum-values li { margin: 0 !important; padding: 12px 0; border-bottom: 1px solid var(--border); font-size: 14px; }
.enum-values li:last-child { border-bottom: 0; }
.enum-values span { display: block; margin-top: 2px; color: var(--text-soft); }
.err-list { margin-top: 24px; border: 1px solid var(--border-strong); border-radius: 12px; }
.err-row { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 16px; padding: 22px 24px; }
.err-row + .err-row { border-top: 1px solid var(--border); }
.err-status strong { display: block; font: 600 15px var(--mono); }
.err-status span { font-size: 13px; color: var(--text-faint); }
.doc .err-code { font: 15px var(--mono); color: var(--text); }
.err-body p { margin: 2px 0 0; font-size: 15px; }
.model-extra { margin-top: 16px; font-size: 15px; }

/* Right column: request (slate) and response (light) panels */
.codepanel.sq-request, .codepanel.sq-response { border-radius: 6px; }
.codepanel.sq-request { background: var(--req-bg); border-color: var(--req-bg); }
.sq-request .codepanel-head { min-height: 54px; padding: 0 12px 0 18px; background: var(--req-bg); border-color: var(--req-line); }
.sq-request .codepanel-title { gap: 6px; color: #fff; font-size: 15px; font-weight: 600; }
.sq-request .codepanel-title .verb { color: #5fe0b4; font-size: 17px; font-weight: 500; }
.doc .sq-request pre { background: var(--req-bg); max-height: 280px; }
.doc .sq-request pre.numbered .gutter { color: #a3adbb; }
.sq-request .panel-actions button { color: #fff; }
.sq-request .panel-actions button:hover { background: rgba(255,255,255,.12); }
.langselect select { appearance: none; -webkit-appearance: none; margin-right: 6px; padding: 4px 20px 4px 6px; border: 0; border-radius: 6px; background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 4px center; color: #fff; font: 600 13px var(--font); cursor: pointer; }
.langselect select:hover { background-color: rgba(255,255,255,.12); }
.langselect option { color: #171717; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.codepanel.sq-response { background: var(--resp-bg); border-color: var(--resp-border); }
.sq-response .codepanel-head { min-height: 54px; padding: 0 12px 0 18px; background: var(--resp-bg); border-color: var(--resp-border); }
.sq-response .codepanel-title { font-size: 15px; font-weight: 600; }
.doc .sq-response pre { background: var(--resp-bg); }
.codepanel.sq-response .tok-key, .codepanel.sq-response .tok-kw { color: var(--text); }
.sq-response .panel-actions button { color: var(--text); }

/* API page: description on the left, endpoint and webhook cards on the right */
.api-page { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 470px); gap: 56px; align-items: start; }
.api-page .lead { font-size: 16px; color: var(--text); }
.api-tabs { display: flex; gap: 18px; margin: 10px 0 22px; }
.api-tabs button { padding: 0; border: 0; background: none; color: var(--text); font: 600 17px var(--font); cursor: pointer; }
.api-tabs button[aria-selected="true"] { color: var(--link); }
.api-card { display: flex; align-items: center; gap: 16px; margin: 0 0 16px; padding: 20px 22px 20px 24px; border: 1px solid var(--border-strong); border-radius: 12px; color: var(--text); }
.api-card:hover { border-color: var(--text-faint); text-decoration: none; }
.api-card-text { flex: 1; min-width: 0; }
.api-card strong { display: block; font-size: 19px; font-weight: 600; letter-spacing: -0.01em; }
.api-card-route { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; font: 13.5px var(--mono); }
.api-card-route .path { overflow-wrap: anywhere; }
.api-card-desc { display: block; margin-top: 4px; font-size: 14px; color: var(--text-soft); }
.chev { flex: none; color: var(--text-faint); }
.api-card-group { margin: 24px 0 10px; font-size: 12px; font-weight: 650; text-transform: uppercase; letter-spacing: .05em; color: var(--text-faint); }
.api-card-group:first-child { margin-top: 0; }

/* Sidebar on endpoint pages: back arrow, the API's endpoints, its webhooks */
.sidebar a.side-back { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; margin: 4px 0 26px 8px; padding: 0; border-radius: 6px; background: var(--bg-sunk); color: var(--text); }
.sidebar a.side-back:hover { background: var(--border); }
.sidebar .side-focus h2 { margin: 0 0 8px; padding: 0 8px; font-size: 16px; font-weight: 600; text-transform: none; letter-spacing: 0; color: var(--text); }
.sidebar .side-focus h2 a { padding: 0; color: inherit; }
.sidebar .side-focus ul { margin-bottom: 24px; }
.sidebar .side-focus a { padding: 6px 8px; color: var(--text); font-size: 14.5px; overflow-wrap: anywhere; min-width: 0; }
.sidebar .side-focus a[aria-current="page"], .sidebar .side-group a[aria-current="page"] { background: none; color: var(--link); font-weight: 500; }

/* Steps, cards, diagrams */
.steps { counter-reset: step; list-style: none; padding-left: 0 !important; }
.steps > li { position: relative; padding-left: 40px; margin: 0 0 18px; }
.steps > li::before { counter-increment: step; content: counter(step); position: absolute; left: 0; top: 0; width: 26px; height: 26px; border-radius: 50%; background: var(--accent-soft); color: var(--accent); font-weight: 700; font-size: 13px; display: flex; align-items: center; justify-content: center; }
.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; margin: 20px 0 28px; }
.card { display: block; padding: 14px 16px; border: 1px solid var(--border); border-radius: var(--radius); color: var(--text); transition: border-color .15s, box-shadow .15s; }
.card:hover { border-color: var(--border-strong); box-shadow: 0 4px 16px rgba(0,0,0,.05); text-decoration: none; }
.card strong { display: block; margin-bottom: 4px; }
.card span { color: var(--text-soft); font-size: 14px; }
.card strong .cred { font-size: 13px; }
.diagram { margin: 20px 0 28px; padding: 16px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--bg-soft); overflow-x: auto; }
.diagram svg { display: block; max-width: 100%; height: auto; margin: 0 auto; }
.diagram svg text { fill: var(--text); font: 13px var(--font); }
.diagram svg .faint { fill: var(--text-faint); font-size: 12px; }
.diagram svg .box { fill: var(--bg); stroke: var(--border-strong); }
.diagram svg .accentbox { fill: var(--accent-soft); stroke: var(--accent); }
.diagram svg .line { stroke: var(--text-faint); fill: none; }
.diagram svg .arrowhead { fill: var(--text-faint); }
figcaption { margin-top: 8px; font-size: 13px; color: var(--text-faint); text-align: center; }

/* Footer */
.pagefoot { max-width: 760px; margin-top: 64px; padding-top: 20px; border-top: 1px solid var(--border); font-size: 14px; color: var(--text-soft); }
.prevnext { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 20px; }
.prevnext a { display: block; overflow-wrap: anywhere; padding: 10px 14px; border: 1px solid var(--border); border-radius: var(--radius); color: var(--text); max-width: 48%; }
.prevnext a:hover { border-color: var(--border-strong); text-decoration: none; }
.prevnext small { display: block; color: var(--text-faint); font-size: 12px; }
.prevnext .next { margin-left: auto; text-align: right; }

/* Responsive */
@media (max-width: 1440px) {
  .wide .content { padding-left: 36px; padding-right: 32px; }
  .wide .endpoint.has-code, .wide .object.has-code, .wide .model-def.has-code, .api-page { grid-template-columns: minmax(0, 1fr) minmax(0, 44%); gap: 32px; }
}
@media (max-width: 1200px) {
  .api-page { display: block; }
  .api-side { margin-top: 36px; }
  .wide .endpoint.has-code, .wide .object.has-code, .wide .model-def.has-code { display: block; }
  .ep-code-inner { position: static; }
  .ep-code { margin-top: 20px; }
}
@media (max-width: 1180px) {
  .shell { grid-template-columns: var(--sidebar) minmax(0, 1fr); }
  .toc { display: none; }
  .toplinks a, .version { display: none; }
}
@media (max-width: 920px) {
  .shell, .wide .shell { display: block; }
  .menu-toggle { display: inline-flex; }
  .toptabs { display: none; }
  .side-tabs { display: flex; gap: 4px; margin: 0 0 16px; padding: 3px; background: var(--bg-soft); border-radius: 8px; }
  .side-tabs a { flex: 1; justify-content: center; padding: 6px; font-weight: 600; }
  .side-tabs a[aria-current] { background: var(--bg); color: var(--text); box-shadow: 0 1px 2px rgba(0,0,0,.08); }
  .sidebar { position: fixed; z-index: 30; top: var(--top); left: 0; width: 86vw; max-width: 320px; background: var(--bg); transform: translateX(-100%); transition: transform .2s; }
  body.nav-open .sidebar { transform: none; box-shadow: 0 10px 40px rgba(0,0,0,.2); }
  .content, .wide .content { padding: 28px 16px 48px; }
  .topbar { gap: 10px; padding: 0 12px; }
  .search { margin-left: 0; }
  .brand-sub { display: none; }
  .doc h1 { font-size: 29px; }
  .ep-row { grid-template-columns: 58px minmax(0, 1fr) 48px; }
  .ep-row .ep-path { grid-column: 2 / 4; grid-row: 2; }
  .fact { grid-template-columns: 1fr; gap: 2px; }
  .ep-meta > div { grid-template-columns: 96px minmax(0, 1fr); gap: 10px; }
  .ep-meta dt { font-size: 11.5px; }
  .params td:first-child { width: 42%; }
  .ep-page h1, .api-page h1 { font-size: 34px; }
  .err-row { grid-template-columns: 1fr; gap: 6px; padding: 18px; }
}
@media print {
  .topbar, .sidebar, .toc, .copy, .prevnext, .langtabs, .panel-actions { display: none !important; }
  .shell { display: block; }
}
