/* Void docs: one stylesheet for every page under /docs/ and for the offer (/offer/).
   The same plate as the site and the cabinet (infra/site-next): greys only, hairline frames, no rounded corners,
   the pixel face in whole multiples of its grid (Void Mono 16 / 32, Void Mono Small 11 / 22).
   What is read at length (paragraphs, list items, table cells) is set in a plain sans: Inter on the English pages,
   the system sans on the Russian ones (fonts/inter.woff2 is Latin only, and two faces in one sentence read worse
   than one). Blocks of code are set in the system's ordinary monospace (see the note at `pre`). Headings, labels,
   navigation, buttons, method tags, paths and inline code stay in the pixel face.
   Colour appears only on DELETE, as on the destructive buttons of the cabinet.
   Every section has one glyph: before its title, in the list of sections, in the strip of the header, on its tile
   on the first page.
   One script, and it only copies: copy.js puts a button in the corner of each block of code (the owner's decision
   of 2026-11-13; CSP script-src 'self'). Everything else works without it, and without it there is no button: the
   section list on a narrow screen opens through :target (#toc), the language tabs of the examples through radio
   inputs.
   Nothing moves by itself and nothing fades: no transitions, no view transitions, no smooth scrolling. The header
   and the side list, which stay in place while the page scrolls, have the solid ground of the page under them.
   Nothing is masked: a glyph is a picture with its colour drawn in.
   Standalone: fonts and the logo are next to this file, nothing is fetched from another directory or site. */
@font-face{font-family:"Void Mono";font-weight:400;font-display:block;src:url(fonts/void-mono.ttf) format("truetype")}
@font-face{font-family:"Void Mono";font-weight:700;font-display:block;src:url(fonts/void-mono-bold.ttf) format("truetype")}
@font-face{font-family:"Void Mono Small";font-weight:400;font-display:block;src:url(fonts/void-mono-small.ttf) format("truetype")}
@font-face{font-family:"Void Mono Small";font-weight:700;font-display:block;src:url(fonts/void-mono-small-bold.ttf) format("truetype")}
@font-face{font-family:Inter;font-weight:300 700;font-display:swap;src:url(fonts/inter.woff2) format("woff2")}

:root{
  --bg:#0c0c0e;--p0:#09090a;--pn:#121215;--fill:#19191d;--fill2:#202025;
  --line:#222227;--line2:#34343a;
  --top:#eeeef2;--hi:#d6d6dc;--ink:#adadb5;--mute:#82828a;--faint:#696971;
  --ok:#7fc79a;--warn:#d9b06a;--bad:#e07a7a;
  --w:1240px;--gut:32px;--headh:56px;--side:264px;--pad:16px;--h:36px;
  --ff:"Void Mono",ui-monospace,monospace;
  --ff-s:"Void Mono Small","Void Mono",ui-monospace,monospace;
  --ff-c:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  /* blocks of code: whatever ordinary monospace the system has, smoothed as the system smooths it. no file is shipped for it */
  --ff-m:ui-monospace,"Cascadia Mono","Cascadia Code",Consolas,"SF Mono",Menlo,"DejaVu Sans Mono",monospace;
  /* the small label: 11 px, bold, capitals, one pixel apart */
  --lbl:700 11px/18px var(--ff-s);
  /* 12 x 12 glyphs of the cabinet (infra/site-next/panel/p5-src/icons/px.py). each is a picture with its colour drawn in:
     --d-* dim, --b-* bright (the section being read, a tile under the pointer), --h-* and --k-* on the header buttons,
     --u-* on the row that folds the list of sections */
  --d-bolt:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%23696971' d='M6 0h3v1h-1v1h-1v1h-1v1h4v1h-2v1h-1v1h-1v1h-1v1h-1v1h-1v1h-1v-3h1v-1h1v-1h1v-1h-3v-1h1v-1h1v-1h1v-1h1z'/%3E%3C/svg%3E");
  --d-terminal:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%23696971' d='M0 1h12v8h-12zM1 2v6h10v-6zM2 3h1v1h1v1h-1v1h-1v-1h1v-1h-1zM6 6h4v1h-4z'/%3E%3C/svg%3E");
  --d-key:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%23696971' d='M1 3h4v1h1v1h6v1h-1v2h-1v-2h-1v2h-1v-2h-2v1h-1v1h-4v-1h-1v-3h1zM1 4v3h4v-3z'/%3E%3C/svg%3E");
  --d-gear:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%23696971' d='M5 0h2v1h1v1h1v-1h2v2h-1v1h1v1h1v2h-1v1h-1v1h1v2h-2v-1h-1v1h-1v1h-2v-1h-1v-1h-1v1h-2v-2h1v-1h-1v-1h-1v-2h1v-1h1v-1h-1v-2h2v1h1v-1h1zM4 3v1h-1v4h1v1h4v-1h1v-4h-1v-1z'/%3E%3C/svg%3E");
  --d-warn:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%23696971' d='M5 0h2v2h1v2h1v2h1v2h1v2h1v2h-12v-2h1v-2h1v-2h1v-2h1v-2h1zM5 2v2h2v-2zM4 4v2h-1v2h-1v2h-1v1h10v-1h-1v-2h-1v-2h-1v-2h-1v4h-2v-4zM5 9h2v1h-2z'/%3E%3C/svg%3E");
  --d-hourglass:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%23696971' d='M0 0h12v1h-1v2h-1v1h-1v1h-1v2h1v1h1v1h1v2h1v1h-12v-1h1v-2h1v-1h1v-1h1v-2h-1v-1h-1v-1h-1v-2h-1zM2 1v2h1v1h1v-1h4v1h1v-1h1v-2zM4 4v1h1v-1zM7 4v1h1v-1zM5 5v2h-1v1h-1v1h-1v2h1v-1h1v-1h1v-1h2v1h1v1h1v1h1v-2h-1v-1h-1v-1h-1v-2z'/%3E%3C/svg%3E");
  --d-profile:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%23696971' d='M4 0h4v1h1v3h-1v1h-4v-1h-1v-3h1zM4 1v3h4v-3zM2 6h8v1h1v1h1v4h-12v-4h1v-1h1zM2 7v1h-1v3h10v-3h-1v-1z'/%3E%3C/svg%3E");
  --d-cart:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%23696971' d='M0 1h2v2h9v2h-1v2h-1v1h-7v1h9v1h-1v2h-2v-2h-4v2h-2v-2h-1v-8h-1zM2 4v3h7v-2h1v-1z'/%3E%3C/svg%3E");
  --d-domain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%23696971' d='M3 0h5v1h2v2h1v5h-1v2h-2v1h-5v-1h-2v-2h-1v-5h1v-2h2zM3 1v1h-1v1h-1v2h2v-2h1v-2zM5 1v2h-1v2h3v-2h-1v-2zM7 1v2h1v2h2v-2h-1v-1h-1v-1zM1 6v2h1v1h1v1h1v-2h-1v-2zM4 6v2h1v2h1v-2h1v-2zM8 6v2h-1v2h1v-1h1v-1h1v-2z'/%3E%3C/svg%3E");
  --d-waiting:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%23696971' d='M4 0h4v1h2v1h1v2h1v4h-1v2h-1v1h-2v1h-4v-1h-2v-1h-1v-2h-1v-4h1v-2h1v-1h2zM4 1v1h-2v2h-1v4h1v2h2v1h4v-1h2v-2h1v-4h-1v-2h-2v-1zM5 3h1v3h3v1h-4z'/%3E%3C/svg%3E");
  --d-cloud:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%23696971' d='M5 2h4v1h1v1h1v1h1v3h-1v1h-10v-1h-1v-3h1v-1h3v-1h1zM5 3v1h-1v1h-3v3h10v-3h-1v-1h-1v-1z'/%3E%3C/svg%3E");
  --d-server:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%23696971' d='M0 0h12v3h-12zM1 1v1h1v-1zM4 1v1h5v-1zM10 1v1h1v-1zM0 4h12v3h-12zM1 5v1h1v-1zM4 5v1h5v-1zM10 5v1h1v-1zM0 8h12v3h-12zM1 9v1h1v-1zM4 9v1h5v-1zM10 9v1h1v-1z'/%3E%3C/svg%3E");
  --d-home:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%23696971' d='M5 0h2v1h1v1h1v1h1v1h1v1h1v1h-2v6h-8v-6h-2v-1h1v-1h1v-1h1v-1h1v-1h1zM5 1v1h-1v1h-1v1h-1v1h1v6h2v-4h2v4h2v-6h1v-1h-1v-1h-1v-1h-1v-1z'/%3E%3C/svg%3E");
  --d-bell:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%23696971' d='M5 0h2v1h1v1h1v1h1v4h1v1h1v1h-12v-1h1v-1h1v-4h1v-1h1v-1h1zM4 2v1h-1v4h-1v1h8v-1h-1v-4h-1v-1zM4 10h4v1h-1v1h-2v-1h-1z'/%3E%3C/svg%3E");
  --d-pending:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%23696971' d='M2 0h7v1h1v10h-8zM3 1v9h6v-8h-1v-1zM4 3h4v1h-4zM4 5h4v1h-4zM4 7h3v1h-3z'/%3E%3C/svg%3E");
  --d-flag:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%23696971' d='M2 0h1v1h3v1h5v5h-5v-1h-3v5h1v1h-3v-1h1zM3 2v3h3v1h4v-3h-4v-1z'/%3E%3C/svg%3E");
  --d-info:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%23696971' d='M4 0h4v1h2v1h1v2h1v4h-1v2h-1v1h-2v1h-4v-1h-2v-1h-1v-2h-1v-4h1v-2h1v-1h2zM4 1v1h-2v2h-1v4h1v2h2v1h4v-1h2v-2h1v-4h-1v-2h-2v-1zM5 2h2v2h-2zM5 5h2v4h-2z'/%3E%3C/svg%3E");
  --d-menu:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%23696971' d='M0 2h2v1h-2zM3 2h9v1h-9zM0 5h2v1h-2zM3 5h9v1h-9zM0 8h2v1h-2zM3 8h9v1h-9z'/%3E%3C/svg%3E");
  --d-dot:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%23696971' d='M5 5h2v2h-2z'/%3E%3C/svg%3E");
  --b-bolt:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%23eeeef2' d='M6 0h3v1h-1v1h-1v1h-1v1h4v1h-2v1h-1v1h-1v1h-1v1h-1v1h-1v1h-1v-3h1v-1h1v-1h1v-1h-3v-1h1v-1h1v-1h1v-1h1z'/%3E%3C/svg%3E");
  --b-domain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%23eeeef2' d='M3 0h5v1h2v2h1v5h-1v2h-2v1h-5v-1h-2v-2h-1v-5h1v-2h2zM3 1v1h-1v1h-1v2h2v-2h1v-2zM5 1v2h-1v2h3v-2h-1v-2zM7 1v2h1v2h2v-2h-1v-1h-1v-1zM1 6v2h1v1h1v1h1v-2h-1v-2zM4 6v2h1v2h1v-2h1v-2zM8 6v2h-1v2h1v-1h1v-1h1v-2z'/%3E%3C/svg%3E");
  --b-cloud:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%23eeeef2' d='M5 2h4v1h1v1h1v1h1v3h-1v1h-10v-1h-1v-3h1v-1h3v-1h1zM5 3v1h-1v1h-3v3h10v-3h-1v-1h-1v-1z'/%3E%3C/svg%3E");
  --b-server:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%23eeeef2' d='M0 0h12v3h-12zM1 1v1h1v-1zM4 1v1h5v-1zM10 1v1h1v-1zM0 4h12v3h-12zM1 5v1h1v-1zM4 5v1h5v-1zM10 5v1h1v-1zM0 8h12v3h-12zM1 9v1h1v-1zM4 9v1h5v-1zM10 9v1h1v-1z'/%3E%3C/svg%3E");
  --b-home:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%23eeeef2' d='M5 0h2v1h1v1h1v1h1v1h1v1h1v1h-2v6h-8v-6h-2v-1h1v-1h1v-1h1v-1h1v-1h1zM5 1v1h-1v1h-1v1h-1v1h1v6h2v-4h2v4h2v-6h1v-1h-1v-1h-1v-1h-1v-1z'/%3E%3C/svg%3E");
  --b-bell:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%23eeeef2' d='M5 0h2v1h1v1h1v1h1v4h1v1h1v1h-12v-1h1v-1h1v-4h1v-1h1v-1h1zM4 2v1h-1v4h-1v1h8v-1h-1v-4h-1v-1zM4 10h4v1h-1v1h-2v-1h-1z'/%3E%3C/svg%3E");
  --b-info:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%23eeeef2' d='M4 0h4v1h2v1h1v2h1v4h-1v2h-1v1h-2v1h-4v-1h-2v-1h-1v-2h-1v-4h1v-2h1v-1h2zM4 1v1h-2v2h-1v4h1v2h2v1h4v-1h2v-2h1v-4h-1v-2h-2v-1zM5 2h2v2h-2zM5 5h2v4h-2z'/%3E%3C/svg%3E");
  --h-pending:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%23d6d6dc' d='M2 0h7v1h1v10h-8zM3 1v9h6v-8h-1v-1zM4 3h4v1h-4zM4 5h4v1h-4zM4 7h3v1h-3z'/%3E%3C/svg%3E");
  --h-terminal:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%23d6d6dc' d='M0 1h12v8h-12zM1 2v6h10v-6zM2 3h1v1h1v1h-1v1h-1v-1h1v-1h-1zM6 6h4v1h-4z'/%3E%3C/svg%3E");
  --h-menu:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%23d6d6dc' d='M0 2h2v1h-2zM3 2h9v1h-9zM0 5h2v1h-2zM3 5h9v1h-9zM0 8h2v1h-2zM3 8h9v1h-9z'/%3E%3C/svg%3E");
  --k-tg:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%230c0c0e' d='M10 0h2v2h-1v3h-1v3h-1v3h-5v-3h-1v-1h-2v-1h-1v-1h2v-1h2v-1h2v-1h2v-1h2zM8 2v1h1v-1zM6 3v1h-2v1h-2v1h1v1h2v-1h1v-1h1v-1h1v-1zM9 3v1h-1v1h-1v1h-1v1h-1v3h3v-2h1v-3h1v-2z'/%3E%3C/svg%3E");
  --u-plus:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%2382828a' d='M5 1h2v4h4v2h-4v4h-2v-4h-4v-2h4z'/%3E%3C/svg%3E");
  --u-cross:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%2382828a' d='M1 1h2v1h1v1h1v1h2v-1h1v-1h1v-1h2v1h-1v1h-1v1h-1v1h-1v2h1v1h1v1h1v1h1v1h-2v-1h-1v-1h-1v-1h-2v1h-1v1h-1v1h-2v-1h1v-1h1v-1h1v-1h1v-2h-1v-1h-1v-1h-1v-1h-1z'/%3E%3C/svg%3E");
  color-scheme:dark;
}
:root:lang(ru){--ff-c:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}

*,*::before,*::after{box-sizing:border-box}
html{background:var(--bg);scroll-padding-top:calc(var(--headh) + 20px);-webkit-text-size-adjust:100%;scrollbar-color:var(--line2) transparent;scrollbar-width:thin}
body{margin:0;min-height:100dvh;display:flex;flex-direction:column;background:var(--bg);color:var(--ink);
  font:700 16px/26px var(--ff);-webkit-font-smoothing:none;font-variant-numeric:tabular-nums;-webkit-tap-highlight-color:transparent}
h1,h2,h3,h4,p,ul,ol{margin:0}
a{color:inherit;text-decoration:none}
b,strong{font-weight:700;color:var(--hi)}
i{font-style:normal}
img{max-width:100%}
::selection{background:var(--ink);color:var(--bg)}
:focus{outline:none}
:focus-visible{outline:1px solid var(--hi);outline-offset:3px}
.wrap{width:100%;max-width:var(--w);margin:0 auto;padding:0 var(--gut)}

/* one glyph to a section, picked by the address a link leads to */
#quickstart,.toc a[href$="#quickstart"]{--d:var(--d-bolt)}
#example,.toc a[href$="#example"]{--d:var(--d-terminal)}
#auth,.toc a[href$="#auth"]{--d:var(--d-key)}
#conventions,.toc a[href$="#conventions"]{--d:var(--d-gear)}
#errors,.toc a[href$="#errors"]{--d:var(--d-warn)}
#limits,.toc a[href$="#limits"]{--d:var(--d-hourglass)}
#account,.toc a[href$="#account"]{--d:var(--d-profile)}
#availability,.toc a[href$="#availability"]{--d:var(--d-cart)}
#domains,.toc a[href$="#domains"]{--d:var(--d-domain)}
#renewal,.toc a[href$="#renewal"]{--d:var(--d-waiting)}
#cloudflare,.toc a[href$="#cloudflare"]{--d:var(--d-cloud)}
#servers,.toc a[href$="#servers"]{--d:var(--d-server)}
#hosting,.toc a[href$="#hosting"]{--d:var(--d-home)}
#webhooks,.toc a[href$="#webhooks"]{--d:var(--d-bell)}
#objects,.toc a[href$="#objects"]{--d:var(--d-pending)}
#roadmap,.toc a[href$="#roadmap"]{--d:var(--d-flag)}
.toc a[href="/openapi.json"]{--d:var(--d-pending)}
.toc a[href="/docs/"],.toc a[href="/docs/ru/"]{--d:var(--d-menu)}
:is(.toc,.category-nav,.overview-grid) a[href*="/getting-started/"]{--d:var(--d-bolt);--b:var(--b-bolt)}
:is(.toc,.category-nav,.overview-grid) a[href*="/domains/"]{--d:var(--d-domain);--b:var(--b-domain)}
:is(.toc,.category-nav,.overview-grid) a[href*="/cloudflare/"]{--d:var(--d-cloud);--b:var(--b-cloud)}
:is(.toc,.category-nav,.overview-grid) a[href*="/servers/"]{--d:var(--d-server);--b:var(--b-server)}
:is(.toc,.category-nav,.overview-grid) a[href*="/hosting/"]{--d:var(--d-home);--b:var(--b-home)}
:is(.toc,.category-nav,.overview-grid) a[href*="/webhooks/"]{--d:var(--d-bell);--b:var(--b-bell)}
:is(.toc,.category-nav,.overview-grid) a[href*="/reference/"]{--d:var(--d-info);--b:var(--b-info)}

/* the glyph of a header button */
.ic{display:inline-block;flex:none;width:12px;height:12px;background:var(--g) center/100% 100% no-repeat}
.i-tg{--g:var(--k-tg)}.i-doc{--g:var(--h-pending)}.i-terminal{--g:var(--h-terminal)}.i-menu{--g:var(--h-menu)}

/* ---------- what is read at length ---------- */
.lede,.tile p,.tile li,td,.note,.overview-card>span:not(.overview-index){
  font:400 15px/24px var(--ff-c);letter-spacing:0;font-variant-numeric:normal;-webkit-font-smoothing:antialiased;text-wrap:pretty}
.lede b,.tile p b,.tile li b,td b,.note b{font-weight:600;color:var(--hi)}
.lede a,.tile p a,.tile li a,td a,.note a,pre a{color:var(--hi);text-decoration:underline dotted;text-decoration-color:var(--faint);text-underline-offset:4px;text-decoration-thickness:1px}
.lede a:hover,.tile p a:hover,.tile li a:hover,td a:hover,.note a:hover,pre a:hover{color:var(--top);text-decoration-color:var(--mute)}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:var(--h);padding:0 14px;white-space:nowrap;
  border:1px solid var(--line2);color:var(--hi);background:none}
.btn:hover{border-color:var(--mute);color:var(--top)}
.btn.pri{background:var(--hi);border-color:var(--hi);color:var(--bg)}
.btn.pri:hover{background:var(--top);border-color:var(--top);color:var(--bg)}
.btn:active{transform:translateY(1px)}
.btn .ic{display:none}

/* ---------- header: the logo, what this is, the sections, the other language, the ways out ---------- */
.top{position:sticky;top:0;z-index:50;flex:none;height:var(--headh);background:var(--bg);border-bottom:1px solid var(--line)}
.top-in{display:flex;align-items:center;gap:20px;height:100%;max-width:var(--w);margin:0 auto;padding:0 var(--gut)}
.logo{display:block;flex:none;line-height:0}
.logo img{display:block}
.tag{flex:none;margin-left:-8px;padding:2px 8px 1px;border:1px solid var(--line2);font:var(--lbl);letter-spacing:1px;text-transform:uppercase;color:var(--mute)}
a.tag:hover{color:var(--top);border-color:var(--mute)}
.top-r{display:flex;align-items:center;gap:12px;flex:none;margin-left:auto}
/* the two languages: the one being read is pressed, the other is a link */
.lang{display:inline-flex;flex:none;height:var(--h);border:1px solid var(--line2);font:var(--lbl);letter-spacing:1px;text-transform:uppercase}
.lang>*{display:flex;align-items:center;padding:1px 9px 0 10px;color:var(--mute)}
.lang>*+*{border-left:1px solid var(--line2)}
.lang>b{background:var(--fill2);color:var(--top);box-shadow:inset 0 -1px 0 var(--top)}
.lang>a:hover{color:var(--top);background:var(--fill)}
.to-toc{display:none}
/* the sections of the documentation: a framed strip in the header where there is room for it, each section with its glyph.
   the page is as wide as it was before the glyphs came, so the strip is set tighter to hold them: its words stand
   without the extra pixel between letters and closer to their neighbours */
.category-nav{display:none;flex:none;margin-left:auto;padding:0 3px;border:1px solid var(--line2);font:var(--lbl);letter-spacing:0;text-transform:uppercase}
.category-nav a{display:flex;align-items:center;gap:5px;height:calc(var(--h) - 2px);padding:1px 4px 0;color:var(--mute)}
.category-nav a::before{content:"";flex:none;width:12px;height:12px;margin-top:-1px;background:var(--d) center/12px 12px no-repeat}
.category-nav a:hover{color:var(--top);background:var(--fill)}
.category-nav a.active{background:var(--fill2);color:var(--top);box-shadow:inset 0 -1px 0 var(--top)}
.category-nav a:hover::before,.category-nav a.active::before{background-image:var(--b)}
@media (min-width:1280px){
  .category-nav{display:flex}
  /* a section page lists the sections in its side column */
  .category-page .category-nav{display:none}
}

/* ---------- page ---------- */
main{flex:1}
main>.wrap{padding-top:48px;padding-bottom:80px}
.hero{margin-bottom:40px}
.hero h1{font:700 32px/38px var(--ff);color:var(--top)}
.hero h1 span{color:var(--mute)}
.hero .lede{margin-top:14px;max-width:720px;font-size:16px;line-height:26px}
.facts{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.fact{max-width:100%;padding:4px 10px 3px;border:1px solid var(--line2);background:var(--pn);font:400 11px/18px var(--ff-s);color:var(--hi);overflow-wrap:anywhere}

.grid{display:grid;grid-template-columns:var(--side) minmax(0,1fr);gap:40px;align-items:start}

/* ---------- side column: the list of sections ---------- */
/* its words stand on the left edge of the page, as the cabinet's menu stands under its logo; the frame of the chosen section reaches into the margin.
   it stays in place while the page scrolls, so it has the ground of the page under it. when it is longer than the
   window it scrolls on its own and draws no scroll bar: a bar is as wide as the system makes it (nothing to 17px),
   and a name that fits its line on one machine would break on another */
.toc{position:sticky;top:calc(var(--headh) + 24px);max-height:calc(100dvh - var(--headh) - 48px);overflow:auto;display:flex;flex-direction:column;gap:2px;margin-left:-13px;
  background:var(--bg);scrollbar-width:none;-ms-overflow-style:none}
.toc::-webkit-scrollbar{display:none}
.toc .h{display:block;padding:18px 12px 6px;font:var(--lbl);letter-spacing:1px;text-transform:uppercase;color:var(--faint)}
.toc>.h:first-of-type,.toc-categories>.h{padding-top:0}
/* an item is one line: its glyph, its name, the number of its endpoints. a name too long for the line is given a
   shorter one in the list of the two sources (build-pages.py says which, if any) */
.toc a{display:flex;align-items:baseline;gap:8px;padding:3px 12px;border:1px solid transparent;color:var(--mute)}
.toc a::before{content:"";flex:none;width:12px;height:12px;background:var(--d,var(--d-dot)) center/12px 12px no-repeat}
.toc a:hover{color:var(--top)}
.toc a .n{flex:none;margin-left:auto;font:400 11px/18px var(--ff-s);color:var(--faint)}
/* the parts of a section stand under its name, with no glyph of their own */
.toc a.sub{padding:2px 12px 2px 32px;font:400 11px/18px var(--ff-s);color:var(--mute)}
.toc a.sub:hover{color:var(--top)}
.toc a.sub::before,.toc .toc-o::before,.toc .toc-c::before,.offer-page .toc a::before{display:none}
.toc-categories{display:flex;flex-direction:column;gap:2px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.toc a.cat.active{color:var(--top);border-color:var(--line2);background:var(--pn)}
.toc a.cat.active::before{background-image:var(--b)}
/* the category being read has its sections right under it (sub-links); a part of one of them steps in once more */
.toc a.sub.deep{padding-left:44px}
.toc>.toc-categories+.h{padding-top:16px}
.toc .toc-o,.toc .toc-c{display:none}

/* ---------- content: a section is a title and a column of framed panels ---------- */
.doc{display:flex;flex-direction:column;gap:64px;min-width:0}
.part{display:flex;flex-direction:column;gap:16px;min-width:0}
.part .part{margin-top:24px}
.ph{display:flex;align-items:baseline;flex-wrap:wrap;gap:2px 16px}
.ph h2{font:700 32px/38px var(--ff);color:var(--top);min-width:0;overflow-wrap:anywhere}
.ph .k{font:400 11px/18px var(--ff-s);color:var(--mute)}
.part .part>.ph h2{font:700 22px/28px var(--ff-s);color:var(--hi)}
/* a section's own glyph before its title */
:is(#quickstart,#example,#auth,#conventions,#errors,#limits,#account,#availability,#domains,#renewal,#cloudflare,#servers,#hosting,#webhooks,#objects,#roadmap)>.ph h2::before{
  content:"";display:inline-block;width:24px;height:24px;margin-right:14px;vertical-align:var(--gv,-2px);background:var(--d) center/24px 24px no-repeat}

.tile{min-width:0;padding:var(--pad);background:var(--pn);border:1px solid var(--line)}
.tile>*+*{margin-top:12px}
.tile>p,.tile>ul{max-width:760px}
.tile h4{font:var(--lbl);letter-spacing:1px;text-transform:uppercase;color:var(--mute)}
.tile>h4{margin-top:26px}
.tile>h4:first-child{margin-top:0}
.tile h4+*{margin-top:8px}
.tile ul{padding:0;list-style:none}
.tile ul:not(.cl)>li{padding-left:22px;text-indent:-22px}
.tile ul:not(.cl)>li::before{content:"—";display:inline-block;width:22px;text-indent:0;color:var(--faint)}
.tile ul:not(.cl)>li>*{text-indent:0}
.tile li+li{margin-top:4px}
.tile:target{border-color:var(--mute)}

/* inline code and code blocks: the pixel face, the regular weight */
code{font:400 16px/1 var(--ff);letter-spacing:0;font-variant-numeric:tabular-nums;-webkit-font-smoothing:none;color:var(--hi);background:var(--fill);padding:1px 4px 0;
  overflow-wrap:break-word;-webkit-box-decoration-break:clone;box-decoration-break:clone}
/* a block of code: a frame, the darker ground, and the system's ordinary monospace, smoothed.
   code shimmered green while the page scrolled. first the blocks were taken out of the layers the browser cuts a page
   into (each used to scroll sideways on its own, which made it a layer); that did not cure it, so layers were not the
   cause. what only these blocks had was a large dense field of the 11 px pixel face: hard one-pixel bright strokes on
   a near-black ground, evenly spaced because the face is monospaced. that is the suspected cause (thin bright lines
   on dark are what subpixel smoothing and an LCD panel tint in motion), and it cannot be checked from here. so a
   block of code is not set in the pixel face: 13 px of an ordinary monospace with soft edges, one step dimmer than
   before. inline code, paths and method tags keep the pixel face at 16 px, where every upright stroke is two pixels.
   long lines wrap; a block does not scroll sideways */
.codeblock{border:1px solid var(--line2)}
pre{margin:0;padding:12px 14px 13px;background:var(--p0);font:400 13px/20px var(--ff-m);font-variant-ligatures:none;font-variant-numeric:normal;letter-spacing:0;
  -webkit-font-smoothing:auto;color:var(--ink);tab-size:2;white-space:pre-wrap;overflow-wrap:anywhere}
pre code{font:inherit;font-variant-numeric:inherit;-webkit-font-smoothing:inherit;color:inherit;background:none;padding:0;overflow-wrap:inherit}
pre .c{color:var(--mute)}
/* the copy button (copy.js adds it and marks the block .with-copy; without the script neither exists). it sits in the
   block's top right corner; the first line of the code makes way for it (a float as wide as the button), so it never
   covers code, on a phone neither. the two labels of a language take the same width, so the button does not jump */
.codeblock.with-copy{position:relative;--copy-w:72px}
:lang(ru) .codeblock.with-copy{--copy-w:112px}
.codeblock.with-copy>pre::before{content:"";float:right;width:var(--copy-w);height:20px}
.code-copy{position:absolute;top:6px;right:6px;width:var(--copy-w);height:26px;padding:1px 0 0;border:1px solid var(--line2);background:var(--pn);
  font:var(--lbl);letter-spacing:1px;text-transform:uppercase;color:var(--mute);cursor:pointer;-webkit-user-select:none;user-select:none}
.code-copy:hover{border-color:var(--mute);color:var(--top)}
.code-copy:active{transform:translateY(1px)}
.code-copy:focus-visible{outline-offset:2px;color:var(--top)}
.code-copy.done{border-color:var(--hi);background:var(--hi);color:var(--bg)}
/* what the script says to a screen reader, and the field it copies through where the clipboard API is missing */
.speak,.copy-buffer{position:fixed;top:0;left:0;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;opacity:0}
pre .s{color:var(--hi)}

/* an endpoint: a strip with the method and the path, then what it does */
.tile.ep{padding-top:0}
.ep>.head{display:flex;align-items:center;flex-wrap:wrap;gap:4px 12px;min-height:44px;margin:0 calc(-1*var(--pad));padding:8px var(--pad);border-bottom:1px solid var(--line)}
.ep>.head+*{margin-top:14px}
.ep:has(>.head:last-child){padding-bottom:0}
.ep>.head:last-child{border-bottom:0}
.ep:target>.head{box-shadow:inset 3px 0 0 var(--hi)}
.p{color:var(--hi);min-width:0;overflow-wrap:anywhere}
.p i{color:var(--mute)}
.ep>.head .auth{margin-left:auto;font:400 11px/18px var(--ff-s);color:var(--mute)}
.m{display:inline-block;flex:none;width:58px;padding:1px 0 0 1px;border:1px solid var(--line2);font:var(--lbl);letter-spacing:1px;text-align:center;color:var(--hi)}
.m.post{background:var(--hi);border-color:var(--hi);color:var(--bg)}
.m.patch,.m.put{background:var(--fill2)}
.m.del{color:var(--bad);border-color:color-mix(in srgb,var(--bad) 45%,transparent)}

/* the endpoints of a group: hairline rows, each one a link */
.index{display:grid;grid-template-columns:auto auto minmax(0,1fr);column-gap:14px;border-top:1px solid var(--line)}
.index a{display:grid;grid-template-columns:subgrid;grid-column:1/-1;align-items:center;padding:8px 0;border-bottom:1px solid var(--line)}
.index a:hover{background:var(--fill);box-shadow:calc(-1*var(--pad)) 0 0 var(--fill),var(--pad) 0 0 var(--fill)}
.index a:hover .p{color:var(--top)}
.index .d{font:400 11px/18px var(--ff-s);color:var(--mute)}
.tile>.index:first-child{margin-top:calc(-1*var(--pad));border-top:0}
.tile>.index:last-child{margin-bottom:calc(-1*var(--pad))}
.tile>.index:last-child a:last-child{border-bottom:0}
@supports not (grid-template-columns:subgrid){
  .index{row-gap:8px;padding-top:8px}
  .index a{display:contents}
}

/* tables */
table{width:100%;border-collapse:collapse}
th,td{padding:8px 16px 8px 0;text-align:left;vertical-align:top;border-top:1px solid var(--line)}
th:last-child,td:last-child{padding-right:0}
th{font:var(--lbl);letter-spacing:1px;text-transform:uppercase;color:var(--mute)}
tr:first-child>*{border-top:0;padding-top:0}
td:first-child code{white-space:nowrap}
td .req{margin-left:8px;font:400 11px/18px var(--ff-s);color:var(--faint);white-space:nowrap}

.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 24px}
.two>div{min-width:0}
.two>div>*+*{margin-top:8px}

/* a remark: a bar on the left, as the cabinet's confirm block */
.note{padding:10px 14px;background:var(--fill);border-left:2px solid var(--mute)}
.tile>.note{max-width:none}
.badges{display:flex;flex-wrap:wrap;gap:6px}
.badge{padding:3px 8px 2px;border:1px solid var(--line2);font:400 11px/18px var(--ff-s);color:var(--mute)}
.badge b{color:var(--hi)}

/* example language: three radio inputs (Tab, then arrows) choose the pane; the tabs sit on the frame of the code */
.langtabs{display:flex;flex-direction:column}
.langtabs>input{flex:none;width:1px;height:1px;margin:0 0 -1px;padding:0;border:0;background:none;-webkit-appearance:none;appearance:none;pointer-events:none}
.tabs{display:inline-flex;align-self:flex-start;border:1px solid var(--line2)}
.tabs label{display:flex;align-items:center;height:32px;padding:0 13px;border-left:1px solid var(--line2);color:var(--mute);cursor:pointer}
.tabs label:first-child{border-left:0}
.tabs label:hover{color:var(--top)}
.langtabs>input:nth-of-type(1):checked~.tabs label:nth-child(1),
.langtabs>input:nth-of-type(2):checked~.tabs label:nth-child(2),
.langtabs>input:nth-of-type(3):checked~.tabs label:nth-child(3){background:var(--fill2);color:var(--top);box-shadow:inset 0 -1px 0 var(--top)}
.langtabs>input:nth-of-type(1):focus-visible~.tabs label:nth-child(1),
.langtabs>input:nth-of-type(2):focus-visible~.tabs label:nth-child(2),
.langtabs>input:nth-of-type(3):focus-visible~.tabs label:nth-child(3){outline:1px solid var(--hi);outline-offset:2px}
.langtabs>.panes{margin-top:-1px}
.langtabs>.panes>div{display:none}
.langtabs>input:nth-of-type(1):checked~.panes>div:nth-child(1),
.langtabs>input:nth-of-type(2):checked~.panes>div:nth-child(2),
.langtabs>input:nth-of-type(3):checked~.panes>div:nth-child(3){display:block}

/* numbered steps */
.steps{counter-reset:s}
.step{display:grid;grid-template-columns:40px minmax(0,1fr);padding:10px 0 11px;border-bottom:1px solid var(--line)}
.step:first-child{padding-top:0}
.step::before{counter-increment:s;content:counter(s);grid-row:1/3;align-self:start;margin-top:1px;width:24px;height:24px;padding:1px 0 0 1px;display:grid;place-items:center;
  border:1px solid var(--line2);font:700 11px/1 var(--ff-s);color:var(--hi)}
.step>*{grid-column:2}
.step b{color:var(--hi)}
.step p{margin-top:2px}

/* ---------- the first page: the sections as tiles ---------- */
.overview-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.overview-card{position:relative;display:flex;flex-direction:column;min-height:176px;padding:14px var(--pad) 12px;border:1px solid var(--line2);background:var(--pn)}
.overview-card:first-child{grid-column:1/-1;min-height:0}
.overview-card:hover{border-color:var(--mute);background:var(--fill)}
.overview-card:active{transform:translateY(1px)}
.overview-card .overview-index{font:var(--lbl);letter-spacing:1px;color:var(--faint)}
.overview-card .ic{position:absolute;right:var(--pad);top:var(--pad);width:24px;height:24px;background-image:var(--d)}
.overview-card:hover .ic{background-image:var(--b)}
.overview-card strong{margin-top:14px;font:700 32px/38px var(--ff);color:var(--top);overflow-wrap:anywhere}
.overview-card>span:not(.overview-index){margin-top:6px;max-width:420px;color:var(--mute)}
.overview-card>b{margin-top:auto;padding-top:18px;font:var(--lbl);letter-spacing:1px;text-transform:uppercase;color:var(--mute)}
.overview-card:hover>b{color:var(--top)}
/* the API for AI agents (skill.md): across the grid, after the sections, with the glyph of a terminal */
.overview-card.overview-skill{grid-column:1/-1;min-height:0;--d:var(--d-terminal);
  --b:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%23eeeef2' d='M0 1h12v8h-12zM1 2v6h10v-6zM2 3h1v1h1v1h-1v1h-1v-1h1v-1h-1zM6 6h4v1h-4z'/%3E%3C/svg%3E")}
.overview-card.overview-skill>span:not(.overview-index){max-width:760px}

/* ---------- the offer: numbered clauses in framed sections ---------- */
.offer-page .doc{gap:16px;max-width:800px}
.offer-page .tile>h2{display:flex;align-items:baseline;gap:14px;margin:calc(-1*var(--pad)) calc(-1*var(--pad)) 0;padding:9px var(--pad);border-bottom:1px solid var(--line);
  font:700 16px/26px var(--ff);color:var(--top)}
.offer-page .tile>h2 .k{flex:none;min-width:14px;font:var(--lbl);letter-spacing:1px;color:var(--faint)}
.offer-page .tile>h2+*{margin-top:14px}
.cl>li{display:grid;grid-template-columns:36px minmax(0,1fr);gap:8px}
.cl>li>.n{padding-top:3px;font:400 11px/18px var(--ff-s);font-variant-numeric:tabular-nums;-webkit-font-smoothing:none;color:var(--faint)}
.cl li ul{margin-top:4px}
.offer-page .tile>ul:not(.cl){padding-left:44px}
.offer-page .toc a{gap:10px}
.offer-page .toc a .n{margin-left:0;min-width:14px}
.offer-page th{width:34%;padding-right:16px;white-space:normal}

/* ---------- foot ---------- */
.foot{flex:none;border-top:1px solid var(--line);color:var(--mute)}
.foot .wrap{display:flex;align-items:center;flex-wrap:wrap;gap:12px 24px;padding-top:26px;padding-bottom:34px;font:400 11px/18px var(--ff-s)}
.foot .logo{margin-right:8px}
.foot a:hover{color:var(--top)}
.foot .end{margin-left:auto;color:var(--faint)}

/* ---------- no room for the side column (tablet, phone): the list of sections folds into one row above the text ---------- */
@media (max-width:1023px){
  .grid{grid-template-columns:minmax(0,1fr);gap:28px}
  body:has(.toc) .to-toc{display:inline-flex}
  .toc{position:static;max-height:none;overflow:visible;gap:0;margin-left:0;padding:0 var(--pad);background:var(--pn);border:1px solid var(--line2)}
  .toc:not(:target)>*{display:none}
  .toc:not(:target)>.toc-o,.toc:target>.toc-c{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:46px;padding:0;border:0;color:var(--hi)}
  .toc>.toc-o::after,.toc>.toc-c::after{content:"";flex:none;width:12px;height:12px;background:var(--u-plus) center/12px 12px no-repeat}
  .toc>.toc-c::after{background-image:var(--u-cross)}
  .toc:target{padding-bottom:10px}
  .toc:target>.toc-c{border-bottom:1px solid var(--line);margin-bottom:12px}
  .toc a{padding:6px 0;border:0}
  .toc .h{padding-left:0;padding-right:0}
  .toc a.sub{padding:5px 0 5px 20px}
  .toc a.sub.deep{padding-left:32px}
  /* the chosen section: a bar on the edge of the list; its glyph stays in the column of the others */
  .toc a.cat.active{background:none;margin-left:calc(-1*var(--pad));padding-left:calc(var(--pad) - 2px);border-left:2px solid var(--top)}
  .toc-categories{padding-bottom:12px}
  .toc-categories>.h,.offer-page .toc>.h{display:none}
}

/* the buttons of the header fold to their glyphs before the header runs out of room */
@media (max-width:860px){
  .top-r .btn{width:var(--h);padding:0}
  .top-r .btn span{display:none}
  .top-r .btn .ic{display:block}
}

/* ---------- phone: panels run edge to edge, titles step down a size ---------- */
@media (max-width:760px){
  :root{--gut:16px}
  main>.wrap{padding-top:28px;padding-bottom:56px}
  .hero{margin-bottom:28px}
  .hero h1 span{display:block;margin-top:8px;font-size:16px;line-height:26px}
  .top-in{gap:10px}
  .tag{margin-left:0;padding-left:6px;padding-right:5px}
  .lang>*{padding-left:8px;padding-right:7px}
  .top-r{gap:8px}
  .doc{gap:48px}
  .ph h2{font:700 22px/28px var(--ff-s)}
  .ph{--gv:-5px}
  .part .part>.ph h2{font:700 16px/26px var(--ff);color:var(--hi)}
  .tile,.toc{margin-left:calc(-1*var(--gut));margin-right:calc(-1*var(--gut));border-left:0;border-right:0}
  .two{grid-template-columns:minmax(0,1fr)}
  .tile>table,.two table{display:block;overflow-x:auto;background:var(--pn)}
  .index{grid-template-columns:auto minmax(0,1fr)}
  .index a{align-items:start;padding:8px 0}
  .index .m{margin-top:3px}
  .index .d{grid-column:2}
  .ep>.head .auth{flex:1 1 100%;margin-left:0}
  .overview-grid{grid-template-columns:minmax(0,1fr)}
  .overview-card{min-height:0}
  .overview-card strong{font-size:32px}
  .cl>li{grid-template-columns:32px minmax(0,1fr);gap:6px}
  .offer-page .tile>ul:not(.cl){padding-left:38px}
  .offer-page th{width:auto}
  .foot .end{margin-left:0;flex:1 1 100%}
}
@media (min-width:761px) and (max-width:1023px){
  .overview-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
/* a phone has no room for the link to openapi.json in the header; it stays in the section list and in the text */
@media (max-width:420px){
  .top-r .btn:not(.pri):not(.to-toc){display:none}
}
@media (max-width:359px){
  .tag{display:none}
}

/* on paper: the cabinet's light palette, the text without the navigation */
@media print{
  :root{--bg:#fff;--p0:#f4f2ec;--pn:#fff;--fill:#eeece6;--fill2:#e4e1d9;--line:#d3d0c8;--line2:#b3b0a8;
    --top:#000;--hi:#141416;--ink:#2b2b2e;--mute:#55534e;--faint:#6f6d67;--bad:#a23a3a;color-scheme:light}
  .top,.toc,.foot .logo,.code-copy{display:none}
  .codeblock.with-copy>pre::before{display:none}
  .grid{display:block}
  .tile{break-inside:avoid}
}