/* src/templates/css/pages/pages.css */
#article-page {
  max-width: 740px;
  padding: 0px 20px;
  margin: 0 auto;
}
#article-page article h1 {
  margin-top: 0.8em;
  margin-bottom: 2.5em;
}
#article-page header p {
  margin: 0;
  font-family: var(--font-mono);
  font-size: calc((14 / 16) * 1em);
}
#article-page header hr {
  border-color: var(--color-border);
}
#article-page .end-symbol {
  font-family: var(--font-mono);
  text-align: center;
}
#article-page #goto-top {
  font-family: var(--font-mono);
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: var(--color-border);
  color: var(--color-code-fg);
  padding: 2px 2px;
  position: sticky;
  bottom: 20px;
  margin-left: calc(100% - 30px);
  margin-top: calc(200vh);
}
#article-list {
  max-width: 740px;
  padding: 0px 20px;
  margin: 0 auto;
}
#article-list article {
  margin-top: 3.75em;
}
#article-list .articles-ul {
  list-style-type: "\2013  ";
  padding-left: 1.4em;
  font-family: var(--font-mono);
}
:is(#article-list .articles-ul) li::marker {
  color: var(--color-red);
}
:is(#article-list .articles-ul) .entry {
  display: flex;
  align-items: baseline;
}
#article-list time {
  font-size: 0.8em;
  flex-shrink: 0;
}
#project-list {
  padding: 0px 10vw;
}
#project-list a:hover {
  -webkit-text-decoration: underline;
  text-decoration: underline;
}
#project-list .projects-list {
  list-style-type: disc;
  padding-left: 2.5em;
}
#project-list .projects-list .project {
  margin-top: 60px;
  margin-bottom: 80px;
}
#project-list .projects-list li::marker {
  color: var(--color-red);
  font-size: 20px;
}
#project-list .projects-list h2 {
  margin: 0;
  margin-bottom: 0.25em;
  font-size: calc((20 / 16) * 1em);
  font-family: var(--font-mono);
}
#project-list .projects-list h2 a {
  color: var(--color-orange);
}
#project-list .projects-list ul a {
  -webkit-text-decoration: underline;
  text-decoration: underline;
}
#project-list .projects-list p {
  max-width: 520px;
}
#project-list .projects-list ul {
  display: flex;
  font-size: calc((14 / 16) * 1em);
  gap: 15px;
  -webkit-text-decoration: underline;
  text-decoration: underline;
  font-family: var(--font-mono);
}
#project-list #other-projects {
  margin-top: 80px;
  font-size: calc((18 / 16) * 1em);
}
#project-list .other-projects-list li {
  display: flex;
  margin-left: 30px;
  margin-top: 0.75em;
}
#project-list .other-projects-list li a {
  -webkit-text-decoration: underline;
  text-decoration: underline;
  font-family: var(--font-mono);
  font-size: calc((14 / 16) * 1em);
  white-space: nowrap;
}
#project-list .other-projects-list li strong {
  color: var(--color-fg);
  font-family: var(--font-mono);
  font-size: calc((14 / 16) * 1em);
  white-space: nowrap;
}
#project-list .other-projects-list li p {
  margin: 0;
}
#project-list #work-with-me {
  margin-top: 80px;
}
@media only screen and (max-width: 842px) {
  #project-list {
    padding: 0px 20px;
  }
  #project-list .projects-list {
    padding-left: 1.5em;
    padding-right: 1.5em;
  }
  #project-list .other-projects-list li {
    margin-left: 1.5em;
    margin-right: 1.5em;
  }
}
#project-page {
  max-width: 1200px;
  padding: 0px 20px;
  margin: 0 auto;
}
#about {
  padding: 0px 10vw;
}
#about article p {
  max-width: 600px;
  margin-bottom: 2em;
}
@media only screen and (max-width: 842px) {
  #about {
    padding: 0px 20px;
  }
}
/*! tailwindcss v4.0.15 | MIT License | https://tailwindcss.com */