/* VeraGen API docs — GENERATED by scripts/api-docs.py; edit it there. Uses site.css's variables. */
section.api{ padding:26px 0 80px; }
.api-shell{ display:grid; grid-template-columns:230px minmax(0,1fr) 440px; gap:40px; max-width:1400px; margin:0 auto; padding:0 24px; align-items:start; }
/* The wrapper is the grid item, so IT is what sticks (a sticky child of a short wrapper goes nowhere). */
.api-navwrap{ position:sticky; top:80px; align-self:start; max-height:calc(100vh - 96px); overflow:auto; }
.api-navwrap > summary{ display:none; }
.api-nav{ font-size:14px; padding-right:6px; }
.api-nav h6{ margin:16px 0 6px; font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--steel); }
.api-nav a{ display:flex; align-items:center; gap:8px; padding:5px 10px; border-radius:7px; color:var(--ink2); }
.api-nav a:hover{ background:var(--alt); color:var(--ink); }
.api-nav a.op{ padding-left:16px; font-size:13.5px; }
.api-nav a.tag{ font-weight:650; color:var(--ink); }
.api-nav a.on{ background:var(--alt2); color:var(--accent); font-weight:650; }
.api-main{ min-width:0; }
.api-sec{ padding:4px 0 36px; margin-bottom:36px; border-bottom:1px solid var(--line); scroll-margin-top:80px; }
.api-sec:last-child{ border-bottom:0; }
.api-sec .eye{ font-size:12.5px; letter-spacing:.14em; text-transform:uppercase; font-weight:700; color:var(--accent); margin:0 0 6px; }
.api-sec h1{ font-size:clamp(28px,3vw,38px); margin:0 0 18px; letter-spacing:-.025em; }
.api-sec h2{ font-size:24px; margin:0 0 12px; }
.api-sec h3{ font-size:16.5px; margin:22px 0 8px; }
.api-sec .lead{ font-size:18px; }
.api-sec p, .api-sec li{ color:var(--ink2); }
.api-sec ul, .api-sec ol{ padding-left:22px; margin:0 0 16px; }
.api-sec li{ margin:4px 0; }
.api-main code{ background:var(--alt); border:1px solid var(--line); border-radius:5px; padding:1px 5px; font:500 .88em ui-monospace,SFMono-Regular,Menlo,monospace; color:var(--ink); word-break:break-word; }
.tw{ overflow-x:auto; margin:6px 0 14px; }
table.api-t{ border-collapse:collapse; width:100%; font-size:14.5px; }
.api-t th{ text-align:left; font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--steel); padding:8px 10px; border-bottom:1px solid var(--line); }
.api-t td{ border-bottom:1px solid var(--line2); padding:9px 10px; vertical-align:top; color:var(--ink2); }
.api-t td:first-child code, .api-t td:nth-child(2) > code{ white-space:nowrap; word-break:normal; }
.pin{ color:var(--steel); font-size:12.5px; }
.note{ font-size:14px; color:var(--steel); }
.endpoint{ display:flex; flex-wrap:wrap; gap:10px; align-items:center; background:var(--alt); border:1px solid var(--line); border-radius:10px; padding:10px 14px; margin:0 0 16px; }
.endpoint code{ background:none; border:0; padding:0; font-size:15px; }
.scope{ margin-left:auto; font:600 12px ui-monospace,Menlo,monospace; color:var(--violet); background:#f1edff; border-radius:999px; padding:3px 10px; }
.m{ font:700 10.5px ui-monospace,Menlo,monospace; letter-spacing:.04em; padding:2px 6px; border-radius:5px; flex:none; }
.m.get{ color:#0b7a4b; background:#e2f6ec; } .m.post{ color:#0b5cc0; background:#e3eefc; }
.m.patch{ color:#8a5a00; background:#fdf0d8; } .m.delete{ color:#b4233f; background:#fde6eb; }
.st{ font:700 11.5px ui-monospace,Menlo,monospace; border-radius:5px; padding:1px 6px; }
.st.s2{ color:#0b7a4b; background:#e2f6ec; } .st.s4{ color:#8a5a00; background:#fdf0d8; } .st.s5{ color:#b4233f; background:#fde6eb; }
ul.errs{ list-style:none; padding:0; } ul.errs li{ margin:6px 0; }
ul.log{ list-style:none; padding:0; } ul.log li{ padding:12px 0; border-bottom:1px solid var(--line2); }
/* THE CODE PANE STICKS. It must be align-self:start in a grid with no overflow on any ancestor, or
   position:sticky silently does nothing (test-api-docs.mjs measures it). */
.api-code{ position:sticky; top:80px; align-self:start; max-height:calc(100vh - 96px); overflow:auto; background:var(--navy2); color:#e6edf7; border-radius:var(--radius); box-shadow:var(--shadow-lg); }
.api-tabs{ display:flex; gap:4px; padding:10px 10px 0; }
.api-code > .api-tabs{ position:sticky; top:0; background:var(--navy2); z-index:1; padding-bottom:6px; }
.api-tabs button{ font:inherit; font-size:13px; font-weight:650; color:#9fb3cc; background:transparent; border:0; border-radius:8px; padding:6px 11px; cursor:pointer; }
.api-tabs button:hover{ color:#fff; background:rgba(255,255,255,.06); }
.api-tabs button[aria-selected="true"]{ color:#fff; background:rgba(65,153,254,.22); }
.api-panel{ display:none; padding:6px 12px 14px; } .api-panel.on{ display:block; }
.ex{ display:none; }
.api-preview{ margin:0 0 22px; padding:12px 16px; border-radius:12px; background:#eef5ff; border:1px solid #cfe1fb; color:#0b1b31; font-size:14.5px; line-height:1.55; }
.api-preview a{ font-weight:600; }
html[data-lang="curl"] .ex[data-lang="curl"], html[data-lang="javascript"] .ex[data-lang="javascript"], html[data-lang="python"] .ex[data-lang="python"]{ display:block; }
html:not(.js) .ex{ display:block; }
.exl{ font-size:11.5px; letter-spacing:.1em; text-transform:uppercase; font-weight:700; color:#7f93ad; margin:10px 2px 6px; }
.ex .exl{ display:none; } html:not(.js) .ex .exl{ display:block; }
pre.code{ position:relative; margin:0 0 4px; padding:32px 14px 14px; border-radius:10px; background:#0a2244; overflow:auto; font:12.8px/1.6 ui-monospace,SFMono-Regular,Menlo,monospace; color:#e6edf7; white-space:pre; }
pre.code code{ background:none; border:0; padding:0; color:inherit; font:inherit; word-break:normal; }
.copy{ position:absolute; top:8px; right:8px; font:600 11.5px var(--font); color:#cfe0f5; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.16); border-radius:7px; padding:3px 9px; cursor:pointer; }
.copy:hover{ background:rgba(255,255,255,.16); }
.tk{ color:#9cdcfe; } .ts{ color:#a8e3a2; } .tn{ color:#ffd28a; } .tb{ color:#7fc4ff; } .tc{ color:#7d8ea8; font-style:italic; } .tf{ color:#c9b3ff; } .tv{ color:#ffb3d1; }
pre.code[data-lang="curl"] .tk, pre.code[data-lang="javascript"] .tk, pre.code[data-lang="python"] .tk{ color:#ff9ac1; }
.api-inline{ display:none; margin-top:18px; background:var(--navy2); color:#e6edf7; border-radius:14px; padding:4px 0 6px; }
.api-inline > .api-tabs{ padding:10px 10px 0; }
.api-inline > .ex, .api-inline > .resp{ padding:0 12px; }
html:not(.js) .api-inline{ display:block; } html:not(.js) .api-code, html:not(.js) .api-inline > .api-tabs{ display:none; }
@media(max-width:1100px){
  .api-shell{ grid-template-columns:220px minmax(0,1fr); }
  .api-code{ display:none; }
  .api-inline{ display:block; }
}
@media(max-width:760px){
  .api-shell{ grid-template-columns:minmax(0,1fr); gap:16px; padding:0 16px; }
  .api-navwrap{ position:static; max-height:none; overflow:visible; border:1px solid var(--line); border-radius:12px; padding:4px 10px; }
  .api-navwrap > summary{ display:block; cursor:pointer; font-weight:650; padding:8px 2px; }
  .api-sec h1{ font-size:28px; }
}

/* DARK (Paul, 2026-10-04: "Please make the API in dark mode"). api.css loads ONLY on /api/ pages, so
   these rules dress those pages and nothing else. The brand surface and the dark-row variables are
   the same ones site.css uses for .dk sections, so the reference reads as part of veragen.ai. */
body{ background:var(--b-foot); }
section.api{ --ink:#eef4fb; --ink2:#c9d6e6; --dim:#a8b9cf; --steel:#8a9bb3;
  --line:rgba(160,196,208,.18); --line2:rgba(160,196,208,.10); --alt:rgba(255,255,255,.05); --alt2:rgba(65,153,254,.16);
  --accent:#56a9fc; color:var(--ink);
  background:var(--b-glow), var(--b-grid), linear-gradient(180deg,var(--b-edge),var(--b-foot)); background-attachment:fixed; }
section.api section.api-sec{ background:transparent; }
section.api input, section.api select{ background:rgba(255,255,255,.06); color:#eef4fb; border-color:rgba(160,196,208,.25); }
section.api input::placeholder{ color:#8a9bb3; }
.api-navwrap, .api-code{ scrollbar-color:rgba(160,196,208,.25) transparent; } /* site.css paints every <section> white */
section.api h1, section.api h2, section.api h3, section.api h4{ color:#fff; }
section.api a{ color:#7cbcff; } section.api a:hover{ color:#a9d3ff; }
.api-navwrap{ border-right:1px solid var(--line2); padding-right:12px; }
.api-nav a.on{ color:#fff; background:rgba(65,153,254,.20); }
.api-main code{ background:rgba(255,255,255,.07); border-color:rgba(160,196,208,.18); color:#e6edf7; }
.endpoint{ background:rgba(255,255,255,.04); }
.scope{ color:#cdb9ff; background:rgba(124,92,255,.18); }
.m.get{ color:#7ee2b0; background:rgba(18,185,129,.16); } .m.post{ color:#8cc2ff; background:rgba(65,153,254,.18); }
.m.patch{ color:#ffd28a; background:rgba(245,158,11,.16); } .m.delete{ color:#ff9db0; background:rgba(244,63,107,.16); }
.st.s2{ color:#7ee2b0; background:rgba(18,185,129,.16); } .st.s4{ color:#ffd28a; background:rgba(245,158,11,.16); } .st.s5{ color:#ff9db0; background:rgba(244,63,107,.16); }
.api-preview{ background:rgba(65,153,254,.12); border-color:rgba(86,169,252,.35); color:#dbe9fb; }
.api-preview a{ color:#9fd0ff; }
.api-code{ background:#0b1626; border:1px solid rgba(160,196,208,.14); box-shadow:0 20px 60px rgba(0,0,0,.35); }
.api-code > .api-tabs{ background:#0b1626; }
pre.code{ background:#060b14; border:1px solid rgba(160,196,208,.10); }
