@charset "UTF-8";
:root {
  color-scheme: light dark; }

@font-face {
  font-family: "Regal";
  src: url("/fonts/woff/Regal/regal-webfont.woff2"); }

@font-face {
  font-family: "Alegreya";
  src: url("/fonts/ttf/Alegreya/Alegreya-VariableFont_wght.ttf");
  font-optical-sizing: auto;
  font-weight: 300;
  font-style: normal; }

/* Define the LaTeX-like font */
@font-face {
  font-family: "LatinModernMath";
  src: url("/fonts/otf/latin-modern-math/latinmodern-math.otf"); }

/* Apply it to your MathML tags */
math {
  font-family: "LatinModernMath";
  font-size: 110%;
  /* LaTeX math is often slightly larger than standard text */
  white-space: nowrap;
  /* Prevents text/symbols inside the math tag from wrapping */ }

body {
  color: light-dark(#333b3c, #F6F0ED);
  background-color: light-dark(#fcfcf5, #1f1e1e);
  line-height: 1.3;
  font-size: 1.1em; }

code {
  font-size: 1.20em; }

pre,
code {
  white-space: pre-wrap;
  /* Preserves line breaks/spaces, but wraps long lines */
  overflow-wrap: break-word;
  /* Forces ultra-long words/paths to break to the next line */ }

.post-listing {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-top: 0.5em;
  margin-bottom: 0.5em; }

header nav {
  width: 100%;
  display: flex;
  font-weight: 600;
  justify-content: space-around;
  margin-top: 0.5em; }

nav[role=doc-toc] ol {
  padding-left: 1em; }

a:link {
  color: light-dark(#8b1a1a, #FFE4C4);
  background-color: transparent;
  text-decoration: none; }

a:visited {
  color: light-dark(#5c3a21, #fc9dff);
  background-color: transparent;
  text-decoration: none; }

a:hover {
  color: light-dark(#1a365d, #f66);
  background-color: transparent;
  text-decoration: underline; }

a:active {
  color: #d14c23;
  background-color: transparent;
  text-decoration: underline; }

p.fancy:first-letter {
  color: light-dark(#c54025, #cc92bd);
  font-family: "Regal";
  font-size: 5.9em;
  float: left; }

article {
  background-color: light-dark(#fcfcf7, #1F1E1E);
  text-align: left;
  max-width: 80ch;
  padding: 0 2rem 2rem 2rem;
  margin: auto;
  font-family: "Alegreya", serif;
  line-height: 1.60; }

h2,
h3,
h4,
h5,
h6 {
  color: light-dark(#333, #ebf); }

/* Target the details element only when it is open */
details[open] {
  border-left: 5px solid #b882bf;
  /* Adjust color and thickness */
  padding-left: 15px;
  /* Adds space between line and text */ }

.marginnote,
.sidenote {
  float: right;
  clear: right;
  margin-right: -60%;
  width: 50%;
  margin-top: .3rem;
  margin-bottom: 0;
  font-size: 1.1rem;
  line-height: 1.3;
  vertical-align: baseline;
  position: relative; }

figure.dropcap {
  float: left;
  margin-top: 0.1em;
  margin-bottom: 0;
  margin-left: 0;
  margin-right: 0.2rem;
  line-height: 0.8; }

span svg.typst-frame {
  font-size: 1.3em; }

figure.typst-math {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  /* Enables horizontal scrolling when math is too wide */
  overflow-y: hidden;
  /* Prevents vertical scrollbar artifacts */
  margin-left: 0;
  /* Resets default browser figure margins */
  margin-right: 0;
  padding: 0.5em 0;
  /* Prevents square root tops/bottoms from clipping */
  box-sizing: border-box; }

figure.typst-math svg {
  display: flex;
  margin: auto;
  color: light-dark(#c54025, #cc92bd); }

.center {
  display: flex;
  justify-content: center;
  align-items: center; }

.intro-text::first-line,
.intro-text > :first-child::first-line {
  font-variant: all-small-caps;
  letter-spacing: .13ch; }

blockquote {
  font-style: italic; }

.typst-text use {
  fill: light-dark(#8153b8, #cec2ff); }

.typst-shape[fill="#000000"] {
  fill: light-dark(#8153b8, #f1eeef) !important; }

.typst-shape[stroke="#000000"] {
  stroke: light-dark(#8153b8, #f1eeef) !important; }

section[role="doc-endnotes"] {
  width: 80ch;
  margin-left: auto;
  margin-right: auto;
  padding: 0 1rem; }

section[role="doc-endnotes"] {
  padding-top: 1.5em;
  padding-bottom: 4.0rem;
  font-size: 0.9em; }

/* 3. List and item formatting */
section[role="doc-endnotes"] ol {
  padding-left: 0;
  margin: 0; }

section[role="doc-endnotes"] li {
  margin-bottom: 0.75rem;
  line-height: 1.5; }

/* 4. Style the footnote backlink number superscript */
section[role="doc-endnotes"] sup[role="doc-backlink"] {
  margin-right: 0.5em;
  font-weight: bold; }

sup[role="doc-noteref"] a {
  font-weight: bold;
  text-decoration: none;
  padding: 0 0.1em; }

/* Add brackets dynamically around the symbol or number */
sup[role="doc-noteref"] a::before {
  content: "{"; }

sup[role="doc-noteref"] a::after {
  content: "}"; }

sup[role="doc-noteref"] a:hover {
  text-decoration: underline; }

.tooltip {
  position: relative;
  cursor: help;
  color: light-dark(#8b1a1a, #FFE4C4);
  border-bottom: 1px dotted light-dark(#8b1a1a, #FFE4C4);
  transition: color 0.15s ease, border-color 0.15s ease;
  letter-spacing: normal;
  /* Reveal on Hover */ }
  .tooltip:hover {
    color: light-dark(#1a365d, #f66);
    border-bottom-color: light-dark(#1a365d, #f66); }
  .tooltip::after {
    content: attr(data-tooltip);
    position: absolute;
    /* Position below the text */
    top: calc(100% + 0.4em);
    left: 50%;
    /* Dynamic Theme Colors */
    background-color: light-dark(#fcfcf5, #1f1e1e);
    color: light-dark(#8b1a1a, #FFE4C4);
    border: 1px solid light-dark(#ddd, #444);
    padding: 0.4em 0.75em;
    font-size: 0.85rem;
    line-height: 1.3;
    border-radius: 4px;
    white-space: nowrap;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    z-index: 10;
    /* Hidden state + slight slide-down animation */
    opacity: 0;
    pointer-events: none;
    transform: translateX(-50%) translateY(-4px);
    transition: opacity 0.2s ease, transform 0.2s ease; }
  .tooltip:hover::after {
    opacity: 1;
    transform: translateX(-50%) translateY(0); }

.split-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  /* Left Column */
  /* Right Column */
  /* Mobile Stacked View */ }
  .split-columns > div:first-child {
    padding-left: 1rem;
    padding-right: 1rem;
    border-right: 0.12rem solid light-dark(#ddd, #444); }
  .split-columns > div:last-child {
    padding-left: 1rem;
    padding-right: 1rem; }
  @media (max-width: 640px) {
    .split-columns {
      grid-template-columns: 1fr; }
      .split-columns > div:first-child {
        padding-right: 0;
        padding-bottom: 1rem;
        border-right: none;
        /* Turns into a horizontal line between stacked columns */
        border-bottom: 1px solid light-dark(#ddd, #444); }
      .split-columns > div:last-child {
        padding-left: 0;
        padding-top: 1rem; } }
.text-with-image {
  display: flow-root;
  /* On smaller screens, un-float and center the figure */ }
  .text-with-image figure,
  .text-with-image figure > p {
    float: right;
    max-width: 40%;
    margin: 0 1rem 1rem 1.5rem;
    /* top right bottom left */ }
    .text-with-image figure img,
    .text-with-image figure > p img {
      width: 100%;
      height: auto;
      display: block;
      border-radius: 6px; }
    .text-with-image figure figcaption,
    .text-with-image figure > p figcaption {
      font-size: 0.85em;
      opacity: 0.8;
      margin-top: 0.5rem; }
  @media (max-width: 640px) {
    .text-with-image figure {
      float: right;
      margin: 0 0 1rem 1rem; } }
.ornamental-hr {
  display: flex;
  align-items: center;
  text-align: center;
  margin: 2.5rem 2.5rem, 0, 0;
  color: light-dark(#c54025, #cc92bd);
  /* Heraldic deep red / burgundy */ }

/* Left line fading in */
.ornamental-hr::before {
  content: '';
  flex: 1;
  height: 1px;
  background: linear-gradient(to right, transparent, currentColor);
  margin-right: 1.25rem; }

/* Right line fading out */
.ornamental-hr::after {
  content: '';
  flex: 1;
  height: 1px;
  background: linear-gradient(to left, transparent, currentColor);
  margin-left: 1.25rem; }

/* Symbol styling */
.ornamental-hr span {
  font-size: 1.5rem;
  line-height: 1; }

ul.symbol-list {
  list-style: none;
  padding-left: 0;
  margin: 1.25rem 0;
  /* Margin above and below the list */ }

ul.symbol-list li {
  display: flex;
  align-items: baseline;
  gap: 0.75rem;
  /* Horizontal spacing between symbol & text */
  margin-bottom: 0.6rem;
  /* Vertical spacing between list items */ }

ul.symbol-list li:last-child {
  margin-bottom: 0; }

ul.symbol-list .list-symbol {
  color: light-dark(#c54025, #cc92bd);
  /* Accent color for the symbol */
  flex-shrink: 0;
  /* Prevents the symbol from shrinking on wrap */
  font-size: 1.1em; }

ul.symbol-list .list-content {
  flex: 1; }

/* Style for code blocks with a data-lang attribute */
code[data-lang] {
  display: block;
  position: relative;
  border: 1px solid light-dark(#4a3f35, #b89b6a);
  container-type: inline-size;
  padding: 0 1.25rem 0.5rem 1.25rem;
  white-space: pre;
  overflow-x: auto;
  max-width: 100%;
  font-size: 0.9rem;
  line-height: 1.5;
  box-shadow: 1px 1px 0px 0px light-dark(#4a3f35, #b89b6a);
  margin: 1rem 0;
  /* Vintage Header Bar */ }
  code[data-lang]::before {
    content: "❖ " attr(data-lang) " ❖";
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 0.2em;
    color: light-dark(#4a3f35, #b89b6a);
    position: sticky;
    top: 0;
    left: -1.25rem;
    width: calc(100cqw + 2.5rem);
    box-sizing: border-box;
    display: block;
    z-index: 1;
    /* Explicit margins to prevent Sass parsing issues */
    margin-top: 0;
    margin-left: -1.25rem;
    margin-right: -1.25rem;
    margin-bottom: 0.8rem;
    padding: 0.4rem 0;
    text-align: center;
    background-color: light-dark(#fcfcf7, #1F1E1E);
    border-bottom: 3px double light-dark(#4a3f35, #b89b6a); }
  code[data-lang]::after {
    left: 1.25rem; }