@font-face {
  font-family: "Gamecube";
  src: url("/fonts/GameCube.woff2") format("woff2");
  font-weight: normal;
  font-style: normal;
}
/* Animated post icons */
@keyframes post-pop-in {
  0% {
    opacity: 0;
    transform: translateY(12px) scale(0.6);
  }
  70% {
    opacity: 1;
    transform: translateY(-3px) scale(1.08);
  }
  100% {
    opacity: 1;
    transform: none;
  }
}
@keyframes post-float {
  0%, 100% {
    translate: 0 0;
  }
  50% {
    translate: 0 -3px;
  }
}
@keyframes post-wiggle {
  0%, 100% {
    rotate: 0deg;
  }
  25% {
    rotate: -6deg;
  }
  75% {
    rotate: 6deg;
  }
}
@keyframes post-glow {
  0%, 100% {
    box-shadow: 0 0 0 2px #fe7d04, 0 0 6px 1px rgba(254, 125, 4, 0.4);
  }
  50% {
    box-shadow: 0 0 0 2px #fe7d04, 0 0 14px 4px rgba(254, 125, 4, 0.7);
  }
}
@keyframes post-ping {
  0% {
    transform: scale(1);
    opacity: 0.9;
  }
  100% {
    transform: scale(2.6);
    opacity: 0;
  }
}
.post-selector {
  align-content: start;
}

button.post-square {
  position: relative;
  padding: 0;
  appearance: none;
  animation: post-pop-in 0.45s cubic-bezier(0.2, 0.9, 0.3, 1.2) calc(var(--i, 0) * 45ms) both, post-float 3.2s ease-in-out calc(0.6s + var(--i, 0) * 170ms) infinite;
}
button.post-square:hover {
  animation-play-state: running, paused;
}
button.post-square:hover .post-number {
  animation: post-wiggle 0.35s ease-in-out;
}
button.post-square:focus-visible {
  outline: 2px solid #fe7d04;
  outline-offset: 3px;
}
button.post-square.selected {
  background-color: #fe7d04;
  color: #1b1b3a;
  animation: post-pop-in 0.45s cubic-bezier(0.2, 0.9, 0.3, 1.2) calc(var(--i, 0) * 45ms) both, post-glow 1.8s ease-in-out infinite;
}
button.post-square .post-number {
  display: inline-block;
}
button.post-square.is-new::after {
  content: "";
  position: absolute;
  top: -4px;
  right: -4px;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #13bd7e;
  box-shadow: 0 0 0 2px #1b1b3a;
}
button.post-square.is-new::before {
  content: "";
  position: absolute;
  top: -4px;
  right: -4px;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #13bd7e;
  animation: post-ping 1.6s ease-out infinite;
}

.post-empty {
  grid-column: 1/-1;
  margin: 0;
  font-family: "MS Sans Serif", "Courier New", monospace;
}

h1.post-title {
  margin: 0;
  font-family: "MS Sans Serif", "Courier New", monospace;
}

/* Post body typography (also used by the admin preview) */
.post-body {
  line-height: 1.6;
  word-wrap: break-word;
}
.post-body > :first-child {
  margin-top: 0;
}
.post-body h2, .post-body h3, .post-body h4 {
  font-family: "MS Sans Serif", "Courier New", monospace;
  margin: 1.2em 0 0.5em;
  line-height: 1.25;
}
.post-body h2 {
  font-size: 1.4em;
}
.post-body h3 {
  font-size: 1.2em;
}
.post-body h4 {
  font-size: 1.05em;
}
.post-body p, .post-body ul, .post-body ol, .post-body blockquote, .post-body pre, .post-body table {
  margin: 0 0 1em;
}
.post-body ul, .post-body ol {
  padding-left: 1.4em;
}
.post-body a {
  color: #ffd27a;
  text-decoration: underline;
}
.post-body a:hover {
  color: #fe7d04;
}
.post-body img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0.5em 0;
  border: 2px solid #1b1b3a;
}
.post-body blockquote {
  padding: 0.4em 1em;
  border-left: 4px solid #fe7d04;
  background: rgba(0, 0, 0, 0.18);
}
.post-body code {
  font-family: "Courier New", monospace;
  background: rgba(0, 0, 0, 0.3);
  padding: 0.1em 0.35em;
}
.post-body pre {
  overflow-x: auto;
  padding: 0.8em 1em;
  background: #14132b;
  border: 2px solid #1b1b3a;
}
.post-body pre code {
  background: none;
  padding: 0;
}
.post-body hr {
  border: none;
  border-top: 2px dashed rgba(255, 255, 255, 0.35);
  margin: 1.5em 0;
}
.post-body table {
  border-collapse: collapse;
}
.post-body th, .post-body td {
  border: 1px solid rgba(255, 255, 255, 0.35);
  padding: 0.3em 0.6em;
}

.post-plain {
  white-space: pre-line;
}

@media (prefers-reduced-motion: reduce) {
  button.post-square,
  button.post-square.selected,
  button.post-square:hover .post-number,
  button.post-square.is-new::before {
    animation: none;
  }
}

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