@font-face {
  font-family: "Shantell";
  font-style: normal;
  src: url("/fonts/Shantell-Sans.woff2");
  font-display: swap;
  font-weight: 1 999;
}

@font-face {
  font-family: "Figtree";
  font-style: normal;
  src: url("/fonts/Figtree.woff2");
  font-display: swap;
  font-weight: 1 999;
}

@font-face {
  font-family: "Sentient";
  font-style: normal;
  src: url("/fonts/Sentient.woff2");
  font-display: swap;
  font-weight: 1 999;
}

@font-face {
  font-family: "Sentient";
  font-style: italic;
  src: url("/fonts/Sentient-Italic.woff2");
  font-display: swap;
  font-weight: 1 999;
}

@font-face {
  font-family: "PT Mono";
  font-style: normal;
  src: url("/fonts/PT-Mono.woff2");
  font-display: swap;
  font-weight: 400;
}

@font-face {
  font-family: "PT Mono";
  font-style: normal;
  src: url("/fonts/PT-Mono-Bold.woff2");
  font-display: swap;
  font-weight: 600;
}

*:first-child,
.content p:first-child {
  margin-top: 0px;
}

p:last-child {
  margin-bottom: 0px !important;
}

h1 {
  font-size: 6.5em;
  font-weight: 900;
  display: inline-block;
  line-height: 1em;
  margin: 0px;
  margin-bottom: 0em;
}

h2 {
  font-size: 3em;
  margin-bottom: 0.3em;
  font-weight: 900;
  margin-top: 1em;
  text-align: left;
  line-height: 1.1em;
}

.content h2 {
  margin-top: 0.75em;
  font-weight: 400;
  letter-spacing: -0.04em;
}

h3 {
  font-size: 1.5em;
  margin-top: 1.5em;
  margin-bottom: 0.5em;
  font-weight: 800;
  line-height: 1.25em;
}

h3 code {
  font-size: 0.6em;
  vertical-align: top;
  margin-left: 0.5em;
  font-weight: 400;
}

h4 {
  margin: 2em 0em -0.5em 0em;
}

p {
  margin: 1em 0em;
}

.section-content p {
  display: block;
  margin: 0.7em 0em;
}

.content li p {
  margin: 0.5em 0em;
}

ul {
  margin: 1.2em 0em;
  padding: 0em 2em;
}

li > ul {
  margin: 0em 0em 1em 0em;
  padding: 0.5em 0em 0em 1.2em;
}

li {
  margin: 0.5em 0em;
}

pre {
  width: 100%;
  white-space: pre;
  background: var(--t-lightest);
  overflow-x: auto;
  color: var(--light);
  padding: 0.6em;
  border: dashed var(--theme) 1px;
}

code {
  background: var(--theme);
  color: var(--light);
  padding: 3px 5px;
  font-size: 0.8em;
}

pre code {
  background: transparent;
  color: var(--theme);
}

img,
video {
  width: 100%;
  margin-top: 0.5em;
  border-radius: var(--radius);
  max-height: 32rem;
  object-fit: cover;
}

figure {
  padding: 1em 1em 0.75em 1em;
  margin: 0px;
  /*			border: var(--border) var(--b-width) var(--theme);*/
}

figcaption {
  font-size: 0.8em;
  line-height: 1.3em;
  margin-top: 3px;
}

td,
th {
  vertical-align: top;
  padding: 0.6em 0.25em;
  font-size: 0.9em;
  line-height: 1.35em;
}

th {
  font-weight: 800;
  font-size: 1em;
}

details {
  font-size: 0.9em;
  padding: 0.5em 1.2em;
  line-height: 1.4em;
}

summary {
  margin-bottom: 1em;
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
}

a {
  color: inherit;
  text-decoration: underline;
  text-decoration-color: transparent;
  transition:
    text-decoration 0.2s ease,
    background-color 0.2s ease;
  text-underline-offset: 2.5px;
}

.content a,
.box-content a {
  background-color: var(--t-lightest);
}

.content a:hover,
.box-content a:hover {
  text-decoration-color: var(--theme);
}

.section-content a {
  text-decoration-color: var(--t-theme);
}

.section-content a:hover {
  text-decoration-color: transparent;
  background-color: var(--t-lightest);
}

.chat {
  margin: 1.5em 0em 0em 0em;
  font-size: 0.92em;
  line-height: 1.4em;
}

.chat > blockquote {
  padding: 0px;
  border: none;
  text-align: right;
  display: flex;
  flex-direction: column;
  gap: 0.5em;
  margin: 1em 0em;
}

.chat.start-them > blockquote:nth-child(even) {
  align-items: end;
}

.chat.start-me > blockquote:nth-child(odd) {
  align-items: end;
}

.chat > blockquote > p {
  padding: 0.4em 0.6em;
  width: fit-content;
  max-width: min(90%, 32em);
  border: solid 1px var(--theme);
  margin: 0px;
  text-align: left;
}

.chat.start-them > blockquote:nth-child(even) > p {
  padding: 0.4em 0.6em;
  width: fit-content;
  background: var(--t-lightest);
}

.chat.start-me > blockquote:nth-child(odd) > p {
  padding: 0.4em 0.6em;
  width: fit-content;
  background: var(--t-lightest);
}

.chat > blockquote blockquote {
  padding: 0px;
  border: none;
  opacity: 0.5;
  margin: 6px 0px -2px 0px;
  text-align: left;
}
