/* =====================================================================
   site.css: Agora docs in the pluralis.ai house style.
   The homepage idiom (PluralisResearch.github.io app/globals.css,
   .site-banner + .homepage) applied to MkDocs Material 9.7.6.

   Load order (mkdocs.yml extra_css):
     site.css -> diagrams.css (FROZEN) -> diagram-freeze.css (FROZEN, last)

   House rules for this file
   1. New tokens only (--site-*). Never define or redefine --p-*, --c-*,
      --radius* (the diagram tokens live in diagrams.css).
   2. No font / paint declarations on *, svg, text, g, rect, path, ...;
      no zoom / transform / filter / opacity / contain / container-type on
      any ancestor of a figure (html, body, .md-container, .md-main,
      .md-content, article).
   3. Write px. html is 16px here; Material's rem values assume 20px.
   4. Section 3 (column geometry) sizes the diagrams: do not touch.
   5. Rules marked LOAD-BEARING exist for diagram raster parity; keep them.

   Part 1 = chrome (sections 1-9, 11-13). Part 2 = article (section 10).
   ===================================================================== */

/* ===================== PART 1: CHROME ============================== */

/* 1. Tokens ---------------------------------------------------------- */
:root {
  --site-serif: Times, "Times New Roman", serif;          /* = pluralis.ai --serif; no web font */
  --site-mono: "SF Mono", Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;

  --site-ink: #111;                       /* headings, wordmark, current item (homepage --ink) */
  --site-text: #0d0f12;                   /* nav links, UI text (homepage --text-color) */
  --site-prose: rgba(13, 15, 18, 0.95);   /* body copy, ~#191b1e (homepage .homepage p) */
  --site-soft: rgba(13, 15, 18, 0.85);    /* lede, callout body, ~#313336 (homepage epigraph) */
  --site-label: rgba(0, 0, 0, 0.7);       /* small-caps labels, ~#4d4d4d (homepage h2) */
  --site-byline: rgba(0, 0, 0, 0.68);     /* italic meta, ~#525252 (homepage .paper-authors) */
  --site-meta: rgba(0, 0, 0, 0.62);       /* idle nav, breadcrumb, ~#616161 (homepage .paper-venue) */
  --site-faint: rgba(0, 0, 0, 0.45);      /* separators, permalinks, icons */
  --site-rule: rgba(0, 0, 0, 0.08);       /* hairlines, ~#ebebeb (homepage section rule) */
  --site-line: #e2e2e2;                   /* borders of media and panels (homepage --rule) */
  --site-code-bg: #f8f8f8;                /* blog .code-block */
  --site-gold: #96700f;                   /* the ONLY accent: "you are here" dot (blog TOC) */

  --site-bar-h: 52px;                     /* sticky docs bar (integer: keeps sub-pixel phase) */
  --site-rail-top: calc(var(--site-bar-h) + 32px);
  --site-gap: 27.2px;                     /* homepage section padding (1.7rem) */
}
@media screen and (max-width: 76.2344em) { :root { --site-bar-h: 48px; } }
@media (max-width: 600px) { :root { --site-gap: 25.6px; } }

/* Material variables -> house palette. body[...] beats palette.css's
   [data-md-color-primary=white] (indigo #4051b5) and Material's
   [data-md-color-scheme=default] block, which both sit on <body>. */
body[data-md-color-primary] {
  --md-default-fg-color: #0d0f12;
  --md-default-fg-color--light: rgba(0, 0, 0, 0.62);
  --md-default-fg-color--lighter: rgba(0, 0, 0, 0.35);
  --md-default-fg-color--lightest: rgba(0, 0, 0, 0.08);
  --md-default-bg-color: #fff;
  --md-primary-fg-color: #fff;
  --md-primary-fg-color--dark: #fff;
  --md-primary-bg-color: #0d0f12;
  --md-primary-bg-color--light: rgba(0, 0, 0, 0.45);
  --md-accent-fg-color: #000;
  --md-accent-fg-color--transparent: rgba(0, 0, 0, 0.025);
  --md-typeset-a-color: #111;
  --md-typeset-mark-color: rgba(0, 0, 0, 0.06);
  --md-text-font-family: var(--site-serif);
  --md-code-font-family: var(--site-mono);
  --md-code-fg-color: #333;
  --md-code-bg-color: var(--site-code-bg);
  /* blog .code-block palette */
  --md-code-hl-comment-color: #6a737d;
  --md-code-hl-keyword-color: #cf222e;    /* blog #d73a49 is 4.31:1 on #f8f8f8; this is 5.04:1 (AA) */
  --md-code-hl-function-color: #6f42c1;
  --md-code-hl-string-color: #032f62;
  --md-code-hl-number-color: #005cc5;
  --md-code-hl-constant-color: #005cc5;
  --md-code-hl-special-color: #cf222e;
  --md-code-hl-name-color: #333;
  --md-code-hl-variable-color: #b35000;   /* blog #e36209 is 3.29:1; this is 4.87:1 (AA) */
  --md-code-hl-operator-color: #333;
  --md-code-hl-punctuation-color: #333;
  --md-code-hl-generic-color: #6a737d;
  --md-shadow-z3: 0 12px 32px rgba(0, 0, 0, 0.07);
}

/* 2. Base ------------------------------------------------------------ */
html {
  font-size: 16px;                        /* LOAD-BEARING: rem maths of the column */
  scroll-behavior: smooth;
  scrollbar-gutter: stable;               /* LOAD-BEARING: phone figure width */
}
/* Anchor and focus targets clear the sticky bar. The offset sits on the
   targets (scroll-margin), NOT on html (scroll-padding): with a sticky bar
   a scroll-padding also scrolls the page up whenever focus enters the bar
   ('/', 's', Shift+Tab). Beats Material's .md-typeset :target margin, so a
   jump lands 24px under the bar. Figures are excluded (frozen). */
.md-content :is([id], a[href], summary, button, input, [tabindex]):not(.agora-figure, .agora-figure *) {
  scroll-margin-top: calc(var(--site-bar-h) + 24px);
}
/* clip (not hidden): no horizontal page scroll AND position:sticky works.
   The first declaration is the fallback for browsers without clip. */
html, body { max-width: 100vw; overflow-x: hidden; overflow-x: clip; }
body {
  background: #fff;                       /* white canvas behind the figures */
  color: var(--site-text);
  font-family: var(--site-serif);
  -webkit-font-smoothing: antialiased;
}
.md-typeset { font-family: var(--site-serif); }

/* 3. Column geometry: FROZEN width contract (sizes the diagrams) ------ */
/* Article content width = 644 @>=1220 (1080 grid - 2x170 rails - 2x48 gaps),
   min(640, body-40) below (680 max, 20px gutters). Do not change. */
.md-grid { max-width: 1080px; }
.md-main__inner { align-items: flex-start; gap: 48px; margin-top: 32px; }
.md-content { min-width: 0; }
.md-content__inner {
  box-sizing: border-box;
  width: 100%;
  max-width: 680px;
  margin: 0 auto 56px;
  padding: 0;
  background-color: #fff;     /* LOAD-BEARING: the article painted white before the redesign;
                                 the figures' rounded corners anti-alias against it */
}
.md-sidebar--primary, .md-sidebar--secondary { width: 170px; }
@media screen and (min-width: 76.25em) {
  /* Centre the 644px column on the masthead axis (Material adds 19.2px
     side margins). The .1875px keeps the figures' horizontal sub-pixel
     phase identical to the old 19.1875px offset: LOAD-BEARING. */
  [dir=ltr] .md-sidebar--primary:not([hidden]) ~ .md-content > .md-content__inner.md-typeset {
    margin-left: 0.1875px;
    margin-right: 0;
  }
}
@media screen and (max-width: 76.2344em) {
  .md-main__inner { display: block; margin-top: 24px; }
  .md-content__inner { max-width: 680px; margin: 0 auto 48px; padding: 0 20px; }
}

/* 4. Masthead: identical to pluralis.ai .site-banner ---------------- */
/* Line-heights pinned to integers (28 / 22) so the box is exactly 170px
   (homepage 170.03): every chrome height above the article is integer. */
.site-banner {
  box-sizing: border-box;
  width: 100%;                /* body is a flex column in Material: keep the homepage's 800px box */
  max-width: 800px;
  margin: 0 auto;
  padding: 96px 24px 16px;
  background: #fff;
  color: var(--site-text);
  font-family: var(--site-serif);
  text-align: center;
}
.site-banner__title {
  margin: 0 0 8px;
  color: var(--site-ink);
  font: 400 28px/28px var(--site-serif);
  letter-spacing: normal;
}
.site-banner__title a { color: inherit; text-decoration: none; }
.site-banner__nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 12px;
  margin: 0;
}
.site-banner__link {
  color: var(--site-text);
  font-size: 15.2px;
  line-height: 22px;
  text-decoration: none;
}
.site-banner__link:hover,
.site-banner__link:focus-visible {
  color: #000;
  text-decoration: underline;
  text-underline-offset: 2px;
}
/* Only deviation from the homepage: "Docs" carries a quiet current marker
   (aria-current="page" on the docs home, "true" on every other docs page). */
.site-banner__link[aria-current] {
  color: #000;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}
@media (max-width: 760px) {
  .site-banner { padding: 24px 16px 12px; }
  .site-banner__title { font-size: 24px; line-height: 24px; }
  .site-banner__nav { gap: 8px; }
}
@media print { .site-banner { display: none; } }

/* 5. Docs bar (Material header, restyled) --------------------------- */
.md-header,
.md-header--shadow {
  position: sticky;
  top: 0;
  z-index: 4;                 /* Material default: the drawer (z 5) covers it */
  background: #fff;
  color: var(--site-text);
  box-shadow: none;
  transition: none;
}
.md-header__inner {
  box-sizing: border-box;
  position: relative;
  height: var(--site-bar-h);
  padding: 0;
}
.md-header__inner::after {             /* hairline inside the grid (or the 20px gutters) */
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  border-bottom: 1px solid var(--site-rule);
  pointer-events: none;
}
@media screen and (max-width: 76.2344em) { .md-header__inner::after { left: 20px; right: 20px; } }
.md-header__button.md-logo { display: none; }
.md-header__title {
  display: flex;
  align-items: center;
  height: var(--site-bar-h);
  line-height: 20px;
  font-size: 13.12px;
}
.md-header__title > .md-header__ellipsis { display: flex; align-items: center; height: auto; }
[dir=ltr] .md-header__title { margin: 0; }
.md-header__topic:first-child { font-weight: 400; }
.md-header__topic + .md-header__topic { display: none; }       /* no page-title swap (recorded decision) */
.md-header__title--active .md-header__topic { opacity: 1; transform: none; pointer-events: auto; z-index: 0; }
.md-header__button:not(.md-logo) { color: var(--site-text); margin: 0; padding: 12px; }
.md-header__button:hover { opacity: 1; color: #000; }
.md-header__button svg { width: 22px; height: 22px; }
.md-header__option { display: none; }   /* single light palette: no toggle */

/* Repo link: same voice as the masthead nav. */
.md-header__source { width: auto; max-width: none; margin-left: auto; }
.md-header .md-source {
  display: flex;
  align-items: center;
  gap: 7px;
  color: var(--site-text);
  font: 400 15.2px/22px var(--site-serif);
  backface-visibility: visible;
}
.md-header .md-source:hover { color: #000; opacity: 1; }
.md-header .md-source:hover .md-source__repository { text-decoration: underline; text-underline-offset: 2px; }
.md-header .md-source__icon { width: 15px; height: 15px; padding: 0; margin: 0; }
.md-header .md-source__icon svg { width: 15px; height: 15px; margin: 0; }
[dir=ltr] .md-header .md-source__icon + .md-source__repository { margin-left: 0; padding-left: 0; }
.md-header .md-source__repository { max-width: none; overflow: visible; font-size: 15.2px; }
.md-header .md-source__facts { display: none; }       /* stars/forks: noise */

/* Desktop: empty title box over the left rail (spacer), search = the
   article column, repo link on the grid's right edge (over the TOC column). */
@media screen and (min-width: 76.25em) {
  .md-header__title { flex: 0 0 218px; }      /* rail 170 + gap 48: search starts on the article edge */
  .md-header__topic { position: static; }
}

/* Tablet / phone: menu | search. */
@media screen and (max-width: 76.2344em) {
  .md-header__title {
    position: absolute;
    left: 56px;
    right: 56px;
    justify-content: center;
    pointer-events: none;
  }
  .md-header__title .md-header__ellipsis { display: flex; justify-content: center; width: 100%; }
  .md-header__topic { position: static; pointer-events: auto; }
  .md-header__inner > label[for="__drawer"] { margin-left: 8px; }
  .md-header__inner > label[for="__search"] { margin-left: auto; margin-right: 8px; }
}
/* 960-1219: menu | search field | repo link */
@media screen and (min-width: 60em) and (max-width: 76.2344em) {
  .md-header__inner { padding-right: 20px; }
  .md-header__title { position: static; flex: 0 0 auto; justify-content: flex-start; margin-left: 4px; }
  .md-header__title .md-header__ellipsis { justify-content: flex-start; }
  .md-search { margin-left: auto; margin-right: 32px; }
  .md-header__source { margin-left: 0; }
}

/* 6. Search: one rule. The bar's hairline under the field IS the field
   rule; it turns ink while search is open. Left edge anchored, never
   resizes (recorded decision), never reaches the repo link. ---------- */
/* No grey wash, and the overlay never takes a click: the page stays live
   while search is open, and extras.js closes search on a click outside it
   (so the first click on a link both closes search and follows the link). */
.md-search__overlay { background-color: transparent !important; pointer-events: none; }
@media screen and (min-width: 60em) {
  :root { --site-search-w: 360px; }
  .md-search { align-self: stretch; padding: 0; }
  .md-search__inner,
  [data-md-toggle=search]:checked ~ .md-header .md-search__inner {
    float: none;
    width: var(--site-search-w);
    height: 100%;
    padding: 0;
    transition: none;
  }
  body[data-md-color-primary] .md-search__form,
  body[data-md-color-primary] .md-search__form:hover,
  body[data-md-color-primary] [data-md-toggle=search]:checked ~ .md-header .md-search__form {
    height: calc(var(--site-bar-h) - 1px);
    background: transparent;
    border-radius: 0;
    box-shadow: none;
    transition: box-shadow 120ms ease;
  }
  body[data-md-color-primary] .md-search__form:hover { box-shadow: 0 1px 0 rgba(0, 0, 0, 0.3); }
  body[data-md-color-primary] [data-md-toggle=search]:checked ~ .md-header .md-search__form { box-shadow: 0 1px 0 #111; }
  [dir=ltr] .md-search__input { padding-left: 0; padding-right: 32px; }
  .md-search__input { color: var(--site-text); font: 400 15.2px/20px var(--site-serif); }
  .md-search__input::placeholder,
  [data-md-toggle=search]:checked ~ .md-header .md-search__input::placeholder { color: rgba(0, 0, 0, 0.45); }
  body[data-md-color-primary] .md-search__input + .md-search__icon,
  [data-md-toggle=search]:checked ~ .md-header .md-search__input + .md-search__icon { color: rgba(0, 0, 0, 0.45); }
  /* magnifier hangs in the gutter left of the column, like a list marker */
  [dir=ltr] .md-search__icon[for=__search] { left: -26px; }
  .md-search__icon[for=__search] { top: calc((var(--site-bar-h) - 1px - 16px) / 2); width: 16px; height: 16px; }
  .md-search__icon[for=__search] svg { width: 16px; height: 16px; }
  .md-search__options { top: calc((var(--site-bar-h) - 1px - 19.2px) / 2); }
  [dir=ltr] .md-search__options { right: 0; }
  [dir=ltr] .md-search__suggest { padding-left: 0; padding-right: 32px; }
  .md-search__suggest { font: 400 15.2px/20px var(--site-serif); color: rgba(0, 0, 0, 0.3); }
  .md-search__output {
    top: var(--site-bar-h);
    width: 100%;
    background: #fff;
    border: 1px solid var(--site-line);
    border-top: 0;
    border-radius: 0 0 4px 4px;
  }
  .md-search__scrollwrap { width: 100%; }
}
@media screen and (min-width: 76.25em) { :root { --site-search-w: 644px; } }   /* = the article column */
@media screen and (max-width: 59.9844em) {
  /* Material's full-screen sheet; input and suggest ghost share one box so
     the ghost completion sits exactly on the typed text. */
  .md-search__form { height: var(--site-bar-h); box-shadow: 0 1px 0 var(--site-rule); }
  .md-search__input,
  .md-search__suggest { height: var(--site-bar-h); font: 400 17px/24px var(--site-serif); }
  .md-search__input { color: var(--site-text); }
  .md-search__suggest { color: rgba(0, 0, 0, 0.3); }
  .md-search__icon[for=__search] { top: 12px; }
  .md-search__options { top: 14px; }
  .md-search__output { top: var(--site-bar-h); }
}

/* Search results: label-style meta, serif titles, no icons, no figure noise */
.md-search-result { color: var(--site-text); }
.md-search-result__meta,
[dir=ltr] .md-search-result__meta {
  padding: 0 20px;
  background: #fff;
  color: var(--site-label);
  font: 400 12px/36px var(--site-serif);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  border-bottom: 1px solid var(--site-rule);
}
.md-search-result__item { box-shadow: 0 -1px 0 var(--site-rule); }
.md-search-result__icon { display: none; }
.md-search-result__article,
[dir=ltr] .md-search-result__article { padding: 0 20px; }
.md-search-result__link:focus,
.md-search-result__link:hover,
.md-search-result__more > summary:focus > div,
.md-search-result__more > summary:hover > div { background-color: rgba(0, 0, 0, 0.025); }
.md-search-result__more > summary > div,
[dir=ltr] .md-search-result__more > summary > div {
  padding: 10px 20px;
  color: var(--site-label);
  font: 400 12px/16px var(--site-serif);
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.md-search-result__more > summary:hover > div { color: #000; }
/* The index stores diagram text as bare text nodes (figures are not <p>):
   hide them (font-size 0) and give every kept element an explicit size.
   h2 MUST stay visible (section-result titles). */
.md-search-result article.md-search-result__article { font-size: 0; }
.md-search-result article.md-search-result__article > :not(h1, h2, p, ul, ol, pre, .md-search-result__icon) { display: none; }
.md-search-result__article > h1,
.md-search-result .md-typeset > h1 {
  margin: 12px 0 2px;
  color: var(--site-ink);
  font: 400 16.8px/1.35 var(--site-serif);
}
.md-search-result__article > h2,
.md-search-result .md-typeset > h2 {
  margin: 10px 0 2px;
  color: var(--site-ink);
  font: 400 15.2px/1.35 var(--site-serif);
  letter-spacing: 0;
  text-transform: none;
}
.md-search-result .md-typeset > :is(p, ul, ol, pre) {
  margin: 2px 0 10px;
  color: var(--site-soft);
  font: 400 14.4px/1.45 var(--site-serif);
}
.md-search-result .md-typeset > :is(ul, ol) { padding-left: 18px; }
.md-search-result .md-typeset li { margin: 0; }
.md-search-result .md-typeset code { font-size: 12.5px; background: rgba(0, 0, 0, 0.035); padding: 0 3px; border-radius: 3px; }
.md-search-result__terms,
.md-search-result .md-typeset p.md-search-result__terms { color: var(--site-meta); font-style: italic; }
.md-search-result mark { background: transparent; color: #000; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 2px; }

/* 7. Rails (desktop): sticky in flow, quiet serif ------------------- */
.md-sidebar { padding: 0; }
.md-sidebar__scrollwrap { margin: 0; scrollbar-width: none; }      /* scrollbars hidden (recorded decision) */
.md-sidebar__scrollwrap::-webkit-scrollbar { display: none; }
.md-nav { font-family: var(--site-serif); font-size: 15.2px; line-height: 20px; }
@media screen and (min-width: 60em) { .md-nav { margin-bottom: 0; } }
.md-nav__link > svg,
.md-nav__link .md-ellipsis > svg { display: none; }           /* page icons: none in the house style */
.md-nav__title .md-nav__button.md-logo { display: none; }

@media screen and (min-width: 76.25em) {
  .md-sidebar {
    position: sticky;
    top: var(--site-rail-top) !important;     /* beats Material's inline top */
    height: auto;
    z-index: 1;   /* LOAD-BEARING: paint rails after in-flow content, otherwise Chrome
                     promotes layers inside the diagrams (sticky overlap) */
  }
  /* The scrollwrap clips (overflow-y:auto), so it carries its own room, net
     zero: 16px on the left for the current-page dot, 5px elsewhere for the
     focus ring (Material's 3px offset + ring). The text does not move and
     the bottom edge stays at 100vh - 24px. */
  .md-sidebar__scrollwrap {
    height: auto !important;                  /* beats Material's inline height */
    max-height: calc(100vh - var(--site-rail-top) - 24px + 5px);
    overflow-y: auto;
    margin: -5px -5px -5px -16px;
    padding: 5px 5px 5px 16px;
  }
  .md-sidebar__inner { padding-right: 0 !important; }
  /* Material collapses nested groups to a 0.4rem row and pulls each nav
     up 0.4rem; with our 0 list padding that clips the last rail item. */
  .md-nav__toggle ~ .md-nav { grid-template-rows: minmax(0, 0fr); }
  .md-nav__toggle.md-toggle--indeterminate ~ .md-nav,
  .md-nav__toggle:checked ~ .md-nav { grid-template-rows: minmax(0, 1fr); }
  .md-nav--primary > .md-nav__title { display: none; }
  [dir=ltr] .md-nav--primary .md-nav__list,
  [dir=ltr] .md-nav--secondary .md-nav__list { padding-left: 0; padding-bottom: 0; }
  [dir=ltr] .md-nav--primary .md-nav__item > .md-nav__link,
  [dir=ltr] .md-nav--secondary .md-nav__item > .md-nav__link { margin-right: 0; }
  .md-nav--primary .md-nav__item { padding: 0; }
  .md-nav__link {
    margin-top: 6px;
    color: var(--site-meta);
    transition: color 120ms ease;
  }
  .md-nav--primary > .md-nav__list > .md-nav__item:first-child > .md-nav__link { margin-top: 0; }
  .md-nav__link[href]:hover,
  .md-nav__link[for]:hover,
  .md-nav__link[href]:focus-visible { color: #000; }
  .md-nav__link[href]:hover .md-ellipsis { text-decoration: underline; text-underline-offset: 2px; }

  /* section labels = homepage section labels */
  .md-nav__item--section { margin: 28px 0 0; }
  .md-nav__item--section > .md-nav__link,
  .md-nav__item--section > .md-nav__link > a.md-nav__link,
  .md-nav__item--section > .md-nav__link[for] {
    margin-top: 0;
    color: var(--site-label);
    font: 400 13.12px/20px var(--site-serif);
    letter-spacing: 0.12em;
    text-transform: uppercase;
  }
  .md-nav__item--section > .md-nav__link > a.md-nav__link:hover { color: #000; }
  [dir=ltr] .md-nav__item--section > .md-nav { margin-left: 0; }
  /* LOAD-BEARING for the "you are here" dot: section lists never collapse,
     so release their overflow or the dot at left:-12px is clipped. */
  .md-nav__item--section > .md-nav > .md-nav__list { padding-top: 2px; overflow: visible; }

  /* nested collapsible group (Setup Guides) */
  .md-nav__item--nested:not(.md-nav__item--section) > .md-nav > .md-nav__list { padding-left: 12px; }
  .md-nav__icon { color: var(--site-faint); width: 14px; height: 14px; }
  .md-nav__icon:after { width: 14px; height: 14px; }

  /* "you are here": ink + the blog TOC's gold dot. No bold, no bar.
     Ancestor sections are NOT highlighted (recorded decision). */
  .md-sidebar--primary .md-nav__link--active,
  .md-sidebar--primary .md-nav__link--active:hover { color: var(--site-ink); }
  .md-sidebar--primary a.md-nav__link--active { position: relative; }
  .md-sidebar--primary a.md-nav__link--active::before {
    content: "";
    position: absolute;
    left: -12px;
    top: 7.5px;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--site-gold);
  }
  .md-sidebar--primary .md-nav__item--section > .md-nav__link .md-nav__link--active { color: var(--site-ink); }

  /* right rail: "On this page", the blog .toc sizes; ink for active, no dot */
  .md-sidebar--secondary { transition: opacity 140ms ease, visibility 0s linear 0s; }
  .md-sidebar--secondary[data-site-recede] { opacity: 0; visibility: hidden; transition: opacity 140ms ease, visibility 0s linear 140ms; }
  .md-nav--secondary .md-nav__title {
    padding: 0 0 6px;
    background: #fff;
    box-shadow: none;
    color: var(--site-label);
    font: 400 13.12px/20px var(--site-serif);
    letter-spacing: 0.12em;
    text-transform: uppercase;
  }
  .md-nav--secondary .md-nav__title .md-nav__icon { display: none; }
  .md-nav--secondary .md-nav__link { margin-top: 6px; font-size: 15px; line-height: 21px; }
  .md-nav--secondary .md-nav .md-nav__list { padding-left: 12px; }
  .md-nav--secondary .md-nav .md-nav__link { font-size: 14px; line-height: 20px; margin-top: 4px; }
  .md-sidebar--secondary .md-nav__link--active { color: var(--site-meta); }   /* Material's toc.follow class: idle */
  .md-sidebar--secondary .md-nav__link[data-p-toc-active="true"] { color: var(--site-ink); }
}

/* 8. Drawer (tablet / phone) ---------------------------------------- */
@media screen and (max-width: 76.2344em) {
  /* The page TOC lives in the drawer at every width below 1220 (Material
     only integrates it below 960); no half-styled TOC rail over figures. */
  .md-sidebar--secondary:not([hidden]) { display: none; }   /* beats Material's (0,2,0) display:block at >=60em */
  .md-nav--primary .md-nav__link[for=__toc] { display: flex; }
  .md-nav--primary .md-nav__link[for=__toc] .md-icon:after { content: ""; }
  .md-nav--primary .md-nav__link[for=__toc] + .md-nav__link { display: none; }
  .md-nav--primary .md-nav__link[for=__toc] ~ .md-nav { display: flex; }

  .md-overlay { background-color: rgba(0, 0, 0, 0.32); }
  /* Closed drawer is visibility:hidden (after the 250ms slide-out), so its
     links leave the tab order instead of taking focus off-screen. */
  .md-sidebar--primary {
    width: 280px;
    visibility: hidden;
    transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.25s, visibility 0s linear 0.25s;
  }
  [dir=ltr] .md-sidebar--primary { left: -280px; }
  [data-md-toggle=drawer]:checked ~ .md-container .md-sidebar--primary {
    visibility: visible;
    transform: translateX(280px);
    box-shadow: 0 0 32px rgba(0, 0, 0, 0.12);
    transition-delay: 0s;
  }
  .md-nav--primary,
  .md-nav--primary .md-nav { background: #fff; }
  .md-nav--primary .md-nav__title,
  .md-nav--primary .md-nav__title[for=__drawer] {
    height: auto;
    padding: 16px 16px 14px 52px;
    background: #fff;
    color: var(--site-ink);
    font: 400 16.8px/24px var(--site-serif);
    white-space: nowrap;
    border-bottom: 1px solid var(--site-rule);
    box-shadow: none;
  }
  .md-nav--primary .md-nav__title[for=__drawer] {
    padding-left: 16px;
    color: var(--site-label);
    font-size: 13.12px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
  }
  [dir=ltr] .md-nav--primary .md-nav__title .md-nav__icon { left: 12px; }
  .md-nav--primary .md-nav__title .md-nav__icon { top: 16px; margin: 0; width: 24px; height: 24px; color: var(--site-text); }
  .md-nav__source {
    padding: 10px 16px;
    background: #fff;
    color: var(--site-text);
    border-bottom: 1px solid var(--site-rule);
  }
  .md-nav__source .md-source { font: 400 15.2px/22px var(--site-serif); color: var(--site-text); display: flex; align-items: center; gap: 8px; }
  .md-nav__source .md-source__icon { width: 15px; height: 15px; margin: 0; padding: 0; }
  .md-nav__source .md-source__icon svg { width: 15px; height: 15px; margin: 0; }
  [dir=ltr] .md-nav__source .md-source__icon + .md-source__repository { margin-left: 0; padding-left: 0; }
  .md-nav__source .md-source__facts { display: none; }
  .md-nav--primary .md-nav__title ~ .md-nav__list { box-shadow: none; }
  .md-nav--primary .md-nav__item { border-top: 0; font: 400 16px/22px var(--site-serif); }
  .md-nav--primary .md-nav__link {
    padding: 10px 16px;
    color: var(--site-meta);
  }
  .md-nav--primary .md-nav__link .md-nav__link { padding: 0; }    /* index rows: no double padding */
  .md-nav--primary .md-nav__item--active > .md-nav__link,
  .md-nav--primary .md-nav__link--active { color: var(--site-ink); }
  /* the dot marks the page (its link or its "On this page" label), never a
     TOC entry: :not() keeps it off .md-nav--secondary whatever the specificity */
  .md-nav--primary :is(a, label[for="__toc"]).md-nav__link--active:not(.md-nav--secondary *) { position: relative; }
  .md-nav--primary :is(a, label[for="__toc"]).md-nav__link--active:not(.md-nav--secondary *)::before {
    content: "";
    position: absolute;
    left: 5px;
    top: 18.5px;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--site-gold);
  }
  .md-nav--primary .md-nav__link .md-nav__icon { color: var(--site-faint); }
  /* TOC entries in the drawer: the desktop rail's hierarchy (level 2 is
     12px in at 14/20). Material's >=60em rail list padding (9.6px per level)
     is reset so 960-1219 matches the phone/tablet drawer. */
  [dir=ltr] .md-nav--primary .md-nav--secondary .md-nav__list { padding-left: 0; padding-bottom: 0; }
  .md-nav--primary .md-nav--secondary .md-nav__link { font-size: 15.2px; padding-top: 7px; padding-bottom: 7px; }
  [dir=ltr] .md-nav--primary .md-nav--secondary .md-nav .md-nav__link { padding-left: 28px; font-size: 14px; line-height: 20px; }
  [dir=ltr] .md-nav--primary .md-nav--secondary .md-nav .md-nav .md-nav__link { padding-left: 40px; }
}

/* 9. Breadcrumb: sentence-case, quiet, server-rendered -------------- */
.md-path {
  box-sizing: border-box;
  margin: -3px -3px 17px;     /* 3px of focus-ring room inside the clip (overflow:auto), */
  padding: 3px;               /* net zero: the crumbs and the article do not move */
  font: 400 14.4px/20px var(--site-serif);
  color: var(--site-meta);
  /* do NOT override overflow (Material: auto). LOAD-BEARING: changing it
     alters diagram rasterisation. */
}
@media screen and (max-width: 76.2344em) { .md-path { max-width: 680px; margin: -3px auto 13px; padding: 3px 20px; } }
.md-path__list { gap: 6px; }
.md-path__item { margin: 0; display: inline-flex; align-items: center; gap: 6px; }
.md-path__item:not(:first-child)::before { width: 12px; height: 12px; background-color: rgba(0, 0, 0, 0.35); }
.md-path__link { color: var(--site-meta); text-decoration: none; }
.md-path__link:hover,
.md-path__link:focus-visible { color: #000; text-decoration: underline; text-underline-offset: 2px; }
.md-path__item--current { color: var(--site-ink); }

/* 11. Footer: prev/next is the page's last homepage section ---------- */
.md-footer { margin-top: 0; background: #fff; color: var(--site-text); }
.md-footer__inner {
  box-sizing: border-box;
  max-width: 640px;
  width: calc(100% - 40px);
  margin: 0 auto;
  padding: 0 0 48px;
  overflow: visible;          /* Material: auto, which clipped the prev/next focus rings (nothing overflows: titles wrap) */
}
@media screen and (min-width: 76.25em) {
  .md-footer__inner {
    width: 644px;
    max-width: 644px;
    margin: 0 auto;                         /* the column is centred: same axis */
  }
}
@media (max-width: 600px) { .md-footer__inner { padding-bottom: 32px; } }
.md-footer__inner { display: flex; justify-content: space-between; gap: 24px; border-top: 1px solid var(--site-rule); }
.md-footer__link { padding: var(--site-gap) 0 0; margin: 0; flex: 1 1 0; display: block; color: var(--site-text); outline-offset: 2px; }
.md-footer__link--prev { width: auto; float: none; }
.md-footer__link--next { margin-left: auto; text-align: right; }
.md-footer__link--prev:only-child, .md-footer__link--next:only-child { flex: 0 1 auto; }
.md-footer__button { display: none; }
.md-footer__link--prev .md-footer__title { display: block; }   /* Material hides it below 45em */
.md-footer__title { padding: 0; margin: 0; font-size: inherit; line-height: inherit; flex-grow: 1; max-width: none; position: static; }
.md-footer__direction {
  position: static;
  display: block;
  margin: 0 0 4px;
  padding: 0;
  opacity: 1;
  color: var(--site-label);
  font: 400 12px/20px var(--site-serif);
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.md-footer__link--prev .md-footer__direction::before { content: "\2190\00a0"; }
.md-footer__link--next .md-footer__direction::after { content: "\00a0\2192"; }
.md-footer__title .md-ellipsis {
  color: var(--site-ink);
  font: 400 16.8px/24px var(--site-serif);
  white-space: normal;
  text-wrap: balance;
}
.md-footer__link:hover { opacity: 1; }
.md-footer__link:hover .md-ellipsis { color: #000; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 2px; }
.md-footer-meta { display: none; }     /* the homepage has no copyright / generator row */

/* 12. Back to top: quiet text chip under the docs bar --------------- */
.md-top {
  top: calc(var(--site-bar-h) + 12px);
  padding: 5px 12px 6px;
  border: 1px solid var(--site-line);
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: none;
  color: var(--site-meta);
  font: 400 14.08px/20px var(--site-serif);
  white-space: nowrap;
}
.md-top svg { width: 14px; height: 14px; vertical-align: -2px; margin-right: 2px; }
.md-top:hover, .md-top:focus { background: #fff; color: #000; border-color: rgba(0, 0, 0, 0.25); }

/* 13. Misc ---------------------------------------------------------- */
:focus-visible { outline-color: #111; }
.md-skip { font-family: var(--site-serif); }
.md-dialog { font-family: var(--site-serif); }

/* ===================== PART 2: ARTICLE ============================= */
/* Everything is scoped to .md-content__inner. Figures contain only div,
   span, strong, code, br, figcaption and SVG; diagram-freeze.css pins
   those, so nothing here can reach a diagram. */

/* 10. Article typography ------------------------------------------- */
.md-content__inner {
  color: var(--site-prose);
  font-family: var(--site-serif);
  font-size: 15.5px;          /* recorded decision: Times 15.5 / 1.52 */
  line-height: 1.52;
}
.md-content__inner::before { height: 6px; }
.md-content__inner h1,
.md-content__inner h2,
.md-content__inner h3,
.md-content__inner h4,
.md-content__inner h5,
.md-content__inner h6 { font-family: var(--site-serif); font-weight: 400; }

/* H1: the blog post-title family, increasing with width */
.md-content__inner > h1 {
  max-width: 680px;
  margin: 0 0 16px;
  color: var(--site-ink);
  font-size: 44px;
  line-height: 48px;
  letter-spacing: -0.01em;
  text-wrap: balance;
}
@media screen and (max-width: 76.2344em) { .md-content__inner > h1 { font-size: 40px; line-height: 44px; } }
@media screen and (max-width: 44.9844em) { .md-content__inner > h1 { font-size: 34px; line-height: 38px; letter-spacing: -0.005em; } }

.md-content__inner > h1 + p {
  max-width: 620px;
  margin: 0 0 20px;
  color: var(--site-soft);
  font-size: 16.8px;
  line-height: 25px;
  text-wrap: pretty;
}
@media (max-width: 600px) { .md-content__inner > h1 + p { font-size: 16px; line-height: 24px; } }

.md-content__inner p { margin: 0 0 16px; color: var(--site-prose); text-wrap: pretty; }
.md-content__inner > p:last-child { margin-bottom: 0; }

/* H2 = homepage section label, carrying the homepage section rule:
   27.2px | 1px rgba(0,0,0,.08) | 27.2px | label | 16px. A Markdown `---`
   directly before an H2 becomes that rule (no double hairline). */
.md-content__inner > h2 {
  margin: var(--site-gap) 0 16px;
  padding-top: var(--site-gap);
  border-top: 1px solid var(--site-rule);
  color: var(--site-label);
  font-size: 13.12px;
  line-height: 20px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.md-content__inner > hr {
  margin: var(--site-gap) 0;
  border: 0;
  border-top: 1px solid var(--site-rule);
}
.md-content__inner > hr + h2 { margin-top: 0; padding-top: 0; border-top: 0; }
.md-content__inner > h3 {
  margin: 28px 0 8px;
  color: var(--site-ink);
  font-size: 16.8px;           /* homepage paper title */
  line-height: 24px;
  text-wrap: balance;
}
.md-content__inner > h2 + h3 { margin-top: 0; }
.md-content__inner > h4 {
  margin: 22px 0 6px;
  color: var(--site-ink);
  font-size: 15.5px;
  font-style: italic;
  line-height: 22px;
}

/* numbered headings ({ .numbered } on the H1): keep figure numbering 1,2,3 */
.md-content article:has(h1.numbered) { counter-reset: h2 agora-fig; }
.md-content article:has(h1.numbered) h2 { counter-reset: h3; }
.md-content article:has(h1.numbered) h2::before {
  counter-increment: h2;
  content: counter(h2) ". ";
  color: var(--site-meta);              /* readable text: ~6:1 (--site-faint is 3.35:1) */
  margin-right: 3px;
}
.md-content article:has(h1.numbered) h3::before {
  counter-increment: h3;
  content: counter(h2) "." counter(h3) " ";
  color: var(--site-meta);
  margin-right: 3px;
}

/* permalinks: the blog's hover-only "#" */
.md-content__inner .headerlink {
  margin-left: 8px;
  color: var(--site-faint);
  font: inherit;
  font-size: 0.8em;
  letter-spacing: 0;
  text-decoration: none;
  text-transform: none;
  opacity: 0;
  transition: opacity 120ms ease, color 120ms ease;
}
.md-content__inner :is(h1, h2, h3, h4):hover .headerlink,
.md-content__inner .headerlink:focus { opacity: 1; }
.md-content__inner .headerlink:hover { color: rgba(0, 0, 0, 0.75); }

/* links: text colour, quiet grey underline (recorded decision: #636363, 1px, offset 3px) */
.md-content__inner a,
.md-content__inner a:visited {
  color: var(--site-ink);
  text-decoration: underline;
  text-decoration-color: #636363;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  transition: color 120ms ease, text-decoration-color 120ms ease;
}
.md-content__inner a:hover { color: #000; text-decoration-color: #000; }
.md-content__inner a.headerlink { text-decoration: none; }
.md-content__inner a > code { color: inherit; }
.md-content__inner strong { color: var(--site-ink); font-weight: 600; }
.md-content__inner em { font-style: italic; }

/* lists: 20px hang, like the homepage */
[dir=ltr] .md-content__inner ul,
[dir=ltr] .md-content__inner ol { margin: 0 0 16px; padding-left: 20px; }
[dir=ltr] .md-content__inner ul li,
[dir=ltr] .md-content__inner ol li { margin-left: 0; }
.md-content__inner li { margin-bottom: 6px; color: var(--site-prose); line-height: 1.52; }
.md-content__inner li > p { margin: 0 0 8px; }
.md-content__inner li > ul,
.md-content__inner li > ol { margin: 6px 0 0; }
.md-content__inner ol li::marker { color: var(--site-meta); }

/* task lists: unchecked is a hollow circle (it used to look ticked) */
.md-content__inner .task-list-item { list-style: none; }
[dir=ltr] .md-content__inner .task-list-item { margin-left: 0; }
[dir=ltr] .md-content__inner ul:has(> .task-list-item) { padding-left: 26px; }
[dir=ltr] .md-content__inner .task-list-indicator::before { left: -26px; }
.md-content__inner .task-list-indicator::before {
  top: 4px;
  width: 15px;
  height: 15px;
  box-sizing: border-box;
  border: 1px solid #929292;
  border-radius: 50%;
  background: transparent;
  -webkit-mask-image: none;
  mask-image: none;
}
.md-content__inner [type=checkbox]:checked + .task-list-indicator::before {
  border-color: #111;
  background-color: #111;
  -webkit-mask-image: var(--md-tasklist-icon--checked);
  mask-image: var(--md-tasklist-icon--checked);
}

/* inline code */
.md-content__inner code {
  padding: 1px 4px;
  border-radius: 4px;
  background: rgba(0, 0, 0, 0.035);
  color: #2a2a2a;
  font-family: var(--site-mono);
  font-size: 13px;
  box-shadow: none;
}

/* code blocks: blog .code-block */
.md-content__inner .highlight { margin: 20px 0; }
.md-content__inner pre {
  margin: 0;
  font-size: 13px;
  line-height: 20px;
}
.md-content__inner pre > code {
  padding: 16px 20px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 8px;
  background: var(--site-code-bg);
  color: #333;
  font-size: 13px;
  line-height: 20px;
}
.md-content__inner .highlight .c,
.md-content__inner .highlight .c1,
.md-content__inner .highlight .cm,
.md-content__inner .highlight .ch { font-style: italic; }
.md-content__inner .md-code__nav { top: 8px; right: 8px; background: transparent; }
.md-content__inner .md-code__button {
  width: 28px;
  height: 28px;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.9);
  color: rgba(0, 0, 0, 0.55);
}
.md-content__inner .md-code__button::after { width: 14px; height: 14px; margin: 6px; }
.md-content__inner .md-code__button:hover,
.md-content__inner .md-code__button:focus-visible { color: #111; border-color: rgba(0, 0, 0, 0.3); }
@media (hover: hover) {
  .md-content__inner .md-code__nav { opacity: 0; transition: opacity 120ms ease; }
  .md-content__inner .highlight:hover .md-code__nav,
  .md-content__inner .md-code__nav:focus-within { opacity: 1; }
}
@media screen and (max-width: 44.9844em) {
  .md-content__inner > .highlight { margin: 20px 0; }
  .md-content__inner > .highlight > pre > code { border-radius: 8px; }
}

/* tables: hairline rules, quiet label-colour headers (no boxes, no zebra).
   The block margin sits on the scrollwrap (Material's overflow-x:auto
   wrapper), so it collapses with its neighbours like any other block; on
   the inner box it could not (the scrollwrap is a BFC: 36/44px gaps). */
.md-content__inner .md-typeset__scrollwrap {
  margin: 20px 0 24px;
  /* scroll cue: a faint edge shadow on the side that has more columns.
     The white "local" covers scroll with the table and hide the shadows
     when it fits or at either end. The shadows sit 1px in: the scrolled
     layer is pixel-snapped, and at a fractional x a flush shadow leaks a
     hairline past the cover (seen at 2x). */
  background:
    linear-gradient(to right, #fff 40%, rgba(255, 255, 255, 0)) left center / 28px 100% no-repeat local,
    linear-gradient(to left, #fff 40%, rgba(255, 255, 255, 0)) right center / 28px 100% no-repeat local,
    radial-gradient(farthest-side at 0 50%, rgba(0, 0, 0, 0.16), rgba(0, 0, 0, 0)) left 1px center / 10px 100% no-repeat scroll,
    radial-gradient(farthest-side at 100% 50%, rgba(0, 0, 0, 0.16), rgba(0, 0, 0, 0)) right 1px center / 10px 100% no-repeat scroll;
}
.md-content__inner .md-typeset__table { display: block; width: 100%; margin: 0; padding: 0; }
.md-content__inner table:not([class]) {
  display: table;
  width: 100%;
  border: 0;
  border-collapse: collapse;
  border-radius: 0;
  background: transparent;    /* lets the scroll cue show through */
  font-size: 14.4px;
  line-height: 20px;
}
/* Headers keep the author's case: they can carry case-sensitive keys
   (mixed_precision=true), and tracked capitals widened the tables. */
.md-content__inner table:not([class]) th {
  padding: 0 14px 8px 0;
  min-width: 0;
  border: 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.22);
  background: transparent;
  color: var(--site-label);
  font-size: 13.12px;
  font-weight: 400;
  letter-spacing: 0.02em;
  line-height: 20px;
  text-align: left;
  text-transform: none;
  vertical-align: bottom;
}
.md-content__inner table:not([class]) td {
  padding: 9px 14px 9px 0;
  border: 0;
  border-bottom: 1px solid var(--site-rule);
  color: var(--site-prose);
  vertical-align: top;
}
.md-content__inner table:not([class]) tbody tr:hover { background: transparent; box-shadow: none; }
.md-content__inner table:not([class]) tbody tr:last-child td { border-bottom: 1px solid rgba(0, 0, 0, 0.22); }
.md-content__inner table:not([class]) :is(th, td):last-child { padding-right: 0; }   /* the last column runs to the prose measure */
.md-content__inner table:not([class]) td code { font-size: 12.5px; white-space: nowrap; }   /* 45em+: flags never split after "--" */
/* header keys (sync_phase) never split, at any width: Material's code is break-word */
.md-content__inner table:not([class]) th code { font-size: 12px; letter-spacing: 0; text-transform: none; white-space: nowrap; }
.md-content__inner table:not([class]) td:first-child { color: var(--site-ink); }
/* Narrow tables. Below 45em the nowrap code no longer fits beside its
   text, so code wraps at its own spaces and hyphens (a flag above its
   <ARG>). overflow-wrap:break-word, unlike Material's word-break:break-word, keeps
   each token's width in the column minimum, so the auto layout never
   squeezes a column into mid-token splits. Gutters drop to 10px, and code
   shrinks with the text at 600px. Wrapped code is sliced, not cloned: a
   cloned fragment's padding pokes out of the last column (no gutter).
   Below 30em those minimums no longer fit, so a token wider than its
   column may break, and a first-column cell holding code keeps 9em, room
   for a 15-character flag on one line. */
@media screen and (max-width: 44.9844em) {
  .md-content__inner table:not([class]) :is(th, td) { padding-right: 10px; }
  .md-content__inner table:not([class]) td code {
    white-space: normal;
    word-break: normal;
    overflow-wrap: break-word;
    -webkit-box-decoration-break: slice;
    box-decoration-break: slice;
  }
}
@media (max-width: 600px) {
  .md-content__inner table:not([class]) { font-size: 13.6px; }
  .md-content__inner table:not([class]) td code { font-size: 11.8px; }
}
@media screen and (max-width: 29.9844em) {
  .md-content__inner table:not([class]) td code { overflow-wrap: anywhere; }
  .md-content__inner table:not([class]) td:first-child:has(> code) { min-width: 9em; }
}

/* callouts: editorial left rule, prose voice, ONE treatment for every
   variant (recorded decision: colourless). Title in the homepage paper-
   title voice (16.8px ink, weight 400): scannable without bold. */
.md-content__inner .admonition,
.md-content__inner details {
  margin: 20px 0 22px;
  padding: 2px 0 2px 18px;
  border: 0;
  border-left: 1px solid rgba(0, 0, 0, 0.22);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: var(--site-soft);
  font-size: 15.5px;
  line-height: 1.5;
  page-break-inside: avoid;
}
.md-content__inner .admonition:is(.note, .info, .tip, .warning, .danger, .success, .abstract, .question, .failure, .bug, .example, .quote),
.md-content__inner details:is(.note, .info, .tip, .warning, .danger, .success, .abstract, .question, .failure, .bug, .example, .quote) {
  border-left-color: rgba(0, 0, 0, 0.22);
}
.md-content__inner :is(.admonition, details) > :is(.admonition-title, summary) {   /* :is() lifts specificity over Material's per-type colours */
  margin: 0 0 6px;
  padding: 0;
  background: transparent;
  border: 0;
  color: var(--site-ink);
  font: 400 16.8px/24px var(--site-serif);
}
[dir=ltr] .md-content__inner .admonition > .admonition-title,
[dir=ltr] .md-content__inner details > summary { padding-left: 0; }
.md-content__inner :is(.admonition, details) > :is(.admonition-title, summary)::before { display: none; }
.md-content__inner .admonition-title code { box-shadow: none; font-weight: 400; }
.md-content__inner details > summary { cursor: pointer; }
[dir=ltr] .md-content__inner details > summary { padding-right: 24px; }
.md-content__inner :is(.admonition, details) > summary::after {
  top: 4px;
  width: 16px;
  height: 16px;
  color: var(--site-faint);
  background-color: var(--site-faint);
}
.md-content__inner details:not([open]) > summary { margin-bottom: 0; }
.md-content__inner .admonition p,
.md-content__inner details p { margin: 0 0 8px; color: var(--site-soft); }
.md-content__inner .admonition > :last-child,
.md-content__inner details > :last-child { margin-bottom: 0; }

/* tabs: the masthead nav voice */
.md-content__inner .tabbed-set { margin: 20px 0; }
.md-content__inner .tabbed-labels { box-shadow: 0 -1px var(--site-rule) inset; }
.md-content__inner .tabbed-labels > label {
  padding: 6px 0 9px;
  margin-right: 24px;
  border-radius: 0;
  color: var(--site-meta);
  font: 400 15.2px/22px var(--site-serif);
  border-bottom: 0;
}
.md-content__inner .tabbed-labels > label > [href]:first-child,
.md-content__inner .tabbed-labels > label > a {
  margin: -6px 0 -9px;
  padding: 6px 0 9px;
  color: inherit;
  text-decoration: none;
}
.md-content__inner .tabbed-labels > label:hover { color: #000; }
.md-content__inner .tabbed-set > input:checked + .tabbed-labels > label { color: var(--site-ink); }
.js .md-content__inner .tabbed-labels::before { height: 1px; background: var(--site-ink); }
.md-content__inner .tabbed-content { padding-top: 16px; }
.md-content__inner .tabbed-block > .highlight:first-child { margin-top: 0; }
.md-content__inner .tabbed-block > p { margin: 0 0 12px; }
/* .tabbed-content is a flex item (a BFC): the last block's margin cannot
   collapse into the set's 20px, so drop it (else 48px before the next block). */
.md-content__inner .tabbed-block > :last-child { margin-bottom: 0; }

/* images: block, so text that follows a screenshot in the same paragraph
   (cloud.md, Lambda "5. SSH in") starts on its own line, never beside it.
   Block margins collapse, so 16/32 here = the old inline 8/18 plus line box. */
.md-content__inner img.docs-screenshot,
.md-content__inner .docs-screenshot img {
  display: block;
  max-width: 100%;
  margin: 16px 0 32px;
  border: 1px solid var(--site-line);
  border-radius: 8px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08), 0 8px 32px rgba(0, 0, 0, 0.06);
}

/* footnotes (blog style) */
.md-content__inner .footnote { color: rgba(0, 0, 0, 0.65); font-size: 14.7px; line-height: 1.45; }
.md-content__inner .footnote hr { border-top: 1px solid var(--site-rule); }
.md-content__inner .footnote-ref { font-size: 0.75em; }

/* search-term highlight on the page (search.highlight): grey, not gold */
.md-content__inner mark { background: rgba(0, 0, 0, 0.06); color: inherit; box-shadow: 0 1px 0 rgba(0, 0, 0, 0.45); }

/* last updated: italic meta, like the homepage author lines */
.md-source-file { margin: 40px 0 0; }
.md-source-file__fact {
  color: var(--site-byline);
  font: italic 400 14.08px/20px var(--site-serif);
}
.md-source-file__fact .md-icon { display: none; }
.md-source-file__fact::before { content: "Last updated "; }