/* Design tokens lifted from syntology.ai so comms reads as the same company.
   The site sets these inline on :root rather than in a stylesheet; they are
   restated here so a change there is a deliberate change here, not a drift. */
:root{
  --paper:#fcfcfa; --ink:#14161a; --ink-2:#454a52; --ink-3:#7b8189;
  --rule:#d8d5cd; --accent:#8a3324;        /* oxblood: used once per page */
  --code-bg:#f4f3ef;
  --serif:Fraunces,Georgia,"Times New Roman",serif;
  --sans:"Public Sans",system-ui,-apple-system,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,monospace;
}
/* A single-theme commitment: this is a publication, and the oxblood-on-paper
   palette is the identity. Everything is painted explicitly so it holds on any
   host background rather than borrowing one. */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);
     font-weight:300;font-size:16px;line-height:1.68;
     -webkit-font-smoothing:antialiased}
a{color:var(--accent)}
.wrap{max-width:720px;margin:0 auto;padding:0 22px}
header.site{border-bottom:1px solid var(--rule);margin-bottom:46px}
header.site .wrap{display:flex;justify-content:space-between;align-items:baseline;
                  padding-top:22px;padding-bottom:16px}
header.site a.brand{font-family:var(--serif);font-weight:600;font-size:19px;
                    color:var(--ink);text-decoration:none;letter-spacing:-.01em}
header.site nav a{font-size:13px;color:var(--ink-3);text-decoration:none;margin-left:18px}
header.site nav a:hover{color:var(--accent)}
.kicker{font-size:11px;letter-spacing:.2em;text-transform:uppercase;
        color:var(--accent);font-weight:600}
h1.title{font-family:var(--serif);font-weight:600;font-size:clamp(30px,5vw,40px);
         line-height:1.13;margin:12px 0 10px;letter-spacing:-.016em;text-wrap:balance}
.dek{font-family:var(--serif);font-style:italic;font-weight:300;
     font-size:clamp(17px,2.4vw,19px);color:var(--ink-2);margin:0 0 20px;
     max-width:54ch;line-height:1.45}
.byline{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
        padding:9px 0;font-size:12px;color:var(--ink-3);display:flex;gap:18px;
        flex-wrap:wrap;letter-spacing:.02em;margin-bottom:28px}
article p{margin:0 0 15px;max-width:64ch}
article h2{font-family:var(--serif);font-weight:600;font-size:23px;margin:32px 0 10px;
           letter-spacing:-.01em;text-wrap:balance}
article strong{font-weight:600}
article blockquote{border-left:3px solid var(--accent);margin:22px 0;
                   padding:2px 0 2px 18px;font-family:var(--serif);font-style:italic;
                   font-size:19px;color:var(--ink);max-width:48ch;line-height:1.42}
article blockquote p{margin:0}
article pre{background:var(--code-bg);border:1px solid var(--rule);border-radius:6px;
            padding:14px 16px;overflow-x:auto;font-family:var(--mono);font-size:13px;
            line-height:1.55}
article :not(pre)>code{font-family:var(--mono);font-size:13.5px;
                       background:var(--code-bg);padding:1px 5px;border-radius:3px}
article table{border-collapse:collapse;width:100%;font-size:14px;margin:18px 0}
article th{text-align:left;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;
           text-transform:uppercase;color:var(--ink-3);font-weight:500;
           border-bottom:1px solid var(--rule);padding:9px 12px}
article td{padding:8px 12px;border-bottom:1px solid var(--code-bg);
           font-variant-numeric:tabular-nums}
.scroll{overflow-x:auto}
.evidence{margin-top:40px;border-top:1px solid var(--rule);padding-top:18px}
.evidence h3{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;
             text-transform:uppercase;color:var(--ink-3);font-weight:500;margin:0 0 10px}
.evidence ul{margin:0;padding-left:18px;font-size:14px;color:var(--ink-2);
             display:flex;flex-direction:column;gap:6px}
.index-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column}
.index-list li{border-bottom:1px solid var(--rule);padding:22px 0}
.index-list li:first-child{padding-top:0}
.index-list a{text-decoration:none;color:inherit;display:block}
.index-list h2{font-family:var(--serif);font-weight:600;font-size:22px;margin:6px 0 6px;
               line-height:1.24;letter-spacing:-.012em;color:var(--ink);text-wrap:balance}
.index-list a:hover h2{color:var(--accent)}
.index-list .dek{font-size:16px;margin:0;max-width:58ch}
.index-list .when{font-family:var(--mono);font-size:11px;color:var(--ink-3);
                  letter-spacing:.04em}
footer.site{margin-top:70px;border-top:1px solid var(--rule)}
footer.site .wrap{padding:20px 22px 50px;font-size:12.5px;color:var(--ink-3);
                  display:flex;gap:18px;flex-wrap:wrap}
footer.site a{color:var(--ink-3)}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ---- docs chrome: sidebar + content, sharing the publication's tokens ---- */
.docs{display:grid;grid-template-columns:232px 1fr;gap:44px;align-items:start;
      max-width:1040px;margin:0 auto;padding:0 22px}
.sidebar{position:sticky;top:26px;font-size:13.5px;line-height:1.5;
         max-height:calc(100vh - 52px);overflow-y:auto}
.sidebar section{margin-bottom:22px}
.sidebar h4{font-family:var(--mono);font-size:10px;letter-spacing:.14em;
            text-transform:uppercase;color:var(--ink-3);font-weight:500;
            margin:0 0 8px}
.sidebar a{display:block;color:var(--ink-2);text-decoration:none;padding:3px 0}
.sidebar a:hover{color:var(--accent)}
.sidebar a[aria-current="page"]{color:var(--accent);font-weight:600}
.docs-body h1{font-family:var(--serif);font-weight:600;font-size:clamp(27px,4vw,34px);
              line-height:1.16;margin:0 0 18px;letter-spacing:-.015em;text-wrap:balance}
.docs-body{min-width:0}
.docs-body table{display:block;overflow-x:auto;white-space:nowrap}
@media (max-width:820px){
  .docs{grid-template-columns:1fr;gap:26px}
  .sidebar{position:static;max-height:none;border-bottom:1px solid var(--rule);
           padding-bottom:16px}
}