/* ============================================================
   Watermelon Tourmaline Fiber Networks — CRT ASCII Strict
   Version: 1.3
   Purpose: Preserve ASCII box alignment across all devices
   ============================================================ */

/* Global CRT baseline */
html, body {
  background: #000;
  color: #00ff66;
  font-family: "Roboto Mono", "Cousine", "Courier New", Courier, monospace;
  font-size: 16px;
  line-height: 16px;
  margin: 0;
  padding: 16px;
  white-space: pre;                /* preserve ASCII layout */
  overflow-x: auto;                /* horizontal scroll if needed */
  -webkit-text-size-adjust: none;  /* stop auto font scaling */
  -webkit-font-smoothing: none;    /* no anti-alias blur on mobile */
  text-rendering: geometricPrecision;
  letter-spacing: 0;
  word-spacing: 0;
}

/* Pre blocks match baseline exactly */
pre {
  white-space: pre;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  margin: 0;
  overflow-x: auto;
}

/* Simple link treatment */
a {
  color: #00ff88;
  text-decoration: none;
}
a:hover {
  color: #00ffaa;
  text-decoration: underline;
}

/* Subtle scanline overlay */
body::before {
  content: "";
  pointer-events: none;
  position: fixed;
  inset: 0;
  background: repeating-linear-gradient(
    to bottom,
    rgba(0, 255, 102, 0.05) 0px,
    rgba(0, 255, 102, 0.03) 1px,
    transparent 2px,
    transparent 4px
  );
  opacity: 0.3;
  mix-blend-mode: screen;
  z-index: 999;
}

/* Blinking cursor utility */
.blink {
  animation: blink 1.2s steps(1) infinite;
}
@keyframes blink {
  50% { opacity: 0; }
}

/* Mobile safeguard: preserve full ASCII grid, allow scroll */
@media (max-width: 700px) {
  html, body {
    width: 1024px;
    min-width: 1024px;
    overflow-x: scroll;
    overflow-y: auto;
  }
  pre {
    overflow-x: visible;
  }
}