@media (prefers-color-scheme: dark) {
  body {
    background: #231f1c;
    color: #e1cbb5;
    font-weight: 800;
  }
  footer {
    background-color: #1b550f !important;
  }
  header {
    background-color: #1b550f !important;
  }
  .escape-hatch {
    color: white !important;
  }
  a {
    color: #e1cbb5 !important;
  }

  input {
    background-color: bisque;
  }
}

.escape-hatch {
  text-decoration: none;
  color: black;
}

body {
  max-width: 800px;
  margin: auto;
}

header {
  background-color: rgb(118, 226, 118);
  padding: 4px;
  display: flex;
  flex-direction: row;
  gap: 1em;
}

footer {
  padding: 4px;
  background-color: green;
}

.posts {
  margin: 8px;
  display: flex;
  flex-direction: column;
  gap: 0.5em;
}

.post {
  display: flex;
  flex-direction: column;
}

.post > .title > *:nth-child(2) {
  font-size: 11px;
}

.post > div {
  display: flex;
  gap: 0.5em;
  flex-direction: row;
}