body {
  grid-template-columns: 1fr min(22rem, 45%) min(22rem, 45%) 1fr;
}

body > * {
  grid-column: 2/4;
}
.pre {
  grid-column: 1/2;
}
.first-col {
  grid-column: 2/3;
}
.second-col {
  grid-column: 3/4;
}
.post {
  grid-column: 4/5;
}

.pre,
.post {
  position: relative;
  font-family: byte;
  overflow: visible;
  margin-top: 1rem;
  grid-row-end: span 4;
  align-self: start;
  justify-self: center;
  width: 90%;
}

aside.post {
  margin-inline-start: 0;
}

.close {
  margin-top: 0;
  margin-bottom: 0;
}

figcaption {
  font-family: byte;
}

.post-carat::before {
  content: ">";
  position: absolute;
  font-size: 1.5em;
  color: var(--text);
  top: 1rem;
  left: -1rem;
  transform: translateY(-50%);
}

/* glowy text yoinked from https://angellurgy.neocities.org */
h1 {
  display: inline-block;
  position: relative;
  justify-self: center;
  font-family: "alien_encountersregular";
  -webkit-text-stroke-color: rgb(57, 255, 20);
  animation: anim 1s linear infinite alternate;
  -webkit-text-fill-color: rgb(57, 255, 20);
  text-shadow:
    rgb(0, 255, 140) 0px 0px 2px,
    rgb(0, 255, 140) 0px 0px 4px;
}
h2 {
  font-family: "alien_encountersregular";
  -webkit-text-stroke-color: rgb(57, 255, 20);
  animation: anim 1s linear infinite alternate;
  -webkit-text-fill-color: rgb(57, 255, 20);
  text-shadow:
    rgb(0, 255, 140) 0px 0px 2px,
    rgb(0, 255, 140) 0px 0px 4px;
}

#version {
  position: absolute;
  font-size: initial;
  bottom: 0;
  width: max-content;
  color: var(--text-light);
}
#divider {
  justify-self: center;
  max-width: 100%;
  overflow: hidden;
  white-space: nowrap;
  width: 100%;
  text-align: center;
  font-size: calc(min(33rem, 90vw) / 25);
  font-family: cactus;
  letter-spacing: calc(min(33rem, 90vw) / -350);
  -webkit-text-stroke-color: rgb(57, 255, 20);
  animation: anim 1s linear infinite alternate;
  -webkit-text-fill-color: rgb(57, 255, 20);
  text-shadow:
    rgb(0, 255, 140) 0px 0px 2px,
    rgb(0, 255, 140) 0px 0px 4px;
}
@media (max-width: 1200px) {
  body {
    grid-column-gap: 0;
  }

  .first-col,
  .second-col,
  .pre,
  .post {
    grid-column: 2 / 4; /* Full width */
    width: 100%;
  }

  .post-carat::before {
    content: "";
  }
}
