@charset "UTF-8";
@import "../fonts/IosevkaCustom.css";
:root {
  --font-sans: "Source Sans 3", sans-serif;
  --font-serif: "Baskervville", serif;
  --font-monospace: "Iosevka Custom", monospace;
  --line-height-prose: 1.5;
  --line-height-monospace: 1.4;
}

:root {
  --font-weight: 400;
  --font-weight-bold: 700;
  --font-weight-monospace: 400;
  --theme-background: #0f1014;
  --theme-foreground: #9898a6;
  --theme-accent-foreground: #8eb6f5;
  --theme-nav-link-foreground: #575861;
  --theme-nav-link-foreground-hover: #8eb6f5;
  --theme-icon-link-foreground: #575861;
  --theme-icon-link-foreground-hover: #ffbb88;
  --theme-muted-foreground: #43444d;
  --theme-border: 1pt solid #43444d;
  --theme-markdown-link-foreground: #8eb6f5;
  --theme-markdown-code-foreground: #ffbb88;
  --theme-footer-foreground: #575861;
  --theme-syntax-highlight-1: #c58fff;
  --theme-syntax-highlight-2: #8eb6f5;
  --theme-syntax-highlight-3: #f58ee0;
  --theme-syntax-highlight-4: #ffbb88;
  --theme-syntax-highlight-comment: #43444d;
  --theme-syntax-highlight-punctuation: #43444d;
  --noise-opacity: 0.05;
  --noise-opacity-high-dpi: 0.12;
  --noise-invert: none;
}
@media (prefers-color-scheme: light) {
  :root {
    --font-weight-bold: 650;
    --font-weight-monospace: 500;
    --theme-background: #faf4ed;
    --theme-foreground: #464261;
    --theme-accent-foreground: #56949f;
    --theme-nav-link-foreground: #797593;
    --theme-nav-link-foreground-hover: #286983;
    --theme-icon-link-foreground: #797593;
    --theme-icon-link-foreground-hover: #b4637a;
    --theme-muted-foreground: #9893a5;
    --theme-border: 1pt solid #797593;
    --theme-markdown-link-foreground: #b4637a;
    --theme-markdown-code-foreground: #286983;
    --theme-footer-foreground: #797593;
    --theme-syntax-highlight-1: #b4637a;
    --theme-syntax-highlight-2: #286983;
    --theme-syntax-highlight-3: #907aa9;
    --theme-syntax-highlight-4: #ea9d34;
    --theme-syntax-highlight-comment: #9893a5;
    --theme-syntax-highlight-punctuation: #797593;
    --noise-invert: invert(100%);
    --noise-opacity: 0.1;
  }
}

.theme-dark {
  --font-weight: 400;
  --font-weight-bold: 700;
  --font-weight-monospace: 400;
  --theme-background: #0f1014;
  --theme-foreground: #9898a6;
  --theme-accent-foreground: #8eb6f5;
  --theme-nav-link-foreground: #575861;
  --theme-nav-link-foreground-hover: #8eb6f5;
  --theme-icon-link-foreground: #575861;
  --theme-icon-link-foreground-hover: #ffbb88;
  --theme-muted-foreground: #43444d;
  --theme-border: 1pt solid #43444d;
  --theme-markdown-link-foreground: #8eb6f5;
  --theme-markdown-code-foreground: #ffbb88;
  --theme-footer-foreground: #575861;
  --theme-syntax-highlight-1: #c58fff;
  --theme-syntax-highlight-2: #8eb6f5;
  --theme-syntax-highlight-3: #f58ee0;
  --theme-syntax-highlight-4: #ffbb88;
  --theme-syntax-highlight-comment: #43444d;
  --theme-syntax-highlight-punctuation: #43444d;
  --noise-opacity: 0.05;
  --noise-opacity-high-dpi: 0.12;
  --noise-invert: none;
}

.theme-light {
  --font-weight-bold: 650;
  --font-weight-monospace: 500;
  --theme-background: #faf4ed;
  --theme-foreground: #464261;
  --theme-accent-foreground: #56949f;
  --theme-nav-link-foreground: #797593;
  --theme-nav-link-foreground-hover: #286983;
  --theme-icon-link-foreground: #797593;
  --theme-icon-link-foreground-hover: #b4637a;
  --theme-muted-foreground: #9893a5;
  --theme-border: 1pt solid #797593;
  --theme-markdown-link-foreground: #b4637a;
  --theme-markdown-code-foreground: #286983;
  --theme-footer-foreground: #797593;
  --theme-syntax-highlight-1: #b4637a;
  --theme-syntax-highlight-2: #286983;
  --theme-syntax-highlight-3: #907aa9;
  --theme-syntax-highlight-4: #ea9d34;
  --theme-syntax-highlight-comment: #9893a5;
  --theme-syntax-highlight-punctuation: #797593;
  --noise-invert: invert(100%);
  --noise-opacity: 0.1;
}

.theme-dark .theme-switcher-dark {
  display: none;
}

.theme-light .theme-switcher-light {
  display: none;
}

body:not(.theme-dark):not(.theme-light) .theme-switcher-dark {
  display: none;
}
@media (prefers-color-scheme: light) {
  body:not(.theme-dark):not(.theme-light) .theme-switcher-dark {
    display: unset;
  }
  body:not(.theme-dark):not(.theme-light) .theme-switcher-light {
    display: none;
  }
}

* {
  box-sizing: border-box;
}

html {
  height: 100%;
  scrollbar-gutter: stable;
  scrollbar-color: var(--theme-muted-foreground) var(--theme-background);
}

body {
  display: flex;
  flex-direction: column;
  position: relative;
  min-height: 100%;
  margin: 0;
  padding: 1rem 2rem;
  font-family: var(--font-sans);
  font-size: 12pt;
  font-weight: var(--font-weight);
  background: var(--theme-background);
  color: var(--theme-foreground);
  transition: all 0.5s;
}

body::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  height: 100%;
  background: url("/assets/images/noise.webp");
  background-size: 1024px;
  filter: var(--noise-invert);
  pointer-events: none;
  opacity: var(--noise-opacity);
  transition: opacity 0.5s;
}
@media (min-resolution: 2dppx) {
  body::before {
    background-size: 512px;
    opacity: var(--noise-opacity-high-dpi);
  }
}

@media print {
  body:before {
    display: none;
  }
}
.page-content,
.page-header__content,
.page-footer__content {
  max-width: 100ch;
  margin-inline: auto;
}

.page-content {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  width: 100%;
  margin-bottom: 1rem;
  animation: fade-in 0.5s;
}

@keyframes fade-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.page-header__content {
  display: flex;
  flex-direction: row;
  align-items: center;
  border-bottom: var(--theme-border);
}
.page-header__content a {
  font-family: var(--font-monospace);
  font-size: 14pt;
  display: inline-block;
  margin-block: 0.5em;
  color: var(--theme-nav-link-foreground);
}
.page-header__buttons {
  margin-left: auto;
  display: flex;
  gap: 0.6rem;
}

a {
  text-decoration: none;
  transition: color 0.1s;
  color: inherit;
}
a:hover {
  color: var(--theme-nav-link-foreground-hover);
}

.display {
  display: flex;
  flex-flow: column wrap;
  align-content: center;
  gap: 0.5rem;
  margin-block: 7.5rem;
}
.display > * {
  margin: 0;
}
.display__handle {
  font-family: var(--font-monospace);
  font-size: 22pt;
  color: var(--theme-accent-foreground);
  transition: all 0.5s;
}
.display__handle::before {
  content: "@";
  color: var(--theme-muted-foreground);
  transition: all 0.5s;
}
.display__full-name {
  font-family: var(--font-serif);
  font-weight: 500;
  font-size: 28pt;
}
.display__links {
  list-style: none;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.75rem;
  padding: 0;
  margin-top: 0.1rem;
}
.display__links a {
  color: var(--theme-icon-link-foreground);
}
.display__links a:hover {
  color: var(--theme-icon-link-foreground-hover);
}
.display__links .bi {
  font-size: 18pt;
}
.display__message {
  max-width: 80ch;
}

@media only screen and (min-width: 768px) {
  .display {
    margin-block: 15rem;
  }
  .columns {
    display: flex;
    flex-direction: row;
    gap: 2rem;
  }
  .columns > * {
    flex-basis: 100%;
  }
}
h2 {
  font-family: var(--font-sans);
  font-weight: 600;
  font-size: 20pt;
  border-bottom: var(--theme-border);
  padding-bottom: 0.2em;
  margin-bottom: 0.5em;
}

.post-preview {
  padding-block: 0.5rem;
  padding-left: 3ch;
  position: relative;
}
.post-preview::before {
  position: absolute;
  left: 0;
  content: "├─│ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ ";
  white-space: pre-wrap;
  width: 2ch;
  height: 100%;
  overflow-y: hidden;
  overflow-wrap: break-word;
  font-family: var(--font-monospace);
  font-size: 12pt;
  color: var(--theme-muted-foreground);
}
.post-preview:last-child:before {
  content: "└─";
}
.post-preview__date {
  font-family: var(--font-monospace);
  font-weight: var(--font-weight-monospace);
  font-size: 12pt;
}
.post-preview__title {
  font-family: var(--font-sans);
  font-weight: 600;
  font-size: 16pt;
  margin-top: 0.2em;
  margin-bottom: 0;
}

.project-preview {
  padding-block: 0.5rem;
}
.project-preview__header {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.project-preview__links {
  list-style: none;
  padding: 0;
  margin-left: 0.5rem;
  margin-block: 0;
}
.project-preview__title {
  margin: 0;
  font-family: var(--font-monospace);
  font-weight: var(--font-weight-monospace);
  font-size: 15pt;
}
.project-preview__description {
  margin-top: 0.5rem;
}
.project-preview__description > p {
  margin: 0;
}

.icon-button {
  background: none;
  border: none;
  color: var(--theme-icon-link-foreground);
  cursor: pointer;
  transition: color 0.1s;
  padding: 0;
}
.icon-button:hover {
  color: var(--theme-icon-link-foreground-hover);
}
.icon-button > .bi {
  font-size: 14pt;
}

.post {
  height: 100%;
}
.post__header {
  display: flex;
  flex-direction: row;
  margin-top: 1.5rem;
  margin-bottom: 0.5rem;
  color: var(--theme-muted-foreground);
}
.post__header + * {
  margin-top: 0;
}
.post__date {
  font-family: var(--font-monospace);
  font-weight: var(--font-weight-monospace);
  font-size: 12pt;
}

.comments {
  margin-top: auto;
  padding-top: 3rem;
}

.page-footer {
  margin-top: auto;
}
.page-footer__content {
  border-top: var(--theme-border);
  color: var(--theme-footer-foreground);
  padding-block: 1rem;
  text-align: right;
}

.markdown-content h1 {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: 24pt;
  margin-bottom: 1em;
}
.markdown-content p,
.markdown-content li {
  line-height: var(--line-height-prose);
  margin-block: 0.5em;
}
.markdown-content p a,
.markdown-content li a {
  color: var(--theme-markdown-link-foreground);
}
.markdown-content p a:hover,
.markdown-content li a:hover {
  text-decoration: underline;
}
.markdown-content strong {
  font-weight: var(--font-weight-bold);
}
.markdown-content code {
  font-family: var(--font-monospace);
  font-weight: var(--font-weight-monospace);
  color: var(--theme-markdown-code-foreground);
  margin-inline: 0.1em;
}
.markdown-content pre {
  line-height: var(--line-height-monospace);
  padding-left: 1rem;
  overflow-x: auto;
}
.markdown-content pre > code {
  margin-inline: 0;
  color: inherit;
}
.markdown-content pre.highlight .k,
.markdown-content pre.highlight .nb {
  color: var(--theme-syntax-highlight-1);
}
.markdown-content pre.highlight .ss,
.markdown-content pre.highlight .nf {
  color: var(--theme-syntax-highlight-2);
}
.markdown-content pre.highlight .nv {
  color: var(--theme-syntax-highlight-3);
}
.markdown-content pre.highlight .c1,
.markdown-content pre.highlight .cm {
  color: var(--theme-syntax-highlight-comment);
}
.markdown-content pre.highlight .p {
  color: var(--theme-syntax-highlight-punctuation);
}
.markdown-content pre.highlight .m,
.markdown-content pre.highlight .s2,
.markdown-content pre.highlight .sx {
  color: var(--theme-syntax-highlight-4);
}
.markdown-content p:has(> img) {
  text-align: center;
  margin-block: 1rem;
}
.markdown-content img {
  max-width: min(80ch, 100%);
}

.heading-anchor {
  font-family: var(--font-serif);
  color: var(--theme-nav-link-foreground);
  opacity: 0;
  transition: opacity 0.1s;
}

:hover > .heading-anchor {
  opacity: 1;
}

/*# sourceMappingURL=styles.css.map */