:root {
  --api-bg: #fff;
  --api-surface: #f7f9fc;
  --api-card: #fff;
  --api-text: #111827;
  --api-muted: #64748b;
  --api-line: #dbe2ea;
  --api-blue: #2563eb;
  --api-cyan: #0891b2;
  --api-green: #15803d;
  --api-yellow: #b45309;
  --api-red: #dc2626;
  --api-code: #151b27;
  --api-shadow: 0 16px 40px rgba(15,23,42,.08);
  --topbar-height: 68px;
  --sidebar-width: 250px;
}

html { scroll-behavior: smooth; }
.docs-body { min-height: 100vh; margin: 0; background: var(--api-bg); color: var(--api-text); font-family: "Poppins", sans-serif; font-size: 15px; line-height: 1.75; }
.docs-body *, .docs-body *::before, .docs-body *::after { box-sizing: border-box; }
.docs-body a { color: var(--api-blue); text-decoration: none; }
.docs-body button, .docs-body input, .docs-body textarea { font: inherit; }
.docs-skip-link { position: fixed; z-index: 1000; top: -60px; left: 16px; padding: 10px 14px; border-radius: 6px; background: var(--api-text); color: var(--api-bg); }
.docs-skip-link:focus { top: 10px; }

.docs-topbar { position: sticky; z-index: 80; top: 0; height: var(--topbar-height); border-bottom: 1px solid var(--api-line); background: rgba(255,255,255,.95); backdrop-filter: blur(16px); }
.docs-topbar-inner { display: flex; width: min(1480px, 100%); height: 100%; margin: auto; padding: 0 24px; align-items: center; gap: 16px; }
.docs-brand { display: inline-flex; min-width: 190px; align-items: center; color: var(--api-text); font-weight: 650; gap: 10px; }
.docs-brand img { width: 96px; height: 34px; border-radius: 6px; object-fit: cover; }
.docs-brand > span { padding-left: 10px; border-left: 1px solid var(--api-line); font-size: 13px; font-weight: 600; }
.docs-brand-badge { color: var(--api-muted); font-weight: 500; }
.docs-search { position: relative; display: flex; width: min(440px, 40vw); height: 40px; align-items: center; border: 1px solid var(--api-line); border-radius: 7px; background: var(--api-surface); }
.docs-search-icon { display: inline-flex; padding-left: 12px; color: var(--api-muted); }
.docs-search-icon svg { width: 16px; }
.docs-search input { width: 100%; height: 100%; padding: 0 70px 0 9px; border: 0; outline: 0; background: transparent; color: var(--api-text); font-size: 12px; font-weight: 500; }
.docs-search-kbd { position: absolute; right: 8px; padding: 3px 6px; border: 1px solid var(--api-line); border-radius: 4px; color: var(--api-muted); font-size: 9px; }
.docs-search-results { position: absolute; z-index: 100; top: calc(100% + 8px); right: 0; left: 0; display: none; max-height: 360px; padding: 6px; overflow: auto; border: 1px solid var(--api-line); border-radius: 8px; background: var(--api-card); box-shadow: var(--api-shadow); }
.docs-search-results.open { display: grid; }
.docs-search-results a { display: grid; padding: 9px 10px; border-radius: 6px; color: var(--api-text); gap: 1px; }
.docs-search-results a:hover { background: var(--api-surface); }
.docs-search-results strong { font-size: 11px; }
.docs-search-results span { color: var(--api-muted); font-size: 9px; }
.docs-topbar-links { display: flex; margin-left: auto; align-items: center; gap: 4px; }
.docs-topbar-links a { padding: 8px 9px; border-radius: 6px; color: var(--api-muted); font-size: 11px; font-weight: 600; }
.docs-topbar-links a:hover { background: var(--api-surface); color: var(--api-text); }
.docs-theme-btn, .docs-menu-btn { display: inline-flex; width: 40px; height: 40px; padding: 0; align-items: center; justify-content: center; border: 1px solid var(--api-line); border-radius: 7px; background: var(--api-card); color: var(--api-text); cursor: pointer; }
.docs-theme-btn svg, .docs-menu-btn svg { width: 18px; }
.docs-theme-btn .theme-label { display: none; }
.docs-menu-btn { display: none; }

.docs-layout { display: grid; width: min(1480px, 100%); min-height: calc(100vh - var(--topbar-height)); margin: auto; grid-template-columns: var(--sidebar-width) minmax(0, 1fr); }
.docs-sidebar { position: sticky; top: var(--topbar-height); height: calc(100vh - var(--topbar-height)); padding: 24px 18px 40px 24px; overflow-y: auto; border-right: 1px solid var(--api-line); }
.docs-nav-group { margin-bottom: 24px; }
.docs-nav-group-title { margin: 0 9px 8px; color: var(--api-muted); font-size: 10px; font-weight: 700; text-transform: uppercase; }
.docs-nav-list { margin: 0; padding: 0; list-style: none; }
.docs-nav-list li { margin: 2px 0; }
.docs-nav-list a { display: block; padding: 8px 9px; border-radius: 6px; color: var(--api-muted); font-size: 11px; font-weight: 500; }
.docs-nav-list a:hover, .docs-nav-list a.active { background: #eff6ff; color: var(--api-blue); }
.docs-sidebar-backdrop { display: none; }
.docs-main { display: grid; min-width: 0; grid-template-columns: minmax(0, 900px) 190px; justify-content: center; gap: 34px; }
.docs-content { min-width: 0; padding: 50px 24px 80px; }
.docs-content > section { padding: 42px 0; border-bottom: 1px solid var(--api-line); scroll-margin-top: calc(var(--topbar-height) + 18px); }
.docs-content > section:first-child { padding-top: 10px; }
.docs-content h1 { max-width: 800px; margin: 0; font-size: clamp(46px,5.4vw,68px); font-weight: 700; line-height: 1.06; }
.docs-content h2 { margin: 0 0 16px; font-size: 32px; font-weight: 700; line-height: 1.2; }
.docs-content h3 { margin: 30px 0 12px; font-size: 20px; font-weight: 700; }
.docs-content p { margin: 10px 0; color: var(--api-muted); }
.docs-content strong { color: var(--api-text); }
.docs-content code { padding: 2px 5px; border: 1px solid var(--api-line); border-radius: 4px; background: var(--api-surface); color: var(--api-text); font-family: "JetBrains Mono", monospace; font-size: .86em; overflow-wrap: anywhere; }

.docs-hero-eyebrow { display: inline-flex; margin-bottom: 16px; align-items: center; color: var(--api-blue); font-size: 12px; font-weight: 700; gap: 8px; }
.docs-hero-eyebrow svg { width: 16px; }
.docs-hero > p { max-width: 760px; font-size: 17px; font-weight: 500; line-height: 1.8; }
.docs-hero-actions { display: flex; margin: 24px 0 32px; flex-wrap: wrap; gap: 8px; }
.docs-btn { display: inline-flex; min-height: 46px; padding: 0 17px; align-items: center; justify-content: center; border: 1px solid transparent; border-radius: 7px; font-size: 12px; font-weight: 650; gap: 8px; }
.docs-btn svg { width: 15px; }
.docs-btn-primary { background: var(--api-text); color: #fff !important; }
.docs-btn-secondary { border-color: var(--api-line); background: var(--api-card); color: var(--api-text) !important; }
.docs-nav-cards { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.docs-nav-card { display: flex; min-height: 230px; padding: 20px; border: 1px solid var(--api-line); border-radius: 8px; background: var(--api-card); color: var(--api-text) !important; flex-direction: column; transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease; }
.docs-nav-card:hover { border-color: #8da7c4; box-shadow: var(--api-shadow); transform: translateY(-3px); }
.docs-nav-card.featured { border-color: #93c5fd; box-shadow: inset 0 3px 0 var(--api-blue); }
.docs-nav-card-icon { display: inline-flex; width: 34px; height: 34px; margin-bottom: 18px; align-items: center; justify-content: center; border-radius: 7px; background: #eff6ff; color: var(--api-blue); }
.docs-nav-card-icon svg { width: 17px; }
.docs-nav-card-kicker { margin-bottom: 8px; color: var(--api-blue); font-size: 9px; font-weight: 700; }
.docs-nav-card-title { font-size: 16px; font-weight: 700; line-height: 1.35; }
.docs-nav-card-desc { margin-top: 7px; color: var(--api-muted); font-size: 11px; font-weight: 500; line-height: 1.65; }
.docs-nav-card-action { display: inline-flex; margin-top: auto; padding-top: 18px; align-items: center; color: var(--api-blue); font-size: 11px; font-weight: 700; gap: 6px; }
.docs-nav-card-action svg { width: 15px; }

.docs-steps { padding-left: 22px; }
.docs-steps li { margin: 12px 0; padding-left: 5px; color: var(--api-muted); }
.docs-steps strong { display: block; }
.docs-callout { display: grid; margin: 18px 0; padding: 14px; border: 1px solid var(--api-line); border-radius: 7px; background: var(--api-surface); grid-template-columns: 30px minmax(0,1fr); gap: 10px; }
.docs-callout.info { border-color: #bfdbfe; background: #eff6ff; }
.docs-callout.warning { border-color: #fde68a; background: #fffbeb; }
.docs-callout-icon { display: inline-flex; color: var(--api-blue); }
.docs-callout.warning .docs-callout-icon { color: var(--api-yellow); }
.docs-callout-icon svg { width: 18px; }
.docs-callout p { margin: 0; font-size: 12px; font-weight: 500; }

.docs-tabs { margin: 16px 0; }
.docs-tablist { display: inline-flex; margin-bottom: 8px; padding: 3px; border: 1px solid var(--api-line); border-radius: 7px; background: var(--api-surface); gap: 3px; }
.docs-tab { min-height: 38px; padding: 0 13px; border: 0; border-radius: 5px; background: transparent; color: var(--api-muted); font-size: 11px; font-weight: 600; cursor: pointer; }
.docs-tab.active { background: var(--api-card); color: var(--api-blue); box-shadow: 0 1px 4px rgba(15,23,42,.1); }
.docs-code { margin: 14px 0; overflow: hidden; border: 1px solid #263044; border-radius: 7px; background: var(--api-code); }
.docs-code-header { display: flex; min-height: 40px; padding: 0 12px; align-items: center; justify-content: space-between; border-bottom: 1px solid #2a3344; }
.docs-code-lang { color: #9ca8ba; font-family: "JetBrains Mono", monospace; font-size: 9px; }
.docs-copy-btn { min-height: 28px; padding: 0 9px; border: 1px solid #374151; border-radius: 5px; background: #202838; color: #dbeafe; font-size: 9px; cursor: pointer; }
.docs-code pre { margin: 0; padding: 18px; overflow-x: auto; }
.docs-code pre code { padding: 0; border: 0; background: transparent; color: #dbeafe; font-family: "JetBrains Mono", monospace; font-size: 12px; line-height: 1.8; white-space: pre; }

.docs-table-wrap { margin: 16px 0; overflow-x: auto; border: 1px solid var(--api-line); border-radius: 7px; }
.docs-table { width: 100%; border-collapse: collapse; }
.docs-table th, .docs-table td { padding: 13px 15px; border-bottom: 1px solid var(--api-line); text-align: left; vertical-align: top; font-size: 12px; font-weight: 500; }
.docs-table th { background: var(--api-surface); color: var(--api-muted); font-size: 10px; font-weight: 700; text-transform: uppercase; }
.docs-table tr:last-child td { border-bottom: 0; }
.docs-badge { display: inline-flex; padding: 3px 6px; border-radius: 4px; font-size: 8px; font-weight: 700; }
.docs-badge.post { background: #dcfce7; color: var(--api-green); }
.docs-badge.get { background: #dbeafe; color: var(--api-blue); }

.docs-tools-grid, .docs-video-grid { display: grid; margin-top: 16px; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.docs-video-grid.single { grid-template-columns: minmax(0, 560px); }
.docs-tool-card, .docs-video-card { min-width: 0; padding: 16px; border: 1px solid var(--api-line); border-radius: 8px; background: var(--api-card); }
.docs-tool-head { display: flex; align-items: center; gap: 10px; }
.docs-tool-logo { width: 40px; height: 40px; border: 1px solid var(--api-line); border-radius: 7px; object-fit: cover; }
.docs-tool-name { font-size: 14px; font-weight: 700; }
.docs-tool-desc { min-height: 48px; font-size: 11px; font-weight: 500; }
.docs-video-card { padding: 0; overflow: hidden; }
.docs-video-frame { position: relative; width: 100%; aspect-ratio: 16/9; background: var(--api-code); }
.docs-video-frame iframe { position: absolute; width: 100%; height: 100%; border: 0; inset: 0; }
.docs-video-meta { padding: 12px; }
.docs-video-meta strong { display: block; font-size: 14px; font-weight: 700; }
.docs-video-meta span { color: var(--api-muted); font-size: 11px; font-weight: 500; }

.docs-generator { margin-top: 20px; padding: 24px; border: 2px solid #93c5fd; border-radius: 8px; background: var(--api-card); box-shadow: var(--api-shadow); }
.docs-generator-head { display: flex; margin-bottom: 16px; justify-content: space-between; gap: 16px; }
.docs-generator-head h3 { margin: 0; }
.docs-secure-note { display: inline-flex; max-width: 360px; align-items: center; color: var(--api-green); font-size: 11px; font-weight: 600; gap: 6px; }
.docs-secure-note svg { width: 16px; }
.docs-generator .tabs { display: inline-flex; margin-bottom: 12px; padding: 3px; border: 1px solid var(--api-line); border-radius: 7px; background: var(--api-surface); gap: 3px; }
.docs-generator .tab { display: inline-flex; min-height: 38px; padding: 0 12px; align-items: center; border: 0; border-radius: 5px; background: transparent; color: var(--api-muted); font-size: 11px; font-weight: 600; cursor: pointer; gap: 6px; }
.docs-generator .tab.active { background: var(--api-card); color: var(--api-blue); }
.docs-generator-form { display: grid; margin-bottom: 10px; grid-template-columns: minmax(0,1fr) 40px auto; gap: 7px; }
.docs-generator-form input { min-width: 0; height: 44px; padding: 0 13px; border: 1px solid var(--api-line); border-radius: 6px; background: var(--api-card); color: var(--api-text); font-size: 12px; font-weight: 500; }
.docs-generator-form button { display: inline-flex; min-height: 44px; padding: 0 14px; align-items: center; justify-content: center; border: 1px solid var(--api-line); border-radius: 6px; background: var(--api-card); color: var(--api-text); font-size: 11px; font-weight: 650; cursor: pointer; gap: 6px; }
.docs-generator-form button:last-child { border-color: var(--api-text); background: var(--api-text); color: var(--api-bg); }
.docs-generator textarea { width: 100%; min-height: 390px; padding: 17px; border: 1px solid #263044; border-radius: 7px; background: var(--api-code); color: #dbeafe; font-family: "JetBrains Mono", monospace; font-size: 11px; line-height: 1.7; resize: vertical; }
.copy-status { min-height: 20px; margin-top: 6px; color: var(--api-green); font-size: 9px; }

.docs-accordion-item { border-top: 1px solid var(--api-line); }
.docs-accordion-trigger { display: flex; width: 100%; padding: 17px 0; align-items: center; justify-content: space-between; border: 0; background: transparent; color: var(--api-text); text-align: left; font-size: 13px; font-weight: 650; cursor: pointer; }
.docs-accordion-icon { font-size: 18px; font-weight: 400; }
.docs-accordion-panel { padding: 0 0 15px; }
.docs-pager { display: grid; margin-top: 30px; grid-template-columns: 1fr 1fr; gap: 8px; }
.docs-pager a { display: grid; padding: 14px; border: 1px solid var(--api-line); border-radius: 7px; color: var(--api-text); }
.docs-pager .next { text-align: right; }
.docs-pager .label { color: var(--api-muted); font-size: 8px; }
.docs-pager .title { font-size: 11px; font-weight: 600; }

.docs-toc { position: sticky; top: calc(var(--topbar-height) + 26px); height: fit-content; margin-top: 56px; padding-left: 15px; border-left: 1px solid var(--api-line); }
.docs-toc-title { margin-bottom: 9px; font-size: 10px; font-weight: 700; }
.docs-toc-list { margin: 0; padding: 0; list-style: none; }
.docs-toc-list a { display: block; padding: 5px 0; color: var(--api-muted); font-size: 10px; font-weight: 500; }
.docs-toc-list a:hover, .docs-toc-list a.active { color: var(--api-blue); }
.docs-footer { padding: 22px; border-top: 1px solid var(--api-line); color: var(--api-muted); text-align: center; font-size: 9px; }
.docs-toast { position: fixed; z-index: 120; right: 20px; bottom: 20px; padding: 10px 13px; border-radius: 7px; background: var(--api-text); color: var(--api-bg); box-shadow: var(--api-shadow); font-size: 10px; }

html[data-theme="dark"] {
  --api-bg: #121214;
  --api-surface: #1a1a1e;
  --api-card: #202025;
  --api-text: #e3e3e6;
  --api-muted: #a0a0a8;
  --api-line: #34343b;
  --api-blue: #78a6e8;
  --api-cyan: #67c5d4;
  --api-green: #78c694;
  --api-yellow: #ddb467;
  --api-red: #ed8585;
  --api-code: #0f1014;
  --api-shadow: 0 16px 40px rgba(0,0,0,.3);
}
html[data-theme="dark"] .docs-topbar { background: rgba(18,18,20,.95); }
html[data-theme="dark"] .docs-nav-list a:hover,
html[data-theme="dark"] .docs-nav-list a.active,
html[data-theme="dark"] .docs-nav-card-icon,
html[data-theme="dark"] .docs-callout.info { background: #252f3d; }
html[data-theme="dark"] .docs-callout.warning { border-color: #5f5134; background: #2c271d; }
html[data-theme="dark"] .docs-badge.post { background: #1d2d23; }
html[data-theme="dark"] .docs-badge.get { background: #252f3d; }

@media (max-width: 1180px) {
  .docs-main { grid-template-columns: minmax(0,900px); }
  .docs-toc { display: none; }
}
@media (max-width: 900px) {
  .docs-menu-btn { display: inline-flex; }
  .docs-brand { min-width: 120px; }
  .docs-brand > span, .docs-topbar-links { display: none; }
  .docs-search { width: auto; flex: 1; }
  .docs-layout { display: block; }
  .docs-sidebar { position: fixed; z-index: 90; top: var(--topbar-height); bottom: 0; left: 0; width: 280px; height: auto; background: var(--api-card); transform: translateX(-100%); transition: transform .2s ease; }
  .docs-sidebar.open { transform: translateX(0); }
  .docs-sidebar-backdrop.open { position: fixed; z-index: 85; display: block; background: rgba(0,0,0,.38); inset: var(--topbar-height) 0 0; }
}
@media (max-width: 640px) {
  .docs-topbar-inner { padding: 0 12px; gap: 8px; }
  .docs-brand { min-width: auto; }
  .docs-brand img { width: 74px; height: 30px; }
  .docs-search-kbd { display: none; }
  .docs-search input { padding-right: 8px; }
  .docs-content { padding: 34px 14px 60px; }
  .docs-content h1 { font-size: 42px; }
  .docs-nav-cards, .docs-tools-grid, .docs-video-grid { grid-template-columns: 1fr; }
  .docs-nav-card { min-height: 130px; }
  .docs-generator { padding: 14px; }
  .docs-generator-head { display: block; }
  .docs-secure-note { margin-top: 8px; }
  .docs-generator-form { grid-template-columns: minmax(0,1fr) 40px; }
  .docs-generator-form button:last-child { grid-column: 1/-1; }
  .docs-pager { grid-template-columns: 1fr; }
}