@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap');

:root {
  --background: #071703;
  --foreground: #10540e;
  --accent: #1bbc68;
}

html,
body,
code,
kbd {
  font-family: "Press Start 2P", "Courier New", monospace !important;
}

:root {
  --font-size: 0.8rem;
}

body {
  font-size: var(--font-size) !important;
}

/* Make post titles same size on list and article pages */
.post-title {
  font-size: calc(var(--font-size) * 1.45) !important;
}

@keyframes blink {
  0%, 50% { opacity: 1; }
  51%, 100% { opacity: 0; }
}

.hanchor {
  font-size: 0 !important;
  line-height: 0 !important;
  margin-left: 8px !important;
}

.hanchor::after {
  content: "";
  display: inline-block;
  font-size: 1rem;
  width: 0.6em;
  height: 1.2em;
  background-color: var(--accent);
  vertical-align: middle;
  animation: blink 1s step-end infinite;
}

/* Tighten nested ToC lists so no visual gap appears after subsections */
#TableOfContents ul {
  margin: 0;
  padding-left: 1em;
}

/* CRT monitor effect for cover images */
.crt-monitor {
  position: relative;
  display: block;
  border-radius: 20px;
  overflow: hidden;
  max-width: 640px;
  margin: 30px 0;
  box-shadow:
    0 0 12px rgba(27, 188, 104, 0.5),
    0 0 30px rgba(27, 188, 104, 0.3),
    0 0 50px rgba(27, 188, 104, 0.2);
}

.post-cover {
  display: block;
  width: 100%;
  height: auto;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 0 !important;
}

/* Vignette overlay */
.crt-overlay {
  position: absolute;
  inset: 0;
  background: radial-gradient(
    ellipse at center,
    transparent 20%,
    rgba(0, 0, 0, 0.8) 100%
  );
  pointer-events: none;
  border-radius: inherit;
  z-index: 2;
}

/* Scanlines */
.crt-scanlines {
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(
    to bottom,
    transparent 0px,
    transparent 3px,
    rgba(0, 0, 0, 0.25) 3px,
    rgba(0, 0, 0, 0.25) 6px
  );
  pointer-events: none;
  border-radius: inherit;
  z-index: 2;
}