
html { scroll-padding-top:84px; }
.docs-page { font-size:16px; }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.skip { position:absolute; left:12px; top:-60px; z-index:100; padding:8px 14px; border:2px solid var(--ink); border-radius:999px;
        background:var(--sun); color:#26201a; font:700 14px/1 var(--round); text-decoration:none; }
.skip:focus { top:10px; }
.docs-top .tools { margin-left:auto; }
.docs-top .brand small { color:var(--accent); font-weight:700; }
.menu-btn { display:none; }
.menu-btn svg, .round svg { width:18px; height:18px; }
.docs { display:grid; grid-template-columns:232px minmax(0,1fr); gap:48px; max-width:1160px; margin:0 auto; padding:26px 24px 90px; }
.docs main { max-width:780px; margin:0; padding:0; min-width:0; line-height:1.65; }
.toc { position:sticky; top:82px; align-self:start; max-height:calc(100dvh - 100px); overflow:auto; display:grid; gap:1px;
       padding:2px 6px 24px 0; overscroll-behavior:contain; scrollbar-width:thin; }
.toc a { display:block; padding:6px 11px 5px; border-radius:10px; color:var(--soft); text-decoration:none; font:600 14.5px/1.3 system-ui,-apple-system,'Segoe UI',Roboto,sans-serif; }
.toc a.sub { padding-left:24px; font-size:13.5px; font-weight:500; color:var(--muted); }
.toc a:hover { background:color-mix(in srgb,var(--card-2) 75%,transparent); color:var(--text); }
.toc a[aria-current='true'] { background:var(--mint); color:#192c26; }
.toc a:focus-visible { outline:3px solid color-mix(in srgb,var(--accent) 50%,transparent); outline-offset:1px; }
.toc .verb { font-size:10.5px; padding:1px 6px 0; margin-right:4px; vertical-align:1px; }
.toc-k { margin:16px 0 4px 11px; font:700 11px/1.2 var(--mono); text-transform:uppercase; letter-spacing:.07em; color:var(--muted); }
.toc-k:first-of-type { margin-top:4px; }
.toc-out { display:none; }
.sec { padding:38px 0 6px; border-top:2px solid var(--line); }
.sec.hero { padding-top:6px; border-top:0; }
.sec h2 { margin:0 0 12px; font:800 31px/1.15 var(--round); letter-spacing:-.7px; display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.sec h3 { margin:30px 0 8px; font:800 20px/1.25 var(--round); letter-spacing:-.3px; }
.sec p, .sec li { color:var(--text); }
.sec p { margin:10px 0; }
.hero h1 { margin:6px 0 14px; font:800 48px/1.04 var(--round); letter-spacing:-1.4px; text-wrap:balance; }
.eyebrow { margin:0; font:700 12px/1.2 var(--mono); letter-spacing:.09em; text-transform:uppercase; color:var(--accent); }
.lead { font-size:19px; line-height:1.55; color:var(--soft) !important; max-width:44em; }
.hint { font-size:14px; }
.docs main a { color:var(--accent); text-underline-offset:2px; text-decoration-thickness:1.5px; }
.docs main :not(pre) > code { font:600 .87em/1.4 var(--mono); padding:1px 6px; border-radius:6px; background:var(--card-2);
                              border:1px solid var(--line); overflow-wrap:anywhere; color:var(--text); }
ul.tight, ol.tight { margin:10px 0 14px; padding-left:22px; display:grid; gap:7px; }
ul.tight li::marker { color:var(--muted); }
.anchor { opacity:0; margin-left:2px; font:700 .7em var(--mono); color:var(--muted) !important; text-decoration:none; transition:opacity .15s; }
h2:hover .anchor, h3:hover .anchor, .anchor:focus { opacity:1; }
.verb { display:inline-block; padding:3px 9px 2px; border:1.5px solid var(--ink); border-radius:999px; background:var(--sun); color:#26201a;
        font:800 12px/1.3 var(--mono); letter-spacing:.04em; }
.sec h2 .verb { font-size:15px; padding:4px 11px 3px; }
.endpoint { display:inline-flex; align-items:center; gap:10px; max-width:100%; margin:8px 0 22px; padding:7px 16px 7px 8px;
            border:2px solid var(--ink); border-radius:999px; background:var(--card); box-shadow:3px 3px 0 var(--ink); }
.docs main .endpoint code { padding:0; border:0; background:none; font:700 14.5px/1.3 var(--mono); overflow-wrap:anywhere; }
.facts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:4px 0 20px; }
.fact { padding:13px 16px 14px; border:2px solid var(--ink); border-radius:16px; background:var(--card); box-shadow:3px 3px 0 var(--ink); }
.fact b { display:block; margin-bottom:3px; font:800 17px/1.2 var(--round); }
.fact span { display:block; font-size:14.5px; line-height:1.5; color:var(--soft); }
.fact.mint { background:color-mix(in srgb,var(--mint) 34%,var(--card)); } .fact.sky { background:color-mix(in srgb,var(--sky) 34%,var(--card)); }
.fact.sun { background:color-mix(in srgb,var(--sun) 30%,var(--card)); } .fact.rose { background:color-mix(in srgb,var(--rose) 32%,var(--card)); }
[data-theme='dark'] .fact { border-color:var(--line); box-shadow:none; }
[data-theme='dark'] .fact.mint { background:color-mix(in srgb,var(--mint) 13%,var(--card)); }
[data-theme='dark'] .fact.sky { background:color-mix(in srgb,var(--sky) 12%,var(--card)); }
[data-theme='dark'] .fact.sun { background:color-mix(in srgb,var(--sun) 11%,var(--card)); }
[data-theme='dark'] .fact.rose { background:color-mix(in srgb,var(--rose) 12%,var(--card)); }
.docs-steps { margin:14px 0 18px; }
.docs-steps li { grid-template-columns:30px 1fr; align-items:start; padding:10px 12px; background:var(--card); }
.docs-steps li::before { margin-top:-2px; }
.docs-steps li b { font-size:16px; }
.docs-steps li small { display:block; margin-top:2px; font-size:14.5px; line-height:1.5; color:var(--soft); }
.params { margin:12px 0 14px; border:2px solid var(--ink); border-radius:16px; background:var(--card); overflow:hidden; }
.param { padding:12px 16px 13px; border-top:1.5px solid var(--line); }
.param:first-child { border-top:0; }
.p-head { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 10px; }
.docs main .p-name { padding:0; border:0; background:none; font:700 15px/1.3 var(--mono); }
.p-type, .p-def { font:600 12.5px/1.3 var(--mono); color:var(--muted); }
.badge.req { background:var(--sun); color:#26201a; }
.param p { margin:5px 0 0; font-size:15px; line-height:1.55; }
.table { margin:14px 0 18px; overflow-x:auto; border:2px solid var(--ink); border-radius:16px; background:var(--card); }
.table table { width:100%; border-collapse:collapse; font-size:14.5px; line-height:1.5; }
.table th { padding:9px 14px; text-align:left; vertical-align:bottom; background:var(--card-2); color:var(--muted); font:700 12px/1.3 var(--mono); }
.table td { padding:10px 14px; border-top:1.5px solid var(--line); vertical-align:top; }
.table td:first-child { font-weight:650; }
.errs td:first-child { font:700 14px var(--mono); white-space:nowrap; }
.errs td:nth-child(2) code { white-space:nowrap; }
.note { margin:14px 0 16px; padding:11px 15px; border-left:4px solid var(--accent); border-radius:8px; background:color-mix(in srgb,var(--mint) 22%,var(--card));
        font-size:15px; line-height:1.55; }
.note.warn { border-left-color:color-mix(in srgb,var(--sun) 75%,var(--ink)); background:color-mix(in srgb,var(--sun) 24%,var(--card)); }
[data-theme='dark'] .note { background:color-mix(in srgb,var(--mint) 9%,var(--card)); }
[data-theme='dark'] .note.warn { border-left-color:var(--sun); background:color-mix(in srgb,var(--sun) 9%,var(--card)); }
.code-card { margin:14px 0 18px; border:2px solid var(--ink); border-radius:16px; background:#26201a; box-shadow:3px 3px 0 var(--ink); overflow:hidden; }
[data-theme='dark'] .code-card { background:oklch(.145 .01 70); border-color:var(--line); box-shadow:none; }
.code-head { display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:44px; padding:6px 8px 6px 12px;
             background:#352d25; border-bottom:1.5px solid #4c4137; }
[data-theme='dark'] .code-head { background:oklch(.2 .012 70); border-bottom-color:var(--line); }
.code-label { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font:600 12.5px/1.2 var(--mono); color:#e3d6bf; }
.code-head .seg { min-width:0; overflow-x:auto; scrollbar-width:none; background:transparent; border:1.5px solid #5e5246; padding:2px; }
.code-head .seg::-webkit-scrollbar { display:none; }
.code-head .seg button { color:#e3d6bf; padding:6px 12px 5px; font-size:13px; white-space:nowrap; }
.code-head .seg button:hover { color:#fff4dd; }
.code-head .seg button[aria-pressed='true'] { background:var(--mint); color:#192c26; }
.copy { flex:none; display:inline-flex; align-items:center; gap:6px; height:30px; padding:0 12px; border:1.5px solid #5e5246; border-radius:999px;
        background:transparent; color:#fff4dd; font:700 12.5px/1 var(--round); cursor:pointer; }
.copy:hover { background:#463b31; }
.copy:focus-visible, .code-head .seg button:focus-visible { outline:3px solid color-mix(in srgb,var(--mint) 70%,transparent); outline-offset:2px; }
.copy.done { background:var(--mint); border-color:var(--mint); color:#192c26; }
.code-card pre { margin:0; padding:14px 16px 16px; overflow:auto; color:#fff4dd; font:13.2px/1.62 var(--mono); tab-size:2; }
.code-card pre code { display:block; width:max-content; min-width:100%; font:inherit; color:inherit; white-space:pre; }
.code-card pre:focus-visible { outline:3px solid color-mix(in srgb,var(--mint) 70%,transparent); outline-offset:-3px; }
.code-card pre.wrap code { width:auto; white-space:pre-wrap; overflow-wrap:anywhere; }
.code-card pre.more { -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent);
                      mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent); }
.t-com { color:#b3a894; font-style:italic; }
.t-str { color:#ffd84d; }
.t-key { color:#b9e3ff; }
.t-kw { color:#a3d9cd; }
.t-num { color:#ffc2dc; }
.t-tag { color:#b9e3ff; }
.t-attr { color:#d7c8ff; }
.change { padding:2px 0 0 16px; border-left:3px solid var(--mint); }
.change .when { margin:0 0 4px; font:800 16px/1.3 var(--round); }
.foot { display:flex; flex-wrap:wrap; gap:8px 18px; margin-top:44px; padding-top:18px; border-top:2px solid var(--line); font-size:14px; color:var(--muted); }
.foot span { font-weight:700; color:var(--text); }
@media (max-width:1000px) {
  html { scroll-padding-top:72px; }
  .docs { grid-template-columns:minmax(0,1fr); gap:0; padding:16px 18px 60px; }
  .menu-btn { display:grid; }
  .toc { position:fixed; z-index:40; inset:var(--top,58px) 0 0 0; align-self:stretch; max-height:none;
         padding:14px 18px calc(30px + env(safe-area-inset-bottom)); background:var(--bg); border-top:2px solid var(--ink); display:none;
         align-content:start; }
  .toc.open { display:grid; animation:fade .2s ease; }
  .toc a { padding:10px 12px 9px; font-size:16px; }
  .toc a.sub { padding-left:28px; font-size:15px; }
  .toc-out { display:grid; gap:6px; margin-bottom:6px; padding-bottom:12px; border-bottom:1.5px solid var(--line); }
  .toc-out a { padding:10px 14px 9px; border:2px solid var(--ink); border-radius:999px; background:var(--card); font-weight:700; color:var(--text); }
  body.menu-open { overflow:hidden; }
}
@media (max-width:640px) {
  .docs main { padding-bottom:0; }
  .wide-only { display:none; }
  .hero h1 { font-size:36px; letter-spacing:-1px; }
  .lead { font-size:17.5px; }
  .sec { padding-top:30px; }
  .sec h2 { font-size:26px; }
  .sec h3 { font-size:18.5px; margin-top:26px; }
  .facts { grid-template-columns:1fr; gap:10px; }
  .endpoint { border-radius:16px; padding:8px 12px 8px 8px; }
  .docs main .endpoint code { font-size:13px; }
  .code-card { margin-left:-4px; margin-right:-4px; box-shadow:2px 2px 0 var(--ink); }
  .code-card pre { padding:12px 13px 14px; font-size:12.6px; }
  .code-head .seg button { padding:6px 10px 5px; }
  .table { border:0; background:none; overflow:visible; }
  .table table, .table tbody, .table tr, .table td { display:block; width:auto; }
  .table thead { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
  .table tr { margin:0 0 10px; padding:10px 14px 11px; border:2px solid var(--ink); border-radius:14px; background:var(--card); }
  .table td { padding:3px 0; border:0; }
  .table td[data-label]::before { content:attr(data-label); display:block; font:700 11.5px/1.4 var(--mono); color:var(--muted); }
  .errs td:first-child { white-space:normal; }
  .param { padding:11px 14px 12px; }
}
@media print {
  .toc, .docs-top .tools, .copy, .code-head .seg { display:none !important; }
  .docs { display:block; }
  .code-card pre[hidden] { display:block !important; }
}
