@font-face {
  font-family:"Tiempos Text";
  src:
    url("/assets/fonts/tiempos/TiemposTextWeb-Regular.woff2"),
    url("/assets/fonts/tiempos/TiemposTextWeb-Regular.woff");
  font-weight:normal;
  font-style:normal
}
@font-face {
  font-family:"Tiempos Text";
  src:
    url("/assets/fonts/tiempos/TiemposTextWeb-RegularItalic.woff2"),
    url("/assets/fonts/tiempos/TiemposTextWeb-RegularItalic.woff");
  font-weight:normal;
  font-style:italic
}
@font-face {
  font-family:"Tiempos Text";
  src:
    url("/assets/fonts/tiempos/TiemposTextWeb-Semibold.woff2"),
    url("/assets/fonts/tiempos/TiemposTextWeb-Semibold.woff");
  font-weight:bold;
  font-style:normal
}
@font-face {
  font-family:"Tiempos Text";
  src:
    url("/assets/fonts/tiempos/TiemposTextWeb-SemiboldItalic.woff2"),
    url("/assets/fonts/tiempos/TiemposTextWeb-SemiboldItalic.woff");
  font-weight:bold;
  font-style:italic
}

@font-face {
  font-family:"Founders Grotesk Extra Condensed";
  src:
    url("/assets/fonts/founders-grotesk/FoundersGroteskX-CondensedWeb-Regular.woff2"),
    url("/assets/fonts/founders-grotesk/FoundersGroteskX-CondensedWeb-Regular.woff");
  font-weight:normal;
  font-style:normal;
  font-display:fallback;
}

@font-face {
  font-family:"Founders Grotesk";
  src:
    url("/assets/fonts/founders-grotesk/FoundersGroteskWeb-Regular.woff2"),
    url("/assets/fonts/founders-grotesk/FoundersGroteskWeb-Regular.woff");
  font-weight:normal;
  font-style:normal;
  font-display:fallback;
}
@font-face {
  font-family:"Founders Grotesk";
  src:
    url("/assets/fonts/founders-grotesk/FoundersGroteskWeb-RegularItalic.woff2"),
    url("/assets/fonts/founders-grotesk/FoundersGroteskWeb-RegularItalic.woff");
  font-weight:normal;
  font-style:italic;
  font-display:fallback;
}
@font-face {
  font-family:"Founders Grotesk";
  src:
    url("/assets/fonts/founders-grotesk/FoundersGroteskWeb-Bold.woff2"),
    url("/assets/fonts/founders-grotesk/FoundersGroteskWeb-Bold.woff");
  font-weight:bold;
  font-style:normal;
  font-display:fallback;
}
@font-face {
  font-family:"Founders Grotesk";
  src:
    url("/assets/fonts/founders-grotesk/FoundersGroteskWeb-BoldItalic.woff2"),
    url("/assets/fonts/founders-grotesk/FoundersGroteskWeb-BoldItalic.woff");
  font-weight:bold;
  font-style:italic;
  font-display:fallback;
}

@font-face {
  font-family: "Fira Mono";
  src: url("/assets/fonts/fira/FiraMono-Regular.eot");
  src:
    url("/assets/fonts/fira/FiraMono-Regular.eot") format("embedded-opentype"),
    url("/assets/fonts/fira/FiraMono-Regular.woff2") format("woff2"),
    url("/assets/fonts/fira/FiraMono-Regular.woff") format("woff"),
    url("/assets/fonts/fira/FiraMono-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display:fallback;
}

::selection {
  background-color: #f0c674;
}

::-moz-selection {
  background-color: #f0c674;
}

.lh-copy { line-height: 1.55rem; }

:root {
  color: hsl(0, 0%, 15%);
  font-size: 100%;
  --tiempos: "Tiempos Text",
    "Georgia",
    "Times New Roman",
    serif;
  --founders-grotesk: Founders Grotesk,
    -apple-system,
    BlinkMacSystemFont,
    avenir next,
    avenir,
    helvetica,
    helvetica neue,
    ubuntu,
    noto,
    Roboto,
    segoe ui,
    arial,
    sans-serif;
  font-family: var(--founders-grotesk);
}

@media (min-width: 30rem) {
  :root {
    font-size: 125%;
  }
}

.sticky {
  position: sticky;
  position: -webkit-sticky;
  z-index: 1;
}

.founders-grotesk-extra-condensed {
  font-family: Founders Grotesk Extra Condensed;
}

.founders-grotesk {
  font-family: var(--founders-grotesk);
}

.tiempos-text {
  font-family: var(--tiempos);
}

.block-columns-2-ns {
  column-gap: 1.5rem;
}

.block-columns-2-ns > * {
  break-inside: avoid;
}

@media (min-width: 30em) {
  .block-columns-2-ns {
    column-count: 2;
  }
}

button {
  display: inline-block;
  line-height: 1rem;
  padding: 0.5rem 0.6rem 0.6rem;
  border-radius: 0.5rem;
  background-color: whitesmoke;
  border: 4px solid black;
  transition: background-color ease 0.2s;
  font-family: var(--founders-grotesk);
  font-weight: 600;
  cursor: pointer;
}

button:hover {
  background-color: gainsboro;
}

button:active {
  color: white;
  background-color: black;
}

summary::-webkit-details-marker {
  display: none;
}

summary {
  list-style: none;
  font-family: var(--founders-grotesk);
  cursor: pointer;
  margin-bottom: 0.5rem;
  line-height: 1rem;
  padding: 0.5rem 0.6rem 0.6rem;
  border-radius: 0.5rem;
  background-color: whitesmoke;
}

summary:hover {
  background-color: gainsboro;
}

details summary::before {
  content: "⏵";
  display: inline-block;
  margin-right: 0.25rem;
}

details[open] summary::before {
  content: "⏷";
}

.markdown {
  font-family: var(--tiempos);
}

.markdown h1,
.markdown h2,
.markdown h3,
.markdown h4,
.markdown h5,
.markdown h6 {
  font-family: var(--founders-grotesk);
  font-weight: bold;
  margin-top: 1.75rem;
  scroll-margin-top: 5rem;
}

.markdown h1 + h2,
.markdown h2 + h3,
.markdown h3 + h4 {
  margin-top: 1rem;
}

.markdown h1 {
  font-size: 2rem;
  line-height: 2.25rem;
  margin-top: 2.25rem;
}
.markdown h2 {
  font-size: 1.5rem;
  line-height: 1.75rem;
  margin-top: 1.75rem;
}
.markdown h3 {
  font-size: 1.25rem;
  line-height: 1.5rem;
  margin-top: 1.5rem;
}
.markdown h4 {
  font-size: 1.125rem;
  line-height: 1.5rem;
  margin-top: 1rem;
}

.markdown em { font-style: italic; }

.markdown pre,
.markdown code {
  font-family:
    "Fira Mono",
    "Menlo",
    monospace;
}

.markdown p > code, .markdown a > code, .markdown li > code {
  background-color: #f0c674;
  padding: 0.12rem 0.3rem 0.16rem;
  border-radius: 0.5rem;
  box-decoration-break: clone;
}

.markdown > * + * {
  margin-top: 1rem;
}

.markdown br {
  margin-top: 0;
}

.markdown blockquote {
  padding-left: 1.6rem;
  position: relative;
  z-index: 0;
}

.markdown blockquote > * + * {
  margin-top: 0.75rem;
}

.markdown blockquote:before {
  content:'"';
  position: absolute;
  left: 0;
  top: 0.15rem;
  font-size: 2rem;
  line-height: 2rem;
  font-family:
    "Roboto Mono",
    "Menlo",
    monospace;
}

.markdown .figure {
  padding-left: 1rem;
}

.markdown figcaption {
  font-size: 0.8rem;
  line-height: 1.25em;
  max-width: 30em;
  font-family: var(--founders-grotesk);
}

.markdown * + figcaption {
  margin-top: 0.5rem;
}

.markdown a[href] {
  color:  #00449e;
  text-decoration: underline;
}

.markdown a[href]:hover {
  color: #137752;
}

.markdown a:visited {
  color: #5e2ca5
}

.markdown img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 0.5rem;
  border: thin solid #f4f4f4;
}

.markdown ul:not(.list-none) li,
.markdown ol:not(.list-none) li {
  padding-left: 1.4rem;
  position: relative;
}

.markdown ul:not(.list-none) li + li,
.markdown ol:not(.list-none) li + li {
  margin-top: 0.5rem;
}

.markdown ul:not(.list-none) li > * + *,
.markdown ol:not(.list-none) li > * + * {
  margin-top: 0.5rem;
}

.markdown ul:not(.list-none) li > math[display=inline],
.markdown ol:not(.list-none) li > math[display=inline] {
  margin-top: 0;
}

.markdown ul:not(.list-none) li:before {
  content: "\2022";
  left: 0;
  top: 0;
  position: absolute;
}

.markdown ol {
  counter-reset: order;
}

.markdown ol > li:before {
  counter-increment: order;
  content: counter(order)".";
  left: 0;
  top: 0;
  position: absolute;
}

.markdown dl dt {
  font-weight: 700;
}

.markdown hr {
  margin: 1.5rem auto 1rem 0;
  width: 2rem;
  border-top: 0.125rem solid;
}

.markdown pre {
  line-height: 1.25;
  overflow: auto;
  padding: 0.875rem;
  white-space: pre;
  word-wrap: normal;
  border-radius: 0.5rem;
  font-size: 0.875rem;
}

/* Markdown tables */

.markdown > table {
  min-width: 100%;
  box-sizing: border-box;
}

.markdown > table:not(.table-style-none) th,
.markdown > table:not(.table-style-none) td {
  vertical-align: top;
  padding: 0.5rem;
  border-left: 1px solid rgba(0, 0, 0, 0.1);
}

.markdown > table:not(.table-style-none) th:first-child,
.markdown > table:not(.table-style-none) td:first-child {
  padding-left: 0;
  border-left: none;
}
.markdown > table:not(.table-style-none) th:last-child,
.markdown > table:not(.table-style-none) td:last-child {
  padding-right: 0;
}

.markdown > table:not(.table-style-none) tbody tr {
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}

.markdown > table:not(.table-style-none) th {
  font-family:
    Founders Grotesk,
    -apple-system,
    BlinkMacSystemFont,
    avenir next,
    avenir,
    helvetica,
    helvetica neue,
    ubuntu,
    noto,
    Roboto,
    segoe ui,
    arial,
    sans-serif;
  font-weight: bold;
  line-height: 1.125;
}

/* Markdown math */

.markdown math {
  font-family: Georgia, "Times New Roman", serif;
  font-family:
    "Latin Modern Math",
    "STIX Two Math",
    "XITS Math",
    "STIX Math",
    "Libertinus Math",
    "TeX Gyre Termes Math",
    "TeX Gyre Bonum Math",
    "TeX Gyre Schola",
    "DejaVu Math TeX Gyre",
    "TeX Gyre Pagella Math",
    "Asana Math",
    "Cambria Math",
    "Lucida Bright Math",
    "Minion Math",
    STIXGeneral,
    STIXSizeOneSym,
    Symbol,
    Georgia,
    "Times New Roman",
    serif;
  font-size: 1rem;
}

.markdown math msup > *:last-child,
.markdown math msub > *:last-child,
.markdown math mroot > *:last-child,
.markdown math msubsup > *:nth-child(2),
.markdown math msubsup > *:nth-child(3) {
  font-size: 0.75em;
}

.markdown math mtd {
  line-height: 1;
  padding: 0.375rem 0;
}

.markdown math mtd + mtd {
  padding-left: 0.375rem;
}

/* Footnotes */

.markdown .footnotes li > * + * { margin-top: 1rem; }

.markdown .footnote-ref > sup:before { content: "[" }
.markdown .footnote-ref > sup:after { content: "]" }

/* Syntax */

.markdown pre {
  background-color: #1d1f21;
  color: #ffffff;
}

.markdown pre .dt { display: inline; }
.markdown pre .fl { float: none }
.markdown pre .cf:before,
.markdown pre .cf:after { display: none }

.markdown pre .at { color: #81a2be }
.markdown pre .bu { color: #b294bb }
.markdown pre .cf { color: #b294bb }
.markdown pre .ch { color: #cc6666 }
.markdown pre .co { color: #969896 }
.markdown pre .dt { color: #f0c674 }
.markdown pre .dv { color: #de935f }
.markdown pre .ex { color: #cc6666 }
.markdown pre .fl { color: #de935f }
.markdown pre .fu { color: #81a2be }
.markdown pre .kw { color: #b294bb }
.markdown pre .ot { color: #cc6666 }
.markdown pre .st { color: #b5bd68 }
.markdown pre .va { color: #f0c674 }

.markdown pre.diff .st { color: #cc6666 }
.markdown pre.diff .va { color: #b5bd68 }

/* Markdown utils */
.markdown .wide {
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  display: flex;
}

.markdown .wide:before {
  content: "";
  display: block;
  position: sticky;
  left: 0;
  min-width: 1.6rem;
  background: linear-gradient(
    to right,
    white,
    rgba(255, 255, 255, 0)
  );
}

.markdown .wide:after {
  content: "";
  display: block;
  position: sticky;
  right: 0;
  min-width: 2rem;
  background: linear-gradient(
    to left,
    white,
    rgba(255, 255, 255, 0)
  );
}

.markdown .wide > .wide-content > * + * {
  margin-top: 1rem;
}

.fine-underline {
  background-image:
    linear-gradient(
      to top,
      transparent,
      transparent 0.125em,
      currentColor 0.125em,
      currentColor calc(0.125em + 1px),
      transparent calc(0.125em + 1px),
      transparent
    );
  text-shadow:
    -1px -1px 0 white,
    1px -1px 0 white,
    -1px 1px 0 white,
    1px 1px 0 white;
}

.g2 { gap: 0.5rem; }

.gap-3 { gap: 0.75rem; }

.grid {
  display: grid;
}

.grid > * + * {
  margin-top: 0;
}

.grid-rows-2 {
  grid-template-rows: repeat(2, minmax(0, 1fr));
}

.grid-cols-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.grid-cols-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.grid-rows-4 {
  grid-template-rows: repeat(4, minmax(0, 1fr));
}

.row-span-full { grid-row: 1 / -1; }

.col-span-full { grid-column: 1 / -1; }

.col-span-1 { grid-column: span 1 / span 1; }

.col-span-2 { grid-column: span 2 / span 2; }

.col-start-1 { grid-column-start: 1; }

.col-start-2 { grid-column-start: 2; }

/* Width */

.w-full { width: 100%; }

.min-w-full { min-width: 100%; }

.w-1\/5 { width: 20%; }

.w-1\/4 { width: 25%; }

.w-1\/3 { width: 3.333%; }

.w-2\/3 { width: 66.667%; }

.w-4\/5 { width: 80%; }

.w-max { width: max-content; }

/* Padding */

.p-2 { padding: 0.5rem }

.p-3 { padding: 0.75rem }

.p-4 { padding: 1rem }

.p-l-4 { padding-left: 1rem; }

.p-t-12 { padding-top: 3rem }

/* Border radius */

.rounded-lg { border-radius: 0.5rem; }

.rounded-full { border-radius: 9999px; }

/* Border */

.border { border-style: solid; border-width: 1px; }

.border-2 { border-style: solid; border-width: 2px; }

.border-3 { border-style: solid; border-width: 3px; }

/* Border color */

.group:hover .group-hover\:border-moon-grey { border-color: #ccc; }

/* Background colour */

.bg-white\/60 { background-color: rgb(255 255 255 / 60%) }

.group:hover .group-hover\:bg-white\/80 { background-color: rgb(255 255 255 / 80%) }

.bg-washed-orange { background-color: #ffe6d6; }

.bg-red\/20 { background-color: rgb(255 65 54 / 20%) }

.bg-orange\/20 { background-color: rgb(255 99 0 / 20%) }

.bg-yellow\/20 { background-color: rgb(255 215 0 / 20%) }

.bg-blue\/20 { background-color: rgb(53 126 221 / 20%) }

.bg-green\/20 { background-color: rgb(25 169 116 / 20%) }

/* Spacing */

.space-y-3 > * + * { margin-top: 0.75rem; }

.space-y-4 > * + * { margin-top: 1rem; }

.space-y-6 > * + * { margin-top: 1.5rem; }

.space-y-8 > * + * { margin-top: 2rem; }

/* Flex */

.flex { display: flex; }

.flex-row { flex-direction: row; }

.flex-col { flex-direction: column; }

.items-center { align-items: center; }

.shrink-0 { flex-shrink: 0; }

/* Overflow */

.overflow-x-auto { overflow-x: auto; }

.overflow-y-hidden { overflow-y: hidden; }

/* Lists */

.list-none { list-style-type: none; }

/* Tables */

.table-fixed { table-layout: fixed; }

.border-spacing-3 { border-spacing: 0.75rem; }

.border-separate { border-collapse: separate; }

.align-middle { vertical-align: middle; }

/* Text */

.text-center { text-align: center; }

.font-bold { font-weight: 700; }

/* Z-index */

.hover\:z-1:hover { z-index: 1; }

/* Position */

.relative { position: relative; }

/* Cursor */

.pointer { cursor: pointer; }

/* Screen readers */

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border-width: 0;
}

/* Word break */

.break-all { word-break: break-all; }

@media print {
   a[href^=http]:after {
    content: " (" attr(href) ")";
  }
}