:root {
  --accent: #1686d9;
  --accent-soft: #eef7fd;
  --border: #e4e7eb;
  --ink: #25262a;
  --muted: #69717b;
  --nav: #222235;
  --nav-hover: #2c2d45;
  --nav-ink: #e3e4ec;
  --nav-muted: #a6a8b7;
  --surface: #ffffff;
  --sidebar-width: 296px;
  --topbar-height: 58px;
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background: var(--surface);
  font-synthesis: none;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; background: var(--surface); font-size: 16px; line-height: 1.65; }
a { color: #1782bf; text-decoration-thickness: 1px; text-underline-offset: .15em; }
a:hover { color: #086b9f; }
img { display: block; max-width: 100%; height: auto; border: 1px solid var(--border); border-radius: 5px; }

.app { min-height: 100vh; }
.sidebar {
  position: fixed; inset: 0 auto 0 0; z-index: 30; display: grid; grid-template-rows: var(--topbar-height) auto minmax(0, 1fr);
  width: var(--sidebar-width); color: var(--nav-ink); background: var(--nav); border-right: 1px solid #303146;
}
.sidebar-brand { display: flex; align-items: center; padding: 0 17px; border-bottom: 1px solid #343548; }
.sidebar-brand a { display: inline-flex; align-items: center; }
.brand-logo { width: 139px; height: auto; border: 0; border-radius: 0; }
.project-panel { padding: 17px 16px 15px; border-bottom: 1px solid #343548; }
.back-home { display: block; margin-bottom: 12px; color: var(--nav-muted); font-size: 12px; text-decoration: none; }
.back-home:hover { color: #fff; }
.project-name { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 8px; font-size: 13px; line-height: 1.3; }
.project-name strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.project-dot { width: 9px; height: 9px; background: #f6da49; border-radius: 50%; box-shadow: 0 0 0 3px rgba(246,218,73,.13); }
.legacy-tag { padding: 2px 6px; color: #f6da49; border: 1px solid rgba(246,218,73,.35); border-radius: 999px; font-size: 9px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }

.sidebar-nav { min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 10px 0 28px; scrollbar-color: #77798c transparent; scrollbar-width: thin; }
.sidebar-nav::-webkit-scrollbar { width: 7px; }
.sidebar-nav::-webkit-scrollbar-track { background: transparent; }
.sidebar-nav::-webkit-scrollbar-thumb { background: #696b7d; border: 2px solid var(--nav); border-radius: 10px; }
.nav-label { padding: 9px 16px 6px; color: #8f92a6; font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.nav-label.standalone { margin-top: 4px; }
.nav-section-title { padding: 20px 16px 8px; color: #f0f0f5; font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.nav-link, .project-link { display: block; overflow: hidden; color: #d9dae3; font-size: 12px; line-height: 1.3; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; }
.nav-link { position: relative; padding: 7px 28px 7px 18px; }
.nav-link.nested { padding-left: 34px; }
.nav-link:hover, .project-link:hover { color: #fff; background: var(--nav-hover); }
.nav-link.active { color: #fff; background: #3d5878; font-weight: 600; }
.nav-link.active::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 3px; background: #63b4e7; }
.project-link { padding: 7px 16px 7px 22px; }

.nav-group { border-bottom: 1px solid rgba(255,255,255,.045); }
.nav-group > summary, .other-products > summary {
  position: relative; display: flex; align-items: center; justify-content: space-between; min-height: 34px;
  padding: 8px 16px; color: #aeb1c1; cursor: pointer; list-style: none; font-size: 10px; font-weight: 800; letter-spacing: .075em; text-transform: uppercase;
}
.nav-group > summary::-webkit-details-marker, .other-products > summary::-webkit-details-marker { display: none; }
.nav-group > summary:hover, .other-products > summary:hover { color: #fff; background: rgba(255,255,255,.035); }
.chevron { width: 7px; height: 7px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg) translateY(-2px); transition: transform .15s ease; }
details[open] > summary .chevron { transform: rotate(225deg) translate(-1px, -1px); }
.nav-group-links { padding: 0 0 6px; }
.other-products { margin-top: 12px; border-top: 1px solid #343548; }
.other-products > div { padding-bottom: 5px; }

.doc-group > summary, .api-service > summary, .api-category > summary {
  display: flex; align-items: center; justify-content: space-between; cursor: pointer; list-style: none;
}
.doc-group > summary::-webkit-details-marker, .api-service > summary::-webkit-details-marker, .api-category > summary::-webkit-details-marker { display: none; }
.doc-group > summary { min-height: 33px; padding: 6px 17px; color: #d9dae3; font-size: 12px; white-space: nowrap; }
.doc-group > summary:hover, .api-service > summary:hover, .api-category > summary:hover { color: #fff; background: var(--nav-hover); }
.api-service { margin-top: 2px; }
.api-service > summary { min-height: 38px; padding: 7px 16px; color: #eff0f5; font-size: 13px; }
.service-title { display: flex; align-items: center; min-width: 0; gap: 9px; }
.service-title a { overflow: hidden; color: inherit; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; }
.service-title a.active { color: #fff; font-weight: 650; }
.api-cloud { color: #cf3ce4; font-size: 19px; line-height: 1; }
.api-service-body { padding-bottom: 4px; }
.api-category > summary { min-height: 33px; padding: 6px 17px 6px 43px; color: #e1e2e9; font-size: 12px; white-space: nowrap; }
.api-category > summary > span:first-child { display: flex; align-items: center; gap: 9px; }
.api-endpoint { display: grid; grid-template-columns: 18px minmax(0, 1fr) auto; align-items: center; gap: 6px; min-height: 33px; padding: 6px 17px 6px 60px; overflow: hidden; color: #e1e2e9; font-size: 12px; line-height: 1.25; text-decoration: none; white-space: nowrap; }
.api-endpoint > span:nth-child(2) { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.api-endpoint:hover, .schema-link:hover { color: #fff; background: var(--nav-hover); }
.api-endpoint.active, .schema-link.active { color: #fff; background: #34364b; }
.api-endpoint.active { box-shadow: inset 3px 0 #8b52ff; }
.endpoint-icon { color: #8b52ff; font-size: 16px; font-weight: 800; line-height: 1; }
.endpoint-method { font-size: 10px; font-weight: 800; letter-spacing: .025em; }
.endpoint-method.get { color: #51c878; }
.endpoint-method.post { color: #66a5ff; }
.endpoint-method.put, .endpoint-method.patch { color: #f5bd52; }
.endpoint-method.delete { color: #ef6d75; }
.schemas-node > summary { padding-left: 43px; }
.schema-icon { color: #f27632; font-size: 17px; line-height: 1; }
.schema-link { position: relative; display: block; overflow: hidden; padding: 6px 18px 6px 67px; color: #d7d8e2; font-size: 11px; line-height: 1.3; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; }

.topbar {
  position: fixed; inset: 0 0 auto var(--sidebar-width); z-index: 20; height: var(--topbar-height);
  display: flex; align-items: center; padding: 0 34px; color: var(--ink); background: rgba(255,255,255,.98); border-bottom: 1px solid var(--border);
}
.mobile-nav-toggle { display: none; }
.search-wrap { position: relative; width: min(620px, 55vw); }
.search-icon { position: absolute; left: 1px; top: 50%; transform: translateY(-52%); color: #616975; font-size: 20px; line-height: 1; pointer-events: none; }
.search { width: 100%; padding: 10px 12px 10px 27px; color: var(--ink); background: transparent; border: 0; border-radius: 0; font: inherit; font-size: 13px; }
.search::placeholder { color: #9298a1; }
.search:focus { outline: 0; }
.search-results { position: absolute; inset: calc(100% + 10px) auto auto 0; width: min(520px, 70vw); max-height: min(70vh, 520px); overflow-y: auto; background: #fff; border: 1px solid var(--border); border-radius: 7px; box-shadow: 0 14px 38px rgba(20,24,31,.18); }
.search-results a { display: flex; flex-direction: column; gap: 1px; padding: 10px 13px; color: var(--ink); text-decoration: none; border-bottom: 1px solid var(--border); }
.search-results a:last-child { border-bottom: 0; }
.search-results a:hover { background: #f7f8fa; }
.search-results strong { font-size: 13px; line-height: 1.35; }
.search-results span, .search-empty { color: var(--muted); font-size: 12px; }
.search-empty { padding: 14px; }

.main { display: grid; grid-template-columns: minmax(0, 940px) 190px; gap: 64px; margin-left: var(--sidebar-width); padding: var(--topbar-height) 56px 0; }
.article { width: 100%; min-width: 0; padding: 82px 0 96px; }
.eyebrow { margin-bottom: 13px; color: #2889bf; font-size: 11px; font-weight: 800; letter-spacing: .085em; text-transform: uppercase; }
.article h1 { margin: 0 0 32px; color: #242529; font-size: clamp(2rem, 2.7vw, 2.4rem); line-height: 1.18; letter-spacing: -.025em; }
.article h2 { margin: 42px 0 14px; padding-top: 5px; color: #27282c; font-size: 1.65rem; line-height: 1.28; letter-spacing: -.018em; }
.article h3 { margin: 31px 0 10px; color: #303136; font-size: 1.2rem; line-height: 1.4; }
.article h4 { margin: 25px 0 8px; font-size: 1rem; }
.article p, .article li { max-width: 82ch; color: #46494f; }
.article p { margin: 0 0 18px; }
.article ul, .article ol { padding-left: 28px; }
.article blockquote { margin: 24px 0; padding: 14px 18px; color: #3d5468; background: var(--accent-soft); border-left: 3px solid #4aa3d8; border-radius: 0 4px 4px 0; }
.article blockquote p { margin: 0; }
.article hr { margin: 40px 0; border: 0; border-top: 1px solid var(--border); }
.article pre { overflow-x: auto; margin: 20px 0; padding: 17px; color: #e8eef5; background: #181b25; border-radius: 5px; font-size: 13px; line-height: 1.55; }
.article code { padding: .12em .32em; color: #353943; background: #f0f2f4; border-radius: 3px; font-size: .9em; }
.article pre code { padding: 0; color: inherit; background: transparent; }
.article table { width: 100%; border-collapse: collapse; margin: 22px 0; font-size: 13px; }
.article th, .article td { padding: 9px 11px; text-align: left; vertical-align: top; border: 1px solid var(--border); }
.article th { color: #3d4148; background: #f7f8fa; font-weight: 650; }
.article img { margin: 24px 0; }

.page-toc { position: sticky; top: 96px; align-self: start; margin-top: 92px; padding-left: 17px; border-left: 1px solid var(--border); }
.page-toc > div { margin-bottom: 9px; color: #8a9098; font-size: 10px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.page-toc a { display: block; overflow: hidden; margin: 7px 0; color: #737983; font-size: 11px; line-height: 1.4; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; }
.page-toc a:hover { color: #1686d9; }
.page-toc .toc-level-3 { padding-left: 10px; }

.api-head { display: flex; align-items: center; gap: 11px; margin-bottom: 13px; }
.method { display: inline-flex; align-items: center; min-height: 25px; padding: 2px 8px; color: #fff; background: #a64d28; border-radius: 4px; font-size: 10px; font-weight: 800; letter-spacing: .05em; }
.method-get { background: #167a57; }
.method-post { background: #a64d28; }
.endpoint { overflow-wrap: anywhere; color: #4e5862; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 13px; }
.notice { margin: 23px 0; padding: 13px 15px; color: #594509; background: #fff9df; border: 1px solid #ead57f; border-radius: 5px; }
.upgrade-notice { display: grid; grid-template-columns: 1fr auto; gap: 3px 20px; align-items: center; margin: 0 0 30px; padding: 14px 16px; color: #294d66; background: #eef7fc; border: 1px solid #b8dced; border-left: 4px solid #3c98c8; border-radius: 5px; font-size: 14px; line-height: 1.45; }
.upgrade-notice strong { color: #243e50; font-size: 15px; }
.upgrade-notice span { grid-column: 1; }
.upgrade-notice a { grid-column: 2; grid-row: 1 / span 2; color: #1678ad; font-weight: 700; white-space: nowrap; }
.schema-kicker { display: inline-block; margin-bottom: 12px; padding: 3px 8px; color: #4d376f; background: #f1eafa; border-radius: 4px; font-size: 10px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.required { display: block; margin-top: 3px; color: #a6402b; font-size: 9px; font-weight: 800; text-transform: uppercase; }
.api-meta { display: grid; grid-template-columns: max-content 1fr; gap: 7px 17px; margin: 26px 0; }
.api-meta dt { color: var(--muted); font-weight: 700; }
.api-meta dd { margin: 0; }
.table-scroll { max-width: 100%; overflow-x: auto; }
.page-footer { margin-top: 68px; padding-top: 19px; color: var(--muted); border-top: 1px solid var(--border); font-size: 12px; }
.product-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 34px; }
.product-grid a { display: flex; flex-direction: column; gap: 4px; padding: 17px; color: var(--ink); border: 1px solid var(--border); border-radius: 6px; text-decoration: none; }
.product-grid a:hover { border-color: #84badd; box-shadow: 0 6px 18px rgba(26,77,112,.08); }
.product-grid span { color: var(--muted); font-size: 12px; }

@media (max-width: 1180px) {
  .main { grid-template-columns: minmax(0, 1fr); padding-right: 48px; }
  .page-toc { display: none; }
}

@media (max-width: 780px) {
  :root { --topbar-height: 54px; }
  .sidebar { transform: translateX(-100%); transition: transform .18s ease; box-shadow: 12px 0 30px rgba(15,18,28,.25); }
  body.nav-open .sidebar { transform: translateX(0); }
  .topbar { left: 0; padding: 0 14px; }
  .mobile-nav-toggle { display: grid; place-items: center; width: 36px; height: 36px; margin-right: 8px; color: #464b53; background: transparent; border: 0; border-radius: 4px; font-size: 19px; }
  .search-wrap { width: 100%; }
  .main { display: block; margin-left: 0; padding: var(--topbar-height) 22px 0; }
  .article { padding: 42px 0 70px; }
  .article h1 { font-size: 2rem; }
  .upgrade-notice { grid-template-columns: 1fr; }
  .upgrade-notice a { grid-column: 1; grid-row: auto; margin-top: 5px; }
  .product-grid { grid-template-columns: 1fr; }
}