/* LinuxCNC HTML theme overrides.

   Sits on top of asciidoctor's default stylesheet (linked separately
   as asciidoctor.css).  Dark mode follows the OS / browser preference
   via @media (prefers-color-scheme: dark); no toggle, no JS.

   Asciidoctor vs static landing pages are distinguished by the
   asciidoctor-set body classes (.article / .book / .manpage); the
   static rules use :not() of those classes so they target only
   index.html / gcode.html.
*/

/* ======================================================================
 *  Asciidoctor pages (light)
 * ====================================================================== */

/* Asciidoctor caps #header / #content / #footnotes / #footer at
   62.5em (1000px) which leaves big empty margins on HD screens.
   Use up to 95% of the viewport, capped at 100em (1600px), so wide
   monitors get a wider content area without losing the line-length
   ceiling on ultra-wide displays.  #footer is excluded: the dark
   footer bar spans the full viewport width. */
body:is(.article,.book,.manpage) #header,
body:is(.article,.book,.manpage) #content,
body:is(.article,.book,.manpage) #footnotes {
  max-width: min(95%, 100em);
}
body:is(.article,.book,.manpage) #footer {
  max-width: none;
}

/* #text# in compat-mode -> <mark>; drop yellow. */
body:is(.article,.book,.manpage) mark {
  background: transparent;
  color: inherit;
}

/* Headings + block titles: asciidoctor default is #ba3925 (brick red).
   Use near-black / very dark blue.  Apply to h1..h6 and to .title
   (image/listing/table captions) so figure captions like
   "Figure 1. ..." stop rendering in red. */
body:is(.article,.book,.manpage) #header h1,
body:is(.article,.book,.manpage) h1,
body:is(.article,.book,.manpage) h2,
body:is(.article,.book,.manpage) h3,
body:is(.article,.book,.manpage) h4,
body:is(.article,.book,.manpage) h5,
body:is(.article,.book,.manpage) h6,
body:is(.article,.book,.manpage) #toctitle,
body:is(.article,.book,.manpage) .title {
  color: #1a3a6c;
  font-weight: 400;
}

/* Uniform grey background on every listing block (hal/ini/ngc/plain). */
body:is(.article,.book,.manpage) .listingblock > .content,
body:is(.article,.book,.manpage) .literalblock > .content,
body:is(.article,.book,.manpage) .listingblock pre,
body:is(.article,.book,.manpage) .literalblock pre,
body:is(.article,.book,.manpage) .listingblock > .content > pre[class^="highlight"],
body:is(.article,.book,.manpage) .listingblock > .content > pre:not(.highlight),
body:is(.article,.book,.manpage) .literalblock pre.highlight {
  background: #f7f7f7;
}

/* Top bar: fixed full-width bar above the page; offsets body content
   and asciidoctor's :toc: left sidebar so they start below it.  Padding
   keyed off :has so it also applies to the static landing pages
   (index.html, gcode.html) that have no asciidoctor body class. */
body:has(.lcnc-topbar) {
  padding-top: 3rem;
}
/* Static landing pages (index.html, gcode.html) have no asciidoctor
   #header margin to space them off the topbar -- add some breathing room. */
body:has(.lcnc-topbar):not(.article):not(.book):not(.manpage) {
  padding-top: 5rem;
}
.lcnc-topbar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 3rem;
  display: flex;
  align-items: center;
  padding: 0 1.5rem;
  background: rgba(0,0,0,.8);
  color: hsla(0,0%,100%,.8);
  font-size: 1rem;
  z-index: 1100; /* above asciidoctor's toc2 (auto/none) */
  box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}
.lcnc-topbar-home {
  color: hsla(0,0%,100%,.8);
  text-decoration: none;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  height: 100%;
}
.lcnc-topbar-home img {
  height: 2.25rem; /* fits inside the 3rem topbar with a little padding */
  width: auto;
  aspect-ratio: 1203.31 / 227.01; /* matches the SVG viewBox so width: auto works without intrinsic dims */
  display: block;
}

/* Site links, centred in the topbar regardless of logo/switcher widths. */
.lcnc-topbar-links {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  white-space: nowrap;
  font-family: "Open Sans","DejaVu Sans",sans-serif;
  font-size: 0.95rem;
}
/* #lcnc-topbar id outranks the index page's high-specificity a/a:visited. */
#lcnc-topbar .lcnc-topbar-links a,
#lcnc-topbar .lcnc-topbar-links a:link,
#lcnc-topbar .lcnc-topbar-links a:visited {
  color: hsla(0,0%,100%,.8);
  text-decoration: none;
}
#lcnc-topbar .lcnc-topbar-links a:hover {
  color: #fff;
  text-decoration: underline;
}
.lcnc-topbar-links .lcnc-sep {
  margin: 0 0.6em;
  color: hsla(0,0%,100%,.4);
  user-select: none;
}
/* hide the links on narrow screens where they would collide */
@media (max-width: 900px) { .lcnc-topbar-links { display: none; } }

/* Language switcher: hidden checkbox + label drives the dropdown.
   Total CSS control, no native disclosure widget to fight. */
.lcnc-lang-switcher {
  margin-left: auto;
  position: relative;
  display: flex;
  align-items: center;
  height: 100%;
  /* Pin font: index.html and asciidoctor pages use different body fonts
     (sans-serif vs Noto Serif), which the dropdown would otherwise inherit. */
  font-family: "Open Sans","DejaVu Sans",sans-serif;
}
.lcnc-lang-toggle {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.lcnc-lang-label {
  cursor: pointer;
  padding: 0 0.75em;
  color: hsla(0,0%,100%,.8);
  font-weight: 500;
  user-select: none;
}
.lcnc-lang-label::after {
  content: " \25BE"; /* ▾ */
  font-size: 0.8em;
  margin-left: 0.25em;
}
.lcnc-lang-list {
  position: absolute;
  right: 0;
  top: 100%;
  margin: 0;
  padding: 0.25em 0;
  list-style: none;
  background: rgba(0,0,0,.85);
  border-radius: 0 0 4px 4px;
  min-width: 10em;
  box-shadow: 0 2px 6px rgba(0,0,0,0.25);
  display: none;
}
.lcnc-lang-switcher:has(.lcnc-lang-toggle:checked) .lcnc-lang-list {
  display: block;
}
.lcnc-lang-list li {
  margin: 0;
  padding: 0;
  list-style: none;
}
/* The #lcnc-topbar id (1,0,0) cleanly outranks the index-page rules
   body:not(.article):not(.book):not(.manpage) a / a:visited (0,4,2), so
   visited and unvisited dropdown links both render in white. */
#lcnc-topbar .lcnc-lang-list a,
#lcnc-topbar .lcnc-lang-list a:link,
#lcnc-topbar .lcnc-lang-list a:visited {
  display: block;
  padding: 0.4em 1em;
  color: hsla(0,0%,100%,.85);
  text-decoration: none;
}
#lcnc-topbar .lcnc-lang-list a:hover,
#lcnc-topbar .lcnc-lang-list a:focus {
  background: hsla(0,0%,100%,.12);
  color: #fff;
}
/* Languages whose translated counterpart is missing or sparse for the
   current page get .lcnc-lang-unavail on the <li> from the post-process
   pass.  Grey the link and disable pointer events so the entry stays in
   the DOM (idempotent reversible toggling at build time) but reads as
   "exists but not here". */
#lcnc-topbar .lcnc-lang-list li.lcnc-lang-unavail a,
#lcnc-topbar .lcnc-lang-list li.lcnc-lang-unavail a:link,
#lcnc-topbar .lcnc-lang-list li.lcnc-lang-unavail a:visited {
  color: hsla(0,0%,100%,.35);
  pointer-events: none;
  cursor: not-allowed;
}
/* Generic "link is in this index but the target is not built for this
   language" marker.  Used on translated index.html pages where the
   manpage list is reused from English; entries whose translated counterpart
   was not emitted get this class so they read as muted, non-clickable
   placeholders. */
li.lcnc-link-unavail a,
li.lcnc-link-unavail a:link,
li.lcnc-link-unavail a:visited {
  opacity: 0.4;
  pointer-events: none;
  cursor: not-allowed;
  text-decoration: line-through;
}

/* Per-page translation-status banner injected just below the topbar by
   lang_switcher_postprocess.py.  The page supplies only the hue via the
   --lcnc-pct-hue custom property (red 0 .. green 120); the tint lightness
   is chosen here so light and dark themes stay legible (no JS). */
.lcnc-trans-banner {
  margin: 0.75rem 1.5rem;
  padding: 0.5em 0.9em;
  border-radius: 4px;
  font-size: 0.95rem;
  line-height: 1.4;
  font-family: "Open Sans","DejaVu Sans",sans-serif;
  background: hsl(var(--lcnc-pct-hue) 80% 90%);
  border-left: 5px solid hsl(var(--lcnc-pct-hue) 65% 42%);
  color: #333;
}
@media (prefers-color-scheme: dark) {
  .lcnc-trans-banner {
    background: hsl(var(--lcnc-pct-hue) 30% 16%);
    border-left-color: hsl(var(--lcnc-pct-hue) 45% 42%);
    color: #ddd;
  }
}

/* Whole-document navigation tree at the top of the left TOC. */
.lcnc-sitenav {
  font-family: "Open Sans","DejaVu Sans",sans-serif;
  font-size: 0.9rem;
  line-height: 1.3334;
  padding-bottom: 4rem;      /* lets the last entry scroll clear of the edge */
}
.lcnc-sitenav details { margin: 0; }
/* one indent step per nested level */
.lcnc-sitenav details > details,
.lcnc-sitenav details > a,
.lcnc-sitenav details > ul { margin-left: 0.75em; }
.lcnc-sitenav summary {
  display: flex;
  align-items: center;
  gap: 0.45em;
  cursor: pointer;
  padding: 0.18em 0 0.18em 0.5em;
  font-size: inherit;        /* asciidoctor sizes bare <summary> at 1.0625rem */
  font-weight: normal;
  color: #1a1a1a;            /* heading row, not a link */
}
.lcnc-sitenav > details > summary { font-weight: 600; }
.lcnc-sitenav summary:hover { text-decoration: underline; }
/* asciidoctor absolutely-places its own summary marker at left:-1.25rem;
   override it so ours stays in flow, and drop its spacer ::after. */
.lcnc-sitenav summary::after { content: none; }
.lcnc-sitenav summary::before {
  content: "";
  position: static;
  flex: 0 0 auto;
  width: 0;
  height: 0;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 7px solid #9b9b9b;   /* closed: right-pointing grey triangle */
  transform: none;
}
.lcnc-sitenav details[open] > summary::before {
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 7px solid #9b9b9b;    /* ▾ */
  border-bottom: 0;
}
.lcnc-sitenav a {
  display: block;
  padding: 0.12em 0;
  color: #2156a5;
  text-decoration: none;
}
.lcnc-sitenav a:hover { text-decoration: underline; }
.lcnc-sitenav .lcnc-sn-active {
  font-weight: normal;
  background: hsla(212,80%,50%,0.12);
}
.lcnc-sitenav .lcnc-sn-active:focus { outline: none; }
/* the active page is itself the disclosure: its name is the summary (which
   toggles), its own section list the collapsed body */
.lcnc-sitenav .lcnc-sn-page > ul.sectlevel1 {
  margin: 0.15em 0 0.4em 0.9em;
}
.lcnc-sitenav ul { list-style: none; margin: 0; padding: 0; }
.lcnc-sitenav ul a { padding-left: 0.5em; }
@media (prefers-color-scheme: dark) {
  .lcnc-sitenav summary { color: #e6e6e6; }
  .lcnc-sitenav a { color: #7fb0ec; }
  .lcnc-sitenav summary::before { border-left-color: #888; }
  .lcnc-sitenav details[open] > summary::before { border-top-color: #888; }
  .lcnc-sitenav .lcnc-sn-active {
    color: #cfe0f8;
    background: hsla(212,80%,55%,0.20);
  }
}
body:is(.article,.book,.manpage).toc2 #toc.toc2 {
  top: 3rem;
}

/* Narrow screens: drop the side TOC, restore full-width content. */
@media (max-width: 800px) {
  body:is(.article,.book,.manpage).toc2 {
    padding-left: 0;
  }
  body:is(.article,.book,.manpage).toc2 #toc.toc2 {
    display: none;
  }
}

/* Page and sidebar scrollbars: declaring scrollbar-color opts out of the
   fully-hidden overlay so the bar hides but returns on hover, as normal. */
html,
body:is(.article,.book,.manpage) #toc.toc2 {
  scrollbar-color: #b0b0b0 transparent;
}

/* Admonition blocks: tint the whole block by type (borrowed from
   KiCAD docs).  Asciidoctor renders these as a wrapper div with an
   inner table whose <table> background is transparent, so the colour
   on the wrapper shows through.  Icon cell keeps asciidoctor's text
   label ("Note" / "Warning" / ...). */
body:is(.article,.book,.manpage) .admonitionblock {
  border-radius: 4px;
  padding: 0.5em 0;
  margin: 1.25em 0;
}
body:is(.article,.book,.manpage) .admonitionblock.note,
body:is(.article,.book,.manpage) .admonitionblock.tip {
  background-color: #d9edf7;
  color: #31708f;
}
body:is(.article,.book,.manpage) .admonitionblock.warning {
  background-color: #ffd3d3;
  color: #8a6d3b;
}
body:is(.article,.book,.manpage) .admonitionblock.caution,
body:is(.article,.book,.manpage) .admonitionblock.important {
  background-color: #fcf8e3;
  color: #8a6d3b;
}
/* Admonition icons: a Bootstrap Icons SVG used as a mask and painted with
   the block's colour, so it tints per type and needs no font.  The word in
   td.icon's .title is kept off-screen as the accessible label. */
body:is(.article,.book,.manpage) .admonitionblock td.icon .title {
  display: inline-block;
  width: 1.6em;
  height: 1.6em;
  overflow: hidden;
  text-indent: -9999px;        /* hide the word, keep it for screen readers */
  background-color: currentColor;
  /* 85%, not contain: the overflow:hidden box would clip an edge-to-edge
     icon (e.g. the info circle) where it touches the top. */
  -webkit-mask: var(--admon-icon) center / 85% no-repeat;
  mask: var(--admon-icon) center / 85% no-repeat;
}
/* asciidoctor's table resets the cell colour, so set the tint directly. */
body:is(.article,.book,.manpage) .admonitionblock.note  td.icon .title,
body:is(.article,.book,.manpage) .admonitionblock.tip   td.icon .title { color: #31708f; }
body:is(.article,.book,.manpage) .admonitionblock.warning td.icon .title,
body:is(.article,.book,.manpage) .admonitionblock.caution td.icon .title,
body:is(.article,.book,.manpage) .admonitionblock.important td.icon .title { color: #8a6d3b; }
body:is(.article,.book,.manpage) .admonitionblock.note  td.icon .title { --admon-icon: url(admon-note.svg); }
body:is(.article,.book,.manpage) .admonitionblock.tip   td.icon .title { --admon-icon: url(admon-tip.svg); }
body:is(.article,.book,.manpage) .admonitionblock.important td.icon .title { --admon-icon: url(admon-important.svg); }
body:is(.article,.book,.manpage) .admonitionblock.warning td.icon .title { --admon-icon: url(admon-warning.svg); }
body:is(.article,.book,.manpage) .admonitionblock.caution td.icon .title { --admon-icon: url(admon-caution.svg); }

/* ======================================================================
 *  Asciidoctor pages (dark, opt-in via system preference)
 * ====================================================================== */
@media (prefers-color-scheme: dark) {
  body:is(.article,.book,.manpage) {
    background: #1e1e1e;
    color: #e0e0e0;
  }
  body:is(.article,.book,.manpage) #header h1,
  body:is(.article,.book,.manpage) h1,
  body:is(.article,.book,.manpage) h2,
  body:is(.article,.book,.manpage) h3,
  body:is(.article,.book,.manpage) h4,
  body:is(.article,.book,.manpage) h5,
  body:is(.article,.book,.manpage) h6,
  body:is(.article,.book,.manpage) #toctitle,
  body:is(.article,.book,.manpage) .title {
    color: #7fb8e8;
    font-weight: 400;
  }
  body:is(.article,.book,.manpage) #preamble > .sectionbody > .paragraph p,
  body:is(.article,.book,.manpage) #preamble > .sectionbody > .paragraph.lead > p {
    color: #d0d0d0;
  }
  body:is(.article,.book,.manpage) a { color: #6fa8dc; }
  body:is(.article,.book,.manpage) a:visited { color: #b48ead; }

  /* Single dark wrapper around listings: paint .content only, make
     the inner <pre> transparent.  Painting both gives a double-box. */
  body:is(.article,.book,.manpage) .listingblock > .content,
  body:is(.article,.book,.manpage) .literalblock > .content {
    background: #2a2a2a;
    color: #f0f0f0;
  }
  body:is(.article,.book,.manpage) .listingblock pre,
  body:is(.article,.book,.manpage) .literalblock pre,
  body:is(.article,.book,.manpage) .listingblock > .content > pre[class^="highlight"],
  body:is(.article,.book,.manpage) .listingblock > .content > pre:not(.highlight),
  body:is(.article,.book,.manpage) .literalblock pre.highlight,
  body:is(.article,.book,.manpage) pre.rouge {
    background: transparent !important;
    background-color: transparent !important;
    color: inherit;
  }

  /* Inline code/tt only.  pre code inside listingblock would
     otherwise paint a second box inside the listing wrapper. */
  body:is(.article,.book,.manpage) p code,
  body:is(.article,.book,.manpage) li code,
  body:is(.article,.book,.manpage) td code,
  body:is(.article,.book,.manpage) tt {
    background: #3a3a3a;
    color: #f0f0f0;
    padding: 1px 4px;
    border-radius: 3px;
  }
  body:is(.article,.book,.manpage) pre code,
  body:is(.article,.book,.manpage) .listingblock code,
  body:is(.article,.book,.manpage) .literalblock code {
    background: transparent !important;
    padding: 0 !important;
    color: inherit;
  }

  body:is(.article,.book,.manpage) table.tableblock,
  body:is(.article,.book,.manpage) table.tableblock th,
  body:is(.article,.book,.manpage) table.tableblock td {
    border-color: #444;
    color: #e0e0e0;
    background: #1e1e1e;
  }
  body:is(.article,.book,.manpage) table.tableblock tbody tr th,
  body:is(.article,.book,.manpage) table.tableblock tfoot tr th,
  body:is(.article,.book,.manpage) table.tableblock thead tr th {
    background: #2a2a2a;
    color: #f0f0f0;
  }
  body:is(.article,.book,.manpage) table.tableblock tbody tr th p,
  body:is(.article,.book,.manpage) table.tableblock tfoot tr th p {
    color: #f0f0f0;
  }
  body:is(.article,.book,.manpage) table.stripes-all > * > tr,
  body:is(.article,.book,.manpage) table.stripes-odd > * > tr:nth-of-type(odd),
  body:is(.article,.book,.manpage) table.stripes-even > * > tr:nth-of-type(even),
  body:is(.article,.book,.manpage) table.stripes-hover > * > tr:hover {
    background: #2a2a2a;
  }
  body:is(.article,.book,.manpage) .admonitionblock > table td.content {
    color: #d0d0d0;
    border-left-color: #444;
  }
  /* dark per-type tint for the icon mask */
  body:is(.article,.book,.manpage) .admonitionblock.note  td.icon .title,
  body:is(.article,.book,.manpage) .admonitionblock.tip   td.icon .title { color: #a8d3e8; }
  body:is(.article,.book,.manpage) .admonitionblock.warning td.icon .title { color: #f0c0c0; }
  body:is(.article,.book,.manpage) .admonitionblock.caution td.icon .title,
  body:is(.article,.book,.manpage) .admonitionblock.important td.icon .title { color: #f0e090; }
  body:is(.article,.book,.manpage) .admonitionblock.note,
  body:is(.article,.book,.manpage) .admonitionblock.tip {
    background-color: #1a3a4d;
    color: #a8d3e8;
  }
  body:is(.article,.book,.manpage) .admonitionblock.warning {
    background-color: #4d2828;
    color: #f0c0c0;
  }
  body:is(.article,.book,.manpage) .admonitionblock.caution,
  body:is(.article,.book,.manpage) .admonitionblock.important {
    background-color: #4d4419;
    color: #f0e090;
  }
  body:is(.article,.book,.manpage) #toc.toc2 {
    background: #1e1e1e;
    border-right-color: #333;
    color: #e0e0e0;
  }
  body:is(.article,.book,.manpage) #toc.toc2 a {
    color: #7fb8e8;
  }

  /* dark scrollbar to match the rule above */
  html,
  body:is(.article,.book,.manpage) #toc.toc2 {
    scrollbar-color: #555 transparent;
  }

  /* Figures are often black line art on a transparent background (Inkscape
     SVGs, some PNGs) and vanish on the dark page.  Back every figure with
     white; opaque screenshots simply cover it.  The padded white card is
     kept for SVGs, whose strokes run to the edge. */
  body:is(.article,.book,.manpage) .imageblock img,
  body:is(.article,.book,.manpage) .image img {
    background: #fff;
  }
  body:is(.article,.book,.manpage) .imageblock img[src$=".svg"],
  body:is(.article,.book,.manpage) .image img[src$=".svg"] {
    padding: 0.5em;
    border-radius: 4px;
  }

  /* Asciidoctor's default stylesheet sets explicit dark-on-white colors
     on these text blocks; without an override they stay black on the
     dark page bg and become unreadable. */
  body:is(.article,.book,.manpage) .quoteblock,
  body:is(.article,.book,.manpage) .quoteblock blockquote,
  body:is(.article,.book,.manpage) .quoteblock p,
  body:is(.article,.book,.manpage) .quoteblock dt,
  body:is(.article,.book,.manpage) .quoteblock .hdlist1,
  body:is(.article,.book,.manpage) .quoteblock .attribution,
  body:is(.article,.book,.manpage) .quoteblock .attribution cite,
  body:is(.article,.book,.manpage) .quoteblock cite,
  body:is(.article,.book,.manpage) .verseblock,
  body:is(.article,.book,.manpage) .verseblock pre,
  body:is(.article,.book,.manpage) .sidebarblock,
  body:is(.article,.book,.manpage) .exampleblock > .content,
  body:is(.article,.book,.manpage) dt,
  body:is(.article,.book,.manpage) .hdlist1 {
    color: #e0e0e0;
  }
  body:is(.article,.book,.manpage) .sidebarblock,
  body:is(.article,.book,.manpage) .exampleblock > .content {
    background: #2a2a2a;
    border-color: #444;
  }
  body:is(.article,.book,.manpage) .quoteblock blockquote::before {
    color: #888;
  }
}


/* ======================================================================
 *  Static landing pages (index.html / gcode.html)
 *
 *  Mirror asciidoctor's defaults so landing pages blend with the doc
 *  pages.  Asciidoctor uses Noto Serif body / Open Sans headings /
 *  #ba3925 heading color / #2156a5 links; we use the dark-blue accent
 *  in line with the doc pages.
 * ====================================================================== */
body:not(.article):not(.book):not(.manpage) {
  font-family: "Noto Serif", "DejaVu Serif", Georgia, serif;
  font-weight: 400;
  font-style: normal;
  line-height: 1;
  background: #fff;
  color: rgba(0, 0, 0, 0.85);
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  /* Match the asciidoctor content cap (min 95% viewport, max 100em /
     1600px) so the static landing pages and the doc pages line up at
     the same width on HD screens. */
  max-width: min(95%, 100em);
  margin: 0 auto;
  padding: 1em 1.5em;
}
/* Override index.css { body { padding-left: 50px } } */
body:not(.article):not(.book):not(.manpage) { padding-left: 1.5em !important; }
/* Caption acts as the page title in gcode.html; render it like
   asciidoctor's h2. */
body:not(.article):not(.book):not(.manpage) caption {
  font-family: "Open Sans", "DejaVu Sans", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 2.3125em;
  color: #1a3a6c;
  text-rendering: optimizeLegibility;
  text-align: left;
  margin: 0.5em 0;
  caption-side: top;
}
body:not(.article):not(.book):not(.manpage) p,
body:not(.article):not(.book):not(.manpage) dd {
  font-family: inherit;
  font-size: 1.0625em;
  line-height: 1.6;
  text-rendering: optimizeLegibility;
}
/* Link lists on index.html act as a TOC; match asciidoctor's #toc ul
   styling (Open Sans, tight line-height). */
body:not(.article):not(.book):not(.manpage) ul,
body:not(.article):not(.book):not(.manpage) ol {
  font-family: "Open Sans", "DejaVu Sans", sans-serif;
}
body:not(.article):not(.book):not(.manpage) li {
  line-height: 1.3334;
  margin-top: 0.3334em;
}
body:not(.article):not(.book):not(.manpage) h1,
body:not(.article):not(.book):not(.manpage) h2,
body:not(.article):not(.book):not(.manpage) h3,
body:not(.article):not(.book):not(.manpage) h4,
body:not(.article):not(.book):not(.manpage) h5,
body:not(.article):not(.book):not(.manpage) h6 {
  font-family: "Open Sans", "DejaVu Sans", sans-serif;
  font-weight: 400;
  font-style: normal;
  color: #1a3a6c;
  line-height: 1.2;
  text-rendering: optimizeLegibility;
}
/* Sizes pulled from asciidoctor's desktop cascade. */
body:not(.article):not(.book):not(.manpage) h2 { font-size: 2.3125em; }
body:not(.article):not(.book):not(.manpage) h3 { font-size: 1.6875em; }
body:not(.article):not(.book):not(.manpage) h4 { font-size: 1.4375em; }
body:not(.article):not(.book):not(.manpage) a {
  color: #2156a5;
  text-decoration: none;
}
body:not(.article):not(.book):not(.manpage) a:hover {
  text-decoration: underline;
}
body:not(.article):not(.book):not(.manpage) a:visited {
  color: #1d4b8f;
}
body:not(.article):not(.book):not(.manpage) code,
body:not(.article):not(.book):not(.manpage) pre,
body:not(.article):not(.book):not(.manpage) tt {
  font-family: "Droid Sans Mono", "DejaVu Sans Mono", monospace;
}

/* gcode.html table: redo to mirror asciidoctor's table look.
   gcode.html ships hard black borders / black header inline; strip
   the vertical rules, soften horizontals, lighten the header
   background.  !important overrides inline style="..." on the
   section-divider rows in the static markup. */
body:not(.article):not(.book):not(.manpage) table {
  border-collapse: collapse;
  border: 1px solid #dddddf !important;
  margin: 1em auto;
}
body:not(.article):not(.book):not(.manpage) td,
body:not(.article):not(.book):not(.manpage) th {
  border: none !important;
  border-bottom: 1px solid #dddddf !important;
  padding: 0.5em 0.625em !important;
  vertical-align: top;
}
body:not(.article):not(.book):not(.manpage) td {
  background: #fff;
  color: rgba(0, 0, 0, 0.85);
}
body:not(.article):not(.book):not(.manpage) th {
  background: #f7f7f8;
  color: rgba(0, 0, 0, 0.85);
  font-weight: bold;
  text-align: left;
}
body:not(.article):not(.book):not(.manpage) tr.odd td {
  background: #f8f8f7;
}
body:not(.article):not(.book):not(.manpage) tr.head td,
body:not(.article):not(.book):not(.manpage) tr.head th {
  background: #f7f7f8;
  color: rgba(0, 0, 0, 0.85);
}
/* Section divider rows in gcode.html.  Two shapes appear:
     <tr><th>Sec</th><td colspan="2">desc</td></tr>    (Motion, Canned cycles)
     <tr><th colspan="3">Sec</th></tr>                 (Distance Mode, ...)
   Paint the row background and let the cells fall through, so the
   tint covers any colgroup column not spanned by the th/td. */
body:not(.article):not(.book):not(.manpage) tr:has(> th:first-child:not(:only-child)),
body:not(.article):not(.book):not(.manpage) tr:has(> th:only-child) {
  background: #ececef;
}
body:not(.article):not(.book):not(.manpage) tr:has(> th:first-child:not(:only-child)) > *,
body:not(.article):not(.book):not(.manpage) tr:has(> th:only-child) > * {
  background: transparent !important;
  font-weight: bold;
}

/* ======================================================================
 *  Static landing pages (dark, opt-in via system preference)
 * ====================================================================== */
@media (prefers-color-scheme: dark) {
  body:not(.article):not(.book):not(.manpage) {
    background: #1e1e1e;
    color: #e0e0e0;
  }
  body:not(.article):not(.book):not(.manpage) h1,
  body:not(.article):not(.book):not(.manpage) h2,
  body:not(.article):not(.book):not(.manpage) h3,
  body:not(.article):not(.book):not(.manpage) h4,
  body:not(.article):not(.book):not(.manpage) h5,
  body:not(.article):not(.book):not(.manpage) h6,
  body:not(.article):not(.book):not(.manpage) caption {
    color: #7fb8e8;
  }
  body:not(.article):not(.book):not(.manpage) a         { color: #6fa8dc; }
  body:not(.article):not(.book):not(.manpage) a:visited { color: #b48ead; }

  body:not(.article):not(.book):not(.manpage) table {
    border-color: #444 !important;
  }
  body:not(.article):not(.book):not(.manpage) td,
  body:not(.article):not(.book):not(.manpage) th {
    border-bottom-color: #444 !important;
  }
  body:not(.article):not(.book):not(.manpage) td {
    background: #2a2a2a;
    color: #e0e0e0;
  }
  body:not(.article):not(.book):not(.manpage) th {
    background: #1a1a1a;
    color: #f0f0f0;
  }
  body:not(.article):not(.book):not(.manpage) tr.odd td {
    background: #333;
  }
  body:not(.article):not(.book):not(.manpage) tr.head td,
  body:not(.article):not(.book):not(.manpage) tr.head th {
    background: #1a1a1a;
    color: #f0f0f0;
  }
  body:not(.article):not(.book):not(.manpage) tr:has(> th:first-child:not(:only-child)),
  body:not(.article):not(.book):not(.manpage) tr:has(> th:only-child) {
    background: #161616;
  }
  body:not(.article):not(.book):not(.manpage) tr:has(> th:first-child:not(:only-child)) > *,
  body:not(.article):not(.book):not(.manpage) tr:has(> th:only-child) > * {
    background: transparent !important;
    color: #f0f0f0;
  }
}

@media screen and (min-width:768px){
h1,h2,h3,#toctitle,.sidebarblock>.content>.title,h4,h5,h6{line-height:revert}
h1{font-size:revert}
h2{font-size:revert}
h3,#toctitle,.sidebarblock>.content>.title{font-size:revert}
h4,h5{font-size:revert}}

.imageblock.text-left   > .title { text-align: left; }
.imageblock.text-center > .title { text-align: center; }
.imageblock.text-right  > .title { text-align: right; }
.imageblock             > .title { margin-top: 0.5em;}