
:root{--bg:#ffffff;--fg:#1c201e;--muted:#68706c;--rule:#e3e8e5;--green:#2fda67;
      --greenink:#12703a;--panel:#f7f9f8;--code:#f4f6f5;--link:#12703a}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){
  --bg:#0f1211;--fg:#e6ece8;--muted:#98a29d;--rule:#242a27;--greenink:#4ee585;
  --panel:#151a18;--code:#161b19;--link:#4ee585}}
:root[data-theme=dark]{--bg:#0f1211;--fg:#e6ece8;--muted:#98a29d;--rule:#242a27;
  --greenink:#4ee585;--panel:#151a18;--code:#161b19;--link:#4ee585}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);
 font:16px/1.65 "Segoe UI",system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif}
a{color:var(--link)}
/* The header is sticky, so anchored headings must clear it or they land underneath. */
main :where(h1,h2,h3,h4,h5,h6)[id],main [id]{scroll-margin-top:66px}
:focus-visible{outline:2px solid var(--green);outline-offset:2px;border-radius:4px}
.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;
 overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:-9999px;top:0;z-index:60;background:var(--green);
 color:#062b14;font-weight:600;padding:10px 16px;border-radius:0 0 6px 0;text-decoration:none}
.skip:focus{left:0}
header.top{position:sticky;top:0;z-index:20;background:var(--bg);
 border-bottom:1px solid var(--rule);display:flex;align-items:center;gap:14px;
 padding:10px 18px}
header.top .mark{display:flex;align-items:center;gap:10px;font-weight:700;
 text-decoration:none;color:var(--fg)}
header.top img{height:30px;width:auto}
header.top .sp{flex:1}
header.top a.cta{background:var(--green);color:#062b14;font-weight:600;
 padding:7px 14px;border-radius:6px;text-decoration:none;white-space:nowrap}
header.top a.cta--demo{background:transparent;color:var(--green);
 border:1px solid var(--green);padding:6px 13px}
#burger{display:none;background:none;border:1px solid var(--rule);color:var(--fg);
 border-radius:6px;padding:6px 10px;font-size:16px}
.wrap{display:flex;max-width:1280px;margin:0 auto;gap:34px;padding:0 18px}
nav.side{width:262px;flex:0 0 262px;padding:22px 0 60px;position:sticky;top:52px;
 align-self:flex-start;max-height:calc(100vh - 52px);overflow:auto}
nav.side h4{font-size:11px;letter-spacing:.11em;text-transform:uppercase;
 color:var(--muted);margin:20px 0 7px}
nav.side a{display:block;padding:5px 10px;border-radius:6px;text-decoration:none;
 color:var(--fg);font-size:14.5px}
nav.side a:hover{background:var(--panel)}
nav.side a.on{background:var(--panel);color:var(--greenink);font-weight:600;
 box-shadow:inset 3px 0 0 var(--green)}
main{flex:1;min-width:0;padding:26px 0 90px;max-width:820px}
.crumbs{color:var(--muted);font-size:13.5px;margin:0 0 6px;display:flex;
 flex-wrap:wrap;align-items:center;gap:7px}
.crumbs a{text-decoration:none}
.crumbs a:hover{text-decoration:underline}
.crumbs .sep{opacity:.55}
main h1{font-size:2.1rem;line-height:1.2;margin:.2em 0 .5em}
main h2{margin-top:1.9em;padding-bottom:.25em;border-bottom:1px solid var(--rule)}
main h3{margin-top:1.5em}
main img{max-width:100%;height:auto;border-radius:8px;border:1px solid var(--rule)}
/* Tables sit in a scroll container rather than being display:block themselves,
   so they fill the column at any width and only scroll when genuinely too wide. */
.table-wrap{overflow-x:auto;margin:1.2em 0;max-width:100%}
main .table-wrap table{margin:0}
main table{border-collapse:collapse;width:100%;margin:1.2em 0;font-size:14.6px}
main th,main td{border:1px solid var(--rule);padding:7px 10px;text-align:left;
 vertical-align:top}
main th{background:var(--panel)}
main code{background:var(--code);padding:.12em .38em;border-radius:4px;
 font:13.5px/1.5 Consolas,"Cascadia Mono",monospace}
/* Long identifiers in inline code have no break opportunity and would otherwise
   push the whole page wider than the viewport on phones. Code *blocks* are
   excluded - those scroll inside <pre> instead of wrapping. */
main :not(pre) > code{overflow-wrap:anywhere}
main :where(h1,h2,h3,h4,h5,h6,p,li,td,th,blockquote){overflow-wrap:break-word}
main pre{background:var(--code);border:1px solid var(--rule);border-radius:8px;
 padding:13px 15px;overflow-x:auto}
main pre code{background:none;padding:0}
main blockquote{margin:1.2em 0;padding:.5em 1em;border-left:3px solid var(--green);
 background:var(--panel);border-radius:0 8px 8px 0}
.searchbox{width:100%;padding:8px 11px;border:1px solid var(--rule);border-radius:7px;
 background:var(--panel);color:var(--fg);font-size:14px}
#results{margin-top:8px}
#results a{display:block;padding:7px 10px;border-radius:6px;text-decoration:none;
 color:var(--fg);font-size:14px}
#results a:hover,#results a.sel{background:var(--panel)}
#results .s{display:block;color:var(--muted);font-size:12.5px}
#results mark{background:var(--green);color:#062b14;border-radius:2px;padding:0 1px}
#results .nores{display:block;color:var(--muted);font-size:13px;padding:7px 10px}
footer{border-top:1px solid var(--rule);margin-top:40px;padding:22px 0 0;
 color:var(--muted);font-size:14px}
.pager{display:flex;justify-content:space-between;gap:14px;margin-top:44px;
 padding-top:18px;border-top:1px solid var(--rule);font-size:14.5px}
@media(max-width:900px){
 #burger{display:block}
 nav.side{display:none;position:fixed;inset:52px 0 0 0;width:100%;background:var(--bg);
  padding:16px 18px 60px;max-height:none;z-index:15;overflow:auto}
 nav.side.open{display:block}
 .wrap{gap:0}
 header.top a.cta{padding:6px 10px;font-size:14px}
 main h1{font-size:1.7rem}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;
  transition-duration:.01ms!important}
}
@media print{
 header.top,nav.side,.pager,.skip,.crumbs,#results{display:none!important}
 .wrap{display:block;max-width:none;padding:0}
 main{max-width:none;padding:0}
 main a{text-decoration:underline}
 main a[href^="http"]::after{content:" (" attr(href) ")";font-size:11px;color:#555}
 main pre,main table,main blockquote,main img{break-inside:avoid}
 main h1,main h2,main h3{break-after:avoid}
}
