@font-face {
  font-family: "STIX Two Text";
  src: url("fonts/STIXTwoText-Regular.woff2");
  font-style: normal;
  font-weight: 400;
}
@font-face {
  font-family: "STIX Two Text";
  src: url("fonts/STIXTwoText-SemiBold.woff2");
  font-style: normal;
  font-weight: 600;
}
@font-face {
  font-family: "STIX Two Text";
  src: url("fonts/STIXTwoText-Italic.woff2");
  font-style: italic;
  font-weight: 400;
}
@font-face {
  font-family: "STIX Two Math";
  src: local("STIX Two Math"), url("fonts/STIXTwoMath-Regular.woff2");
}
@font-face {
  font-family: "Iosevka";
  src: local("Iosevka"), url("fonts/Iosevka-Regular.woff2");
}
@font-face {
  font-family: "Iosevka";
  src: local("Iosevka Bold"), url("fonts/Iosevka-Bold.woff2");
  font-weight: 700;
}
@font-face {
  font-family: "Iosevka";
  src: local("Iosevka Italic"), url("fonts/Iosevka-Italic.woff2");
  font-style: italic;
}
@font-face {
  font-family: "Iosevka";
  src: local("Iosevka Bold Italic"), url("fonts/Iosevka-BoldItalic.woff2");
  font-weight: 700;
  font-style: italic;
}
html {
  color-scheme: dark;
  --link: var(--indigo-3);
  --link-visited: var(--purple-3);
  --text-1: #fff;
  --text-2: var(--gray-4);
  --surface-1: #000;
  --surface-2: var(--gray-11);
  --surface-3: var(--gray-10);
  --surface-4: var(--gray-9);
  --font-serif: STIX Two Text, Libertinus Serif, ui-serif, serif;
  scrollbar-color: var(--gray-6) var(--gray-10);
  background: #000;
  font-family: var(--font-serif);
  line-height: 1.3;
}
body {
  margin: auto;
  max-width: 60rem;
  padding: var(--size-1);
}
::selection {
  background: var(--gray-8);
}
:is(ol, ul) {
  padding-inline-start: var(--size-5);
}
:is(h1, h2, h3, h4, h5, h6) {
  font-weight: 600;
}
p {
  margin-block: var(--size-1);
}
dd {
  margin: unset;
}
header {
  display: flex;
  flex-flow: row wrap;
  justify-content: flex-end;
  gap: var(--size-3);
  background: var(--gray-9);
  font-variant-caps: all-small-caps;
  letter-spacing: var(--font-letterspacing-1);
  padding: var(--size-2);
}
header > a:first-child {
  flex-grow: 1;
  font-weight: 600;
}
header > a,
header > a:visited {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  gap: var(--size-1);
  color: inherit;
  flex-shrink: 0;
}
header > a > img {
  width: var(--size-3);
  height: var(--size-3);
}
h1 {
  font-variant-caps: small-caps;
  letter-spacing: var(--font-letterspacing-2);
  text-align: center;
  font-size: var(--font-size-4);
  margin: var(--size-6) 0 var(--size-5) 0;
}
h2 {
  font-size: var(--font-size-4);
  margin: var(--size-5) 0 var(--size-3) 0;
}
h3 {
  font-size: var(--font-size-3);
  margin: var(--size-4) 0 var(--size-3) 0;
}
h4 {
  font-size: var(--font-size-2);
  margin: var(--size-4) 0 var(--size-2) 0;
}
figure,
img,
svg {
  display: block;
  max-width: 100%;
  margin-inline: 0;
}
summary {
  margin: unset;
  padding: unset;
  cursor: pointer;
}
ol.chain-list {
  padding: 0;
  list-style: none;
}
ol.chain-list > li {
  margin-top: -0.8em;
  padding: 0;
}
ol.chain-list > li::before {
  content: "⤹";
  vertical-align: text-bottom;
  font-size: 1.5em;
}
ol.chain-list > li:first-child::before {
  visibility: hidden;
}
table {
  display: block;
  max-width: 100%;
  width: fit-content;
  overflow-x: auto;
  margin: var(--size-2);
  border-collapse: collapse;
  border-top: var(--border-size-2) solid var(--stone-4);
  border-bottom: var(--border-size-2) solid var(--stone-4);
}
tr:has(th):not(:has(td)) {
  border-bottom: var(--border-size-1) solid var(--stone-4);
}
th:has(+ td) {
  border-right: var(--border-size-1) solid var(--stone-4);
}
:is(td, th) {
  padding: var(--size-1) var(--size-2);
  text-align: center;
}
figure {
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
}
figcaption {
  color: var(--gray-2);
}

a {
  text-decoration: none;
  color: var(--indigo-4);
}
a:hover {
  text-decoration: underline;
}
a:visited {
  color: var(--purple-4);
}
dfn {
  font-style: normal;
  color: var(--teal-2);
}
strong,
.strong {
  font-weight: normal;
  color: var(--yellow-4);
}
.name {
  font-variant-caps: small-caps;
  letter-spacing: var(--font-letterspacing-1);
}
.tbd {
  color: var(--gray-6);
}
summary > strong:first-child {
  font-weight: 600;
  color: unset;
}
.gray {
  color: var(--gray-7);
}
code {
  font-family: Iosevka, monospace, monospace;
}

math {
  font-family: STIX Two Math;
  --math-font-features: "ss08";
  font-feature-settings: var(--math-font-features);
}
math[display="block"] {
  text-align: left;
  white-space: nowrap;
}
math .roundhand {
  font-feature-settings: var(--math-font-features), "ss01";
}
.math-container {
  overflow-x: auto;
  overflow-y: hidden;
}

xd-block-math {
  overflow-x: auto;
  overflow-y: hidden;
}
xd-block-math mtr.tml-tageqn > mtd:first-child {
  display: none;
}
xd-block-math mtr.tml-tageqn > mtd {
  padding: 0;
  text-align: left;
  display: inline;
}
xd-block-math mtr.tml-tageqn > mtd:last-child {
  margin-left: 2rem;
}
.xd-theorem-like.xd-theorem-like,
.math-block {
  padding: 0 0 0 var(--size-1);
  margin: var(--size-2) 0;
}
.xd-theorem-like,
.math-block {
  border-left: var(--border-size-2) solid var(--gray-8);
}
.xd-theorem-like > strong:first-child,
.math-block-title {
  color: unset;
  font-weight: 600;
}
.math-block-title::after {
  content: ".";
}
.math-block-type {
  font-variant-caps: all-small-caps;
  letter-spacing: var(--font-letterspacing-2);
}
.math-block-name::before {
  content: "(";
}
.math-block-name::after {
  content: ")";
}
.xd-theorem-like > .xd-theorem-like:last-child,
.math-block > .math-block:last-child {
  margin-bottom: 0;
}
.algorithm {
  border-color: var(--sand-8);
}
.convention {
  border-color: var(--teal-8);
}
.xd-corollary,
.corollary {
  border-color: var(--purple-8);
}
.xd-dfn,
.definition {
  border-color: var(--blue-8);
}
.xd-example,
.example {
  border-color: var(--pink-8);
}
.xd-exercise,
.exercise {
  border-color: var(--brown-8);
}
.xd-hint {
  border-color: var(--cyan-8);
}
.xd-lemma,
.lemma {
  border-color: var(--orange-8);
}
.xd-note,
.note {
  border-color: var(--yellow-8);
}
.observation {
  border-color: var(--violet-8);
}
.xd-proof,
.proof {
  border-color: var(--green-8);
}
.xd-solution,
.solution {
  border-color: var(--lime-8);
}
.xd-theorem,
.theorem {
  border-color: var(--red-8);
}
.math-block.joke {
  border-left-style: dashed;
}
.game {
  border-color: var(--jungle-8);
}
ol.xd-contents,
ol.table-of-contents {
  list-style: "→ ";
  padding-left: var(--size-6);
}
dl {
  display: grid;
  grid-template-columns: fit-content(4em) minmax(0, 1fr);
  column-gap: var(--size-2);
  row-gap: var(--size-1);
  overflow-x: auto;
  overflow-y: hidden;
}
dl:not(.implications) > dt {
  font-style: italic;
}

mo[fence="true"] {
  color: var(--purple-3);
}
:is(mo[fence="true"] ~ *) mo[fence="true"] {
  color: var(--indigo-3);
}
:is(:is(mo[fence="true"] ~ *) mo[fence="true"] ~ *) mo[fence="true"] {
  color: var(--cyan-3);
}
:is(:is(:is(mo[fence="true"] ~ *) mo[fence="true"] ~ *) mo[fence="true"] ~ *)
  mo[fence="true"] {
  color: var(--green-3);
}
:is(
    :is(
        :is(:is(mo[fence="true"] ~ *) mo[fence="true"] ~ *) mo[fence="true"] ~ *
      )
      mo[fence="true"]
      ~ *
  )
  mo[fence="true"] {
  color: var(--yellow-3);
}
:is(
    :is(
        :is(
            :is(:is(mo[fence="true"] ~ *) mo[fence="true"] ~ *)
              mo[fence="true"]
              ~ *
          )
          mo[fence="true"]
          ~ *
      )
      mo[fence="true"]
      ~ *
  )
  mo[fence="true"] {
  color: var(--red-3);
}
mtable.cases > mtr > mtd {
  text-align: left;
}
@media print {
  body {
    background: #fff;
    --text-1: #000;
  }
}
