:root {
  color-scheme:light dark;
  --paper:#ffffff;
  --ink:#1f2328;
  --muted:#59636e;
  --line:#d1d9e0;
  --accent:#0969da;
  --panel:#f6f8fa;
  --code:#818b981f;
  --text-small:.75rem;
  --text-ui:.875rem;
  --text-body:1rem;
  --text-code:.8125rem;
  --text-title:clamp(1.75rem,1.5rem + 1vw,2rem);
}
* {
  box-sizing:border-box;
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:2rem;
}
body {
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji";
  font-size:var(--text-ui);
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
a {
  color:var(--accent);
  text-underline-offset:4px;
}
a:hover {
  text-decoration-thickness:2px;
}
a:focus-visible {
  outline:2px solid var(--accent);
  outline-offset:5px;
}
::selection {
  background:#0969da33;
}
.site-header,.site-footer,main {
  width:min(100% - 64px,1040px);
  margin-inline:auto;
}
.site-header {
  display:flex;
  justify-content:space-between;
  align-items:center;
  height:112px;
  border-bottom:1px solid var(--line);
}
.wordmark {
  font-family:inherit;
  font-size:1.5rem;
  font-weight:600;
  letter-spacing:normal;
  color:var(--ink);
  text-decoration:none;
}
.wordmark span:first-child {
  font-style:italic;
}
.dot {
  color:var(--accent);
}
nav {
  display:flex;
  gap:32px;
}
nav a {
  font-size:var(--text-ui);
  color:var(--ink);
  text-decoration:none;
}
nav a:hover {
  color:var(--accent);
}
.intro {
  padding:86px 0 72px;
}
.eyebrow,.section-heading>span,.post-top>span {
  font-size:var(--text-small);
  letter-spacing:.5px;
  color:var(--muted);
  font-weight:600;
}
.intro h1 {
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(48px,7vw,80px);
  font-weight:400;
  line-height:1.08;
  letter-spacing:-3px;
  margin:25px 0;
}
.lede {
  font-size:18px;
  line-height:1.8;
  color:var(--muted);
}
.section-heading {
  display:flex;
  justify-content:space-between;
  align-items:center;
  border-bottom:1px solid var(--line);
  padding-bottom:16px;
}
.section-heading h2 {
  font-size:16px;
  font-weight:600;
  margin:0;
}
.post-list p {
  margin:0;
}
.post-list br {
  display:none;
}
.post-list a {
  display:flex;
  gap:25px;
  align-items:baseline;
  color:var(--accent);
  text-decoration:none;
  padding:21px 8px;
  border-bottom:1px solid var(--line);
  font-size:var(--text-body);
  line-height:1.5;
  transition:background .15s;
}
.post-list a:after {
  content:'↗';
  margin-left:auto;
  color:var(--muted);
}
.post-list a:hover {
  background:var(--panel);
  color:var(--accent);
  text-decoration:underline;
}
.site-footer {
  display:flex;
  gap:24px;
  justify-content:space-between;
  border-top:1px solid var(--line);
  margin-top:96px;
  padding:28px 0 40px;
  font-size:var(--text-small);
  color:var(--muted);
}
.site-footer a {
  color:inherit;
  text-decoration:none;
}
.post-top,.post-bottom {
  max-width:760px;
  margin:40px auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-size:var(--text-ui);
}
.post-top a,.post-bottom a {
  text-decoration:none;
}
.prose {
  max-width:760px;
  margin:0 auto;
  overflow-wrap:anywhere;
  font-size:var(--text-body);
  line-height:1.65;
}
.prose h1 {
  font-family:inherit;
  font-size:var(--text-title);
  line-height:1.25;
  font-weight:600;
  letter-spacing:normal;
  margin:38px 0 48px;
}
.prose h2 {
  margin:2.4em 0 .7em;
  font-size:1.5rem;
  font-weight:600;
  line-height:1.25;
  letter-spacing:normal;
}
.prose h3 {
  font-size:1.25rem;
  font-weight:600;
  margin-top:2em;
  line-height:1.25;
}
.prose p,.prose ul,.prose ol {
  margin:1.25em 0;
}
.prose h4,.prose h5,.prose h6 {
  font-size:var(--text-body);
  font-weight:600;
  line-height:1.5;
}
.prose h6 {
  color:var(--muted);
}
.prose a {
  font-size:inherit;
}
.prose li {
  padding-left:5px;
}
.prose .post-date {
  margin:-32px 0 32px;
  color:var(--muted);
  font-size:var(--text-ui);
}
.prose li+li {
  margin-top:.35em;
}
.prose img {
  max-width:100%;
  height:auto;
  display:block;
  margin:30px auto;
  border-radius:4px;
}
.prose pre {
  overflow:auto;
  padding:22px;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:6px;
  font-size:var(--text-code);
  line-height:1.5;
  overflow-wrap:normal;
}
.prose code {
  font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,"Liberation Mono",monospace;
  font-size:.86em;
}
.prose pre code {
  font-size:inherit;
}
.prose :not(pre)>code {
  background:var(--code);
  padding:3px 5px;
  border-radius:3px;
}
.prose blockquote {
  border-left:3px solid var(--line);
  margin:28px 0;
  padding:1px 24px;
  color:var(--muted);
}
.prose table {
  display:block;
  overflow:auto;
  border-collapse:collapse;
  font-size:var(--text-ui);
}
.prose td,.prose th {
  padding:10px 16px;
  border:1px solid var(--line);
  text-align:left;
}
.prose th {
  background:var(--panel);
}
.prose tr:nth-child(even) {
  background:var(--panel);
}
.prose hr {
  border:0;
  border-top:1px solid var(--line);
  margin:40px 0;
}
.katex-display {
  overflow-x:auto;
  overflow-y:hidden;
  padding:12px 0;
}
.skip {
  position:absolute;
  top:-100px;
  left:20px;
  background:var(--paper);
  padding:12px;
  z-index:1;
}
.skip:focus {
  top:10px;
}
@media(prefers-color-scheme:dark) {
  :root {
    --paper:#0d1117;
    --ink:#f0f6fc;
    --muted:#9198a1;
    --line:#3d444d;
    --accent:#4493f8;
    --panel:#151b23;
    --code:#656c7633;
  }
  .prose img {
    background:#fff;
  }
}
@media(max-width:600px) {
  .site-header,.site-footer,main {
    width:calc(100% - 36px);
  }
  .site-header {
    height:84px;
  }
  .wordmark {
    font-size:1.25rem;
  }
  nav {
    gap:22px;
  }
  .intro {
    padding:55px 0 45px;
  }
  .intro h1 {
    letter-spacing:-2px;
  }
  .lede {
    font-size:16px;
  }
  .section-heading>span {
    display:none;
  }
  .post-list a {
    gap:16px;
    padding-block:19px;
  }
  .site-footer {
    flex-wrap:wrap;
    gap:12px;
    margin-top:64px;
  }
  .site-footer span {
    flex-basis:70%;
    text-align:right;
  }
  .site-footer>a:last-child {
    margin-left:auto;
  }
  .prose pre {
    padding:16px;
  }
  .post-top>span {
    display:none;
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto;
  }
  * {
    transition:none!important;
  }
}