/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */
/* flexoki | MIT License | Copyright (c) 2023 Steph Ango github.com/kepano/flexoki */
html {
  line-height: 1.15;
  -webkit-text-size-adjust:100%
}

body {
  margin:0
}

h1 {
  font-size: 2em;
  margin:0.67em 0
}

hr {
  box-sizing: content-box;
  height: 0;
  overflow:visible
}

pre {
  font-size:1em
}

a {
  background-color:transparent
}

abbr[title] {
  border-bottom: none;
  text-decoration: underline;
  text-decoration:underline dotted
}

b, strong {
  font-weight:600
}

code, kbd, samp {
  font-size:1em
}

small {
  font-size:80%
}

sub, sup {
  font-size: 85%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
  font-variant-numeric:tabular-nums
}

sub {
  bottom:-0.25em
}

sup {
  top:-0.35em
}

img {
  border-style:none
}

button, input, optgroup, select, textarea {
  font-size: 100%;
  line-height: 1.15;
  margin:0
}

button, input {
  overflow:visible
}

button, select {
  text-transform: none
}

button, [type="button"], [type="reset"], [type="submit"] {
  -webkit-appearance: button
}

button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0
}

button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring {
  outline:1px dotted ButtonText
}

fieldset {
  padding:0.35em 0.75em 0.625em
}

legend {
  box-sizing: border-box;
  color: inherit;
  display: table;
  max-width: 100%;
  padding: 0;
  white-space:normal
}

progress {
  vertical-align:baseline
}

textarea {
  overflow: auto
}

[type="checkbox"], [type="radio"] {
  box-sizing: border-box;
  padding: 0
}

[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button {
  height: auto
}

[type="search"] {
  -webkit-appearance: textfield;
  outline-offset: -2px
}

[type="search"]::-webkit-search-decoration {
  -webkit-appearance:none
}

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font:inherit
}

details {
  display:block
}

summary {
  display:list-item
}

template {
  display:none
}

[hidden] {
  display:none
}

:root {
  --font-content: -apple-system, BlinkMacSystemFont, "Inter", "IBM Plex Sans", Segoe UI, Helvetica, Arial, sans-serif;
  --font-ui: var(--font-content);
  --font-mono: IBM Plex Mono, monospace;
  --border-radius: 4px;
  --font-small: 0.875em;
  --font-smaller: 0.8em;
  --wrap-wide: 1000px;
  --wrap-normal: 37em;
  --input-width: 20em;
  --image-radius: 6px;
  --line-height: 1.5;
}

@media (max-width: 860px) {
  :root {
      --wrap-normal: 88vw;
      --wrap-wide: 100vw;
      --input-width: 100%
  }

  :root .wide {
      --border-radius: 0;
      --image-radius: 0
  }
}

:root {
  --flexoki-black: #100F0F;
  --flexoki-black-rgb: 16, 15, 15;
  --flexoki-paper: #FFFCF0;
  --flexoki-paper-rgb: 254, 252, 240;
  --flexoki-950: #1C1B1A;
  --flexoki-900: #282726;
  --flexoki-850: #343331;
  --flexoki-800: #403E3C;
  --flexoki-700: #575653;
  --flexoki-600: #6F6E69;
  --flexoki-500: #878580;
  --flexoki-300: #B7B5AC;
  --flexoki-200: #CECDC3;
  --flexoki-150: #DAD8CE;
  --flexoki-100: #E6E4D9;
  --flexoki-50: #F2F0E5;
  --flexoki-200-rgb: 206, 205, 195;
  --flexoki-red-600: #AF3029;
  --flexoki-red-400: #D14D41;
  --flexoki-orange-600: #BC5215;
  --flexoki-orange-400: #DA702C;
  --flexoki-yellow-900: #4D3A0B;
  --flexoki-yellow-600: #AD8301;
  --flexoki-yellow-400: #D0A215;
  --flexoki-yellow-100: #FCEEB8;
  --flexoki-green-600: #66800B;
  --flexoki-green-400: #879A39;
  --flexoki-cyan-950: #142625;
  --flexoki-cyan-600: #24837B;
  --flexoki-cyan-400: #3AA99F;
  --flexoki-cyan-50: #EBF2E7;
  --flexoki-blue-600: #205EA6;
  --flexoki-blue-400: #4385BE;
  --flexoki-purple-600: #5E409D;
  --flexoki-purple-400: #8B7EC8;
  --flexoki-magenta-600: #A02F6F;
  --flexoki-magenta-400: #CE5D97;
}

:root, .theme-light {
  --color-bg-primary: var(--flexoki-paper);
  --color-bg-primary-rgb: var(--flexoki-paper-rgb);
  --color-bg-secondary: var(--flexoki-50);
  --color-tx-normal: var(--flexoki-black);
  --color-tx-normal-rgb: var(--flexoki-black-rgb);
  --color-tx-muted: var(--flexoki-600);
  --color-tx-faint: var(--flexoki-300);
  --color-ui-normal: var(--flexoki-100);
  --color-ui-hover: var(--flexoki-150);
  --color-ui-active: var(--flexoki-200);
  --color-highlight: var(--flexoki-yellow-100);
  --color-action: var(--flexoki-cyan-600);
  --color-bg-hover: var(--flexoki-cyan-50);
  --color-selection: var(--flexoki-cyan-50);
  --color-re: var(--flexoki-red-600);
  --color-re-hover: var(--flexoki-red-400);
  --color-or: var(--flexoki-orange-600);
  --color-or-hover: var(--flexoki-orange-400);
  --color-ye: var(--flexoki-yellow-600);
  --color-ye-hover: var(--flexoki-yellow-400);
  --color-gr: var(--flexoki-green-600);
  --color-gr-hover: var(--flexoki-green-400);
  --color-cy: var(--flexoki-cyan-600);
  --color-cy-hover: var(--flexoki-cyan-400);
  --color-bl: var(--flexoki-blue-600);
  --color-bl-hover: var(--flexoki-blue-400);
  --color-pu: var(--flexoki-purple-600);
  --color-pu-hover: var(--flexoki-purple-400);
  --color-ma: var(--flexoki-magenta-600);
  --color-ma-hover: var(--flexoki-magenta-400)
}

.theme-dark {
  --color-bg-primary: var(--flexoki-black);
  --color-bg-primary-rgb: var(--flexoki-black-rgb);
  --color-bg-secondary: var(--flexoki-950);
  --color-tx-normal: var(--flexoki-200);
  --color-tx-normal-rgb: var(--flexoki-200-rgb);
  --color-tx-muted: var(--flexoki-500);
  --color-tx-faint: var(--flexoki-700);
  --color-ui-normal: var(--flexoki-900);
  --color-ui-hover: var(--flexoki-850);
  --color-ui-active: var(--flexoki-800);
  --color-highlight: var(--flexoki-yellow-900);
  --color-action: var(--flexoki-cyan-400);
  --color-bg-hover: var(--flexoki-cyan-950);
  --color-selection: var(--flexoki-cyan-950);
  --color-re: var(--flexoki-red-400);
  --color-re-hover: var(--flexoki-red-600);
  --color-or: var(--flexoki-orange-400);
  --color-or-hover: var(--flexoki-orange-600);
  --color-ye: var(--flexoki-yellow-400);
  --color-ye-hover: var(--flexoki-yellow-600);
  --color-gr: var(--flexoki-green-400);
  --color-gr-hover: var(--flexoki-green-600);
  --color-cy: var(--flexoki-cyan-400);
  --color-cy-hover: var(--flexoki-cyan-600);
  --color-bl: var(--flexoki-blue-400);
  --color-bl-hover: var(--flexoki-blue-600);
  --color-pu: var(--flexoki-purple-400);
  --color-pu-hover: var(--flexoki-purple-600);
  --color-ma: var(--flexoki-magenta-400);
  --color-ma-hover: var(--flexoki-magenta-600)
}

@media (prefers-color-scheme: dark) {
  :root {
    --color-bg-primary: var(--flexoki-black);
    --color-bg-primary-rgb: var(--flexoki-black-rgb);
    --color-bg-secondary: var(--flexoki-950);
    --color-tx-normal: var(--flexoki-200);
    --color-tx-normal-rgb: var(--flexoki-200-rgb);
    --color-tx-muted: var(--flexoki-500);
    --color-tx-faint: var(--flexoki-700);
    --color-ui-normal: var(--flexoki-900);
    --color-ui-hover: var(--flexoki-850);
    --color-ui-active: var(--flexoki-800);
    --color-highlight: var(--flexoki-yellow-900);
    --color-action: var(--flexoki-cyan-400);
    --color-bg-hover: var(--flexoki-cyan-950);
    --color-selection: var(--flexoki-cyan-950);
    --color-re: var(--flexoki-red-400);
    --color-re-hover: var(--flexoki-red-600);
    --color-or: var(--flexoki-orange-400);
    --color-or-hover: var(--flexoki-orange-600);
    --color-ye: var(--flexoki-yellow-400);
    --color-ye-hover: var(--flexoki-yellow-600);
    --color-gr: var(--flexoki-green-400);
    --color-gr-hover: var(--flexoki-green-600);
    --color-cy: var(--flexoki-cyan-400);
    --color-cy-hover: var(--flexoki-cyan-600);
    --color-bl: var(--flexoki-blue-400);
    --color-bl-hover: var(--flexoki-blue-600);
    --color-pu: var(--flexoki-purple-400);
    --color-pu-hover: var(--flexoki-purple-600);
    --color-ma: var(--flexoki-magenta-400);
    --color-ma-hover: var(--flexoki-magenta-600)
  }
}

.bg {
  background-color:var(--color-bg-primary)
}

.bg-2 {
  background-color:var(--color-bg-secondary)
}

.bg-tx {
  background-color:var(--color-tx-normal)
}

.bg-tx-2 {
  background-color:var(--color-tx-muted)
}

.bg-tx-3 {
  background-color:var(--color-tx-faint)
}

.bg-ui {
  background-color:var(--color-ui-normal)
}

.bg-ui-2 {
  background-color:var(--color-ui-hover)
}

.bg-ui-3 {
  background-color:var(--color-ui-active)
}

.bg-black {
  background-color:var(--flexoki-black)
}

.bg-paper {
  background-color:var(--flexoki-paper)
}

.bg-flexoki-950 {
  background-color:var(--flexoki-950)
}

.bg-flexoki-900 {
  background-color:var(--flexoki-900)
}

.bg-flexoki-850 {
  background-color:var(--flexoki-850)
}

.bg-flexoki-800 {
  background-color:var(--flexoki-800)
}

.bg-flexoki-700 {
  background-color:var(--flexoki-700)
}

.bg-flexoki-600 {
  background-color:var(--flexoki-600)
}

.bg-flexoki-500 {
  background-color:var(--flexoki-500)
}

.bg-flexoki-300 {
  background-color:var(--flexoki-300)
}

.bg-flexoki-200 {
  background-color:var(--flexoki-200)
}

.bg-flexoki-150 {
  background-color:var(--flexoki-150)
}

.bg-flexoki-100 {
  background-color:var(--flexoki-100)
}

.bg-flexoki-50 {
  background-color:var(--flexoki-50)
}

.bg-re {
  background-color:var(--color-re)
}

.bg-or {
  background-color:var(--color-or)
}

.bg-ye {
  background-color:var(--color-ye)
}

.bg-gr {
  background-color:var(--color-gr)
}

.bg-cy {
  background-color:var(--color-cy)
}

.bg-bl {
  background-color:var(--color-bl)
}

.bg-pu {
  background-color:var(--color-pu)
}

.bg-ma {
  background-color:var(--color-ma)
}

.bg-re-2 {
  background-color:var(--color-re-hover)
}

.bg-or-2 {
  background-color:var(--color-or-hover)
}

.bg-ye-2 {
  background-color:var(--color-ye-hover)
}

.bg-gr-2 {
  background-color:var(--color-gr-hover)
}

.bg-cy-2 {
  background-color:var(--color-cy-hover)
}

.bg-bl-2 {
  background-color:var(--color-bl-hover)
}

.bg-pu-2 {
  background-color:var(--color-pu-hover)
}

.bg-ma-2 {
  background-color:var(--color-ma-hover)
}

.bg-red-600 {
  background-color:var(--flexoki-red-600)
}

.bg-orange-600 {
  background-color:var(--flexoki-orange-600)
}

.bg-yellow-600 {
  background-color:var(--flexoki-yellow-600)
}

.bg-green-600 {
  background-color:var(--flexoki-green-600)
}

.bg-cyan-600 {
  background-color:var(--flexoki-cyan-600)
}

.bg-blue-600 {
  background-color:var(--flexoki-blue-600)
}

.bg-purple-600 {
  background-color:var(--flexoki-purple-600)
}

.bg-magenta-600 {
  background-color:var(--flexoki-magenta-600)
}

.bg-red-400 {
  background-color:var(--flexoki-red-400)
}

.bg-orange-400 {
  background-color:var(--flexoki-orange-400)
}

.bg-yellow-400 {
  background-color:var(--flexoki-yellow-400)
}

.bg-green-400 {
  background-color:var(--flexoki-green-400)
}

.bg-cyan-400 {
  background-color:var(--flexoki-cyan-400)
}

.bg-blue-400 {
  background-color:var(--flexoki-blue-400)
}

.bg-purple-400 {
  background-color:var(--flexoki-purple-400)
}

.bg-magenta-400 {
  background-color:var(--flexoki-magenta-400)
}

.gap1 {
  gap:1rem
}

.pa {
  padding:1rem
}

.pt {
  padding-top:1rem
}

.pr {
  padding-right:1rem
}

.pb {
  padding-bottom:1rem
}

.pl {
  padding-left:1rem
}

.ppa {
  padding:2rem
}

.ppt {
  padding-top:2rem
}

.ppr {
  padding-right:2rem
}

.ppb {
  padding-bottom:2rem
}

.ppl {
  padding-left:2rem
}

.pn1 {
  padding-top:2rem
}

.pn2 {
  padding-top:4rem
}

.pn3 {
  padding-top:6rem
}

.pn4 {
  padding-top:8rem
}

.ps1 {
  padding-bottom:2rem
}

.ps2 {
  padding-bottom:4rem
}

.ps3 {
  padding-bottom:6rem
}

.ps4 {
  padding-bottom:8rem
}

.st {
  margin-top:1rem
}

.sr {
  margin-right:1rem
}

.sb {
  margin-bottom:1rem
}

.sl {
  margin-left:1rem
}

.sst {
  margin-top:2rem
}

.ssr {
  margin-right:2rem
}

.ssb {
  margin-bottom:2rem
}

.ssl {
  margin-left:2rem
}

.mn1 {
  margin-top:2rem
}

.mn2 {
  margin-top:4rem
}

.mn3 {
  margin-top:6rem
}

.mn4 {
  margin-top:8rem
}

.ms1 {
  margin-bottom:2rem
}

.ms2 {
  margin-bottom:4rem
}

.ms3 {
  margin-bottom:6rem
}

.ms4 {
  margin-bottom:8rem
}

*, * :before, * :after {
  box-sizing:inherit
}

::selection {
  background:var(--color-selection)
}

::-moz-selection {
  background:var(--color-selection)
}

html {
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  font-size:62.5%
}

body {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  background-color: var(--color-bg-primary);
  font-family: var(--font-content);
  margin: 2vw auto 0 auto;
  line-height: var(--line-height);
  padding: 2rem 0 24rem;
  overflow-x: hidden;
  /* font-size: 1.8rem; */
  font-size: calc(1.5rem + 0.25vw);
  color: var(--color-tx-normal);
}

#tooltip-wrapper {
  background: var(--color-bg-primary);
  padding: 1.5em;
  border: 1px solid var(--color-ui-normal);
  border-radius: 6px;
  overflow: scroll;
  position: absolute;
  width: 400px;
  max-width: 70vw;
  height: 350px;
  max-height: 70vh;
  font-size: 0.825em;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
  opacity: 0;
  transition:opacity 100ms
}

small, .small {
  font-size: var(--font-small);
  line-height:1.4
}

.smaller {
  font-size: var(--font-smaller);
  line-height:1.4
}

.font-ui {
  font-family:var(--font-ui)
}

.font-content {
  font-family:var(--font-content)
}

.font-mono {
  font-family:var(--font-mono)
}

mark {
  background-color: var(--color-highlight);
  color:var(--color-tx-normal)
}

footer {
  margin: 2em auto;
  max-width: var(--wrap-wide);
  width: var(--wrap-normal);
  padding-top:1em
}

iframe, video {
  border-radius: var(--border-radius);
  display:block
}

p {
  max-width: var(--wrap-normal)
}

blockquote {
  padding-left: 1.5em;
  margin: 1.5em 0;
  border-left:2px solid var(--color-tx-normal)
}

blockquote p {
  margin:0
}

.l {
  text-align:left
}

.r {
  text-align:right
}

.c {
  text-align:center
}

.cc {
  margin-left: auto;
  margin-right:auto
}

.vt {
  vertical-align:top
}

.ba {
  border:1px solid var(--color-ui-normal)
}

.bt {
  border-top:1px solid var(--color-ui-normal)
}

.br {
  border-right:1px solid var(--color-ui-normal)
}

.bb {
  border-bottom:1px solid var(--color-ui-normal)
}

.bl {
  border-left:1px solid var(--color-ui-normal)
}

.ra {
  border-radius: var(--border-radius);
  overflow:hidden
}

hr {
  width: 100%;
  border: 0;
  height: 1px;
  margin: 1.5em 0;
  background:var(--color-ui-normal)
}

content {
  display: block;
  max-width: var(--wrap-wide);
  width: var(--wrap-normal);
  margin-left: auto;
  margin-right:auto
}

content img {
  margin-bottom:0.5em
}

content .wide {
  padding: 1.5em 0;
  max-width: Min(100vw, var(--wrap-wide));
  width: Min(100vw, var(--wrap-wide));
  margin-left:calc((Min(100vw, var(--wrap-wide)) - 100%)/-2)
}

figure {
  margin: 0;
  padding: 1.5em 0;
  text-align:center
}

figcaption {
  font-size: var(--font-smaller);
  line-height: 1.4;
  color: var(--color-tx-muted);
  padding:1em
}

figcaption a {
  color:var(--color-tx-muted)
}

.fr {
  float:right
}

flex, .flex {
  display:flex
}

.align-center {
  align-items:center
}

.align-baseline {
  align-items:baseline
}

.flex-grow {
  flex-grow:1
}

.flex-shrink {
  flex-shrink:1
}

.grid {
  display:grid
}

.grid-columns {
  grid-auto-flow: column;
  grid-auto-columns:1fr
}

.nowrap {
  white-space:nowrap
}

.font-normal {
  font-weight:400
}

.tabular-nums {
  font-variant-numeric:tabular-nums
}

.line-height-loose {
  line-height:1.6
}

.line-height-tight {
  line-height:1.3
}

.wrap {
  max-width: var(--wrap-normal);
  margin-left: auto;
  margin-right:auto
}

content hr {
  margin-top: 3rem;
  margin-bottom: 1rem;
  margin-top: calc(2em + 2vh);
  margin-bottom: calc(2em + 2vh);
  display: block;
  border: 0;
  background: none;
  text-align: center;
  overflow:visible
}

content hr:before {
  content: '\2022\2022\2022';
  display: inline-block;
  font-size: .5em;
  font-size: calc(.8em + .2vw);
  margin-left: 0.6em;
  letter-spacing: 1.25em;
  color: var(--color-tx-faint);
  position: relative;
  top:-0.75em
}

.muted {
  color:var(--color-tx-muted)
}

.muted a {
  color:var(--color-tx-muted)
}

.faint {
  color:var(--color-tx-faint)
}

.action {
  color:var(--color-action)
}

.font-medium {
  font-weight:500
}

nav {
  margin: 0 auto 3em;
  width: var(--wrap-normal);
  max-width:var(--wrap-wide)
}

@media (max-width: 600px) {
  .mh {
      display:none
  }

  .mobile-grid-rows {
      grid-auto-flow:row
  }
}

.backlinks {
  display: grid;
  gap: 0.5em;
  grid-template-columns:repeat(2, 1fr)
}

.backlink {
  border: 1px solid var(--color-ui-normal);
  padding: 1em;
  border-radius: var(--border-radius);
  line-height:1.3
}

.backlink:hover {
  border-color:var(--color-ui-hover)
}

@media (max-width: 600px) {
  .backlinks {
      grid-template-columns:repeat(1, 1fr)
  }
}

pre, code {
  font-family: var(--font-mono);
  background: var(--color-bg-secondary);
  padding: 0.1em 0.2em;
  border-radius: 4px;
  font-size:90%
}

pre code {
  background-color:transparent
}

div.highlight {
  display:grid
}

.highlight {
  border-radius: 4px;
  overflow: auto;
  margin:1em 0
}

.highlight .c {
  color:var(--color-tx-faint)
}

.highlight .err {
  color:var(--color-re)
}

.highlight .k {
  color:var(--color-gr)
}

.highlight .p {
  color:var(--color-tx-muted)
}

.highlight .cm {
  color:var(--color-tx-faint)
}

.highlight .cp {
  color:var(--color-tx-faint)
}

.highlight .c1 {
  color:var(--color-tx-faint)
}

.highlight .cs {
  color:var(--color-tx-faint)
}

.highlight .ge {
  font-style:italic
}

.highlight .gr {
  color:var(--color-re)
}

.highlight .gh {
  color:var(--color-tx-faint)
}

.highlight .go {
  color:var(--color-tx-muted)
}

.highlight .gp {
  color:var(--color-tx-muted)
}

.highlight .gu {
  color:var(--color-tx-muted)
}

.highlight .gt {
  color:var(--color-re)
}

.highlight .kc {
  color:var(--color-bl)
}

.highlight .kd {
  color:var(--color-bl)
}

.highlight .kp {
  color:var(--color-bl)
}

.highlight .kr {
  color:var(--color-bl)
}

.highlight .kt {
  color:var(--color-bl)
}

.highlight .m {
  color:var(--color-pu)
}

.highlight .s {
  color:var(--color-gr)
}

.highlight .na {
  color:var(--color-or)
}

.highlight .nb {
  color:var(--color-gr)
}

.highlight .nc {
  color:var(--color-bl)
}

.highlight .no {
  color:var(--color-cy)
}

.highlight .nn {
  color:var(--color-tx-muted)
}

.highlight .nv {
  color:var(--color-cy)
}

.highlight .o {
  color:var(--color-re)
}

.highlight .w {
  color:var(--color-tx-faint)
}

.highlight .mf {
  color:var(--color-pu)
}

.highlight .mh {
  color:var(--color-pu)
}

.highlight .mi {
  color:var(--color-pu)
}

.highlight .mo {
  color:var(--color-pu)
}

.highlight .sb {
  color:var(--color-gr)
}

.highlight .sc {
  color:var(--color-gr)
}

.highlight .sd {
  color:var(--color-gr)
}

.highlight .s2 {
  color:var(--color-cy)
}

.highlight .se {
  color:var(--color-re)
}

.highlight .sh {
  color:var(--color-gr)
}

.highlight .si {
  color:var(--color-gr)
}

.highlight .sx {
  color:var(--color-gr)
}

.highlight .sr {
  color:var(--color-re)
}

.highlight .s1 {
  color:var(--color-cy)
}

.highlight .ss {
  color:var(--color-re)
}

.highlight .bp {
  color:var(--color-tx-faint)
}

.highlight .vc {
  color:var(--color-cy)
}

.highlight .vg {
  color:var(--color-cy)
}

.highlight .vi {
  color:var(--color-cy)
}

.highlight .il {
  color:var(--color-pu)
}

.footnote {
  color: var(--color-tx-muted);
  text-decoration: none;
  font-weight: 500;
  padding-left:0.1em
}

.reversefootnote {
  color: var(--color-tx-muted);
  text-decoration:none
}

.footnotes {
  padding-top:4em
}

.footnotes:before {
  content: "Footnotes";
  padding-bottom: 0.25em;
  color: var(--color-tx-muted);
  display:block
}

.footnotes li p {
  margin-block-start: 0.5em;
  margin-block-end:0.5em
}

h1, h2, h3, h4, h5, h6 {
  line-height: 1.3;
  margin-bottom: 0;
  padding-bottom:0
}

h1 {
  font-weight: 500;
  font-size: 2em;
  font-size: calc(1.1em + 1vw);
  letter-spacing: -0.02em;
  line-height: 1.25;
  margin-top: 1.5em;
  margin-bottom:0.25em
}

h2 {
  font-weight: 500;
  font-size: 1.4em;
  font-size: calc(1em + 0.2vw);
  letter-spacing: -0.015em;
  margin-top: 1em;
  margin-bottom: 0.5em;
  line-height:1.3
}

h3 {
  font-weight: 500;
  font-size: 1.2em;
  font-size: 1em;
  line-height: 1.3;
  margin-top: 1em;
  margin-bottom:0.5em
}

h4 {
  font-size: 1em;
  font-weight: 600;
  line-height: 1.3;
  margin-top:1em
}

h5 {
  font-weight: 700;
  line-height: 1.25;
  text-transform: uppercase;
  margin-bottom: 1em;
  letter-spacing: 0.05em;
  font-size:1.4rem
}

content h2 {
  margin-top:2em
}

content h1 + h2, content h2 + h3 {
  margin-top:1em
}

content h3 {
  margin-top:1.5em
}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
  color: var(--color-tx-normal);
  text-decoration:none
}

h1 a, h1 a:visited, h1 a:link {
  color:var(--color-tx-normal)
}

h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover {
  color: var(--color-tx-muted);
  text-decoration:none
}

img {
  max-width: 100%;
  display: block;
  border-radius:var(--image-radius)
}

body:not(.theme-dark) .multiply {
  mix-blend-mode:multiply
}

.desaturate {
  filter:grayscale(100%)
}

.theme-dark .invert {
  filter:invert(1)
}

.theme-dark .invert.multiply {
  mix-blend-mode:screen
}

.hover-color {
  filter: grayscale(100%);
  transition:filter 0.2s ease-in-out
}

.hover-color:hover {
  filter: grayscale(0%);
  transition:filter 0.2s ease-in-out
}

img.outline {
  border:1px solid var(--color-ui-normal)
}

.aspect-square {
  aspect-ratio: 1 / 1;
  object-fit:cover
}

* {
  -webkit-tap-highlight-color:rgba(0, 0, 0, 0)
}

a {
  color: var(--color-tx-normal);
  text-decoration:underline
}

a:hover {
  color: var(--color-action);
  border-color:var(--color-action)
}

a:focus {
  outline: none;
  background-color:var(--color-bg-hover)
}

a.plain, a.muted {
  text-decoration:none
}

content a:not(.plain):not(.tag):not(.internal-link):not(.footnote):not(.reversefootnote) {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='2.5' stroke='gray' class='w-6 h-6'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M4.5 19.5l15-15m0 0H8.25m11.25 0v11.25' /%3E%3C/svg%3E%0A");
  background-position: right 33%;
  background-repeat: no-repeat;
  background-size: 0.7em;
  padding-right:0.75em
}

.internal-links a {
  background-image: none;
}

.invalid-link {
  color: var(--color-tx-muted);
  text-decoration: underline;
  text-decoration-color: var(--color-ui-normal);
  cursor:not-allowed
}

ul > li {
  list-style:disc
}

ol, ul {
  padding: 0.5rem 0 1rem 1em;
  margin:0 0 0 0.5em
}

ol > li, ul > li {
  padding:0.15rem 0
}

ol > li::marker, ul > li::marker {
  color:var(--color-tx-faint)
}

@media (min-width: 600px) {
  ul.list-plain {
      padding-inline-start: 0;
      margin-left:0
  }

  ul.list-plain > li {
      list-style:none
  }
}

@media (max-width: 600px) {
  ol > li, ul > li {
      padding:0.25rem 0
  }
}

table {
  margin-top: 1.5em;
  margin-bottom: 2.5em;
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
  font-size:90%
}

tr {
  border-bottom:1px solid var(--color-ui-normal)
}

td {
  padding:0.5em 0
}

th {
  text-align: left;
  font-weight:600
}

.tag {
  border: 1px solid var(--color-ui-normal);
  padding: 0.1em 0.5em 0.15em;
  border-radius: 1em;
  font-size: var(--font-smaller);
  color: var(--color-tx-muted);
  line-height: 2;
  text-decoration:none
}

.tag:hover {
  box-shadow: none;
  border-radius:1em
}

input, textarea, select {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  color:var(--color-tx-normal)
}

label {
  color: var(--color-tx-normal);
  display: block;
  padding:0 0 0.2em 0
}

input:focus {
  outline:none
}

::-webkit-input-placeholder {
  color:var(--color-tx-muted)
}

::-moz-placeholder {
  color:var(--color-tx-muted)
}

::-ms-placeholder {
  color:var(--color-tx-muted)
}

::placeholder {
  color: var(--color-tx-muted)
}

input[type="text"], input[type="email"], input[type="password"], textarea {
  border-radius: 0;
  background-color: transparent;
  border: 1px solid transparent;
  border-bottom: 1px solid var(--color-ui-normal);
  margin-bottom: 1.5em;
  padding: .5em 0
}

input[type="text"]:focus, input[type="email"]:focus, input[type="password"]:focus, textarea:focus {
  border-bottom: 1px solid var(--color-action)
}

input[type="text"], input[type="email"], input[type="password"] {
  width: var(--input-width)
}

input[type="submit"], button {
  -webkit-appearance: none;
  border-radius: 3px;
  background-color: var(--color-tx-normal);
  border: 1px solid var(--color-tx-normal);
  color: var(--color-bg-primary);
  font-weight: 400;
  padding: 0.5em 1em
}

input[type="submit"]:hover, button:hover {
  border: 1px solid var(--color-action);
  background-color: var(--color-action);
  cursor:pointer
}

#theme-toggle {
  height: 20px;
  width: 36px;
  display: block;
  position: relative;
  border: none;
  cursor: pointer;
  float:right
}

#theme-toggle:hover .theme-toggle-switch {
  background-color:var(--color-action)
}

.theme-toggle-slide {
  height: 20px;
  border: 1px solid var(--color-ui-normal);
  border-radius: 24px;
  width: 100%;
  position:absolute
}

.theme-toggle-switch {
  position: absolute;
  z-index: 9;
  top: 1px;
  left: 1px;
  right: auto;
  width: 18px;
  height: 18px;
  transition: left 0.1s linear;
  background-color: var(--color-tx-muted);
  -webkit-mask-size: 18px;
  -webkit-mask-position: 50% 50%;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='currentColor' %3E%3Cpath fill-rule='evenodd' d='M10 2a1 1 0 011 1v1a1 1 0 11-2 0V3a1 1 0 011-1zm4 8a4 4 0 11-8 0 4 4 0 018 0zm-.464 4.95l.707.707a1 1 0 001.414-1.414l-.707-.707a1 1 0 00-1.414 1.414zm2.12-10.607a1 1 0 010 1.414l-.706.707a1 1 0 11-1.414-1.414l.707-.707a1 1 0 011.414 0zM17 11a1 1 0 100-2h-1a1 1 0 100 2h1zm-7 4a1 1 0 011 1v1a1 1 0 11-2 0v-1a1 1 0 011-1zM5.05 6.464A1 1 0 106.465 5.05l-.708-.707a1 1 0 00-1.414 1.414l.707.707zm1.414 8.486l-.707.707a1 1 0 01-1.414-1.414l.707-.707a1 1 0 011.414 1.414zM4 11a1 1 0 100-2H3a1 1 0 000 2h1z' clip-rule='evenodd' /%3E%3C/svg%3E")
}

.theme-dark .theme-toggle-switch {
  left: 16px;
  background-color: var(--color-tx-normal);
  transition: left 0.1s linear;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 24 24' %3E%3Cpath d='M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003 9.003 0 008.354-5.646z' /%3E%3C/svg%3E")
}


.author-photo-img {
  display: inline-flex;
  width: 6rem;
  height: 6rem;
  border-radius: 100px;
  max-width: 6rem;
}
