:root {
    --background: #191a21;
    --midground: #44475a;
    --foreground: #f8f8f2;
    --comment: #6272a4;
    --cyan:#8be9fd;
    --green:#50fa7b;
    --orange:#ffb86c;
    --pink: #ff79c6	;
    --purple: 	#bd93f9;
    --red: 	#ff5555;
    --yellow: #f1fa8c;
    --blurple: #3C00FF;
  }

@font-face {
  font-family: 'IosevkaTerm';
  src: url('../assets/fonts/IosevkaTerm-Extended.ttf') format('truetype');
}
  
  html {
    background-color: var(--background);
  width: 100vw;
  overflow-y: scroll;
  overflow-x: hidden;
  max-width: 100vw;
      font-family: "IosevkaTerm", monospace-ui, monospace;

  }
  .crttext {
    white-space: pre-wrap;
    font-size: 16px;
    padding: 20px;
  }
  pre {
    padding-left: 20px;
      font-family: "IosevkaTerm", monospace-ui, monospace;

  }
  
  .g {
    text-shadow: var(--crt-text-shadow), 0 0 4px var(--green);
    color: var(--green);
  }
  .y {
    text-shadow: var(--crt-text-shadow), 0 0 4px var(--yellow);
    color: var(--yellow);
  }
  .r {
    text-shadow: var(--crt-text-shadow), 0 0 4px var(--red);
    color: var(--red);
  }
  .w {
    text-shadow: var(--crt-text-shadow), 0 0 4px var(--foreground);
    color: var(--foreground);
  
  }
  .bp {
    text-shadow: var(--crt-text-shadow), 0 0 4px var(--blurple);
    color: var(--blurple);
  }
  a {
    text-shadow: var(--crt-text-shadow), 0 0 4px var(--cyan);
    color: var(--cyan);
  }
  .p {
  text-shadow: var(--crt-text-shadow), 0 0 4px var(--pink);
  color: var(--pink);
}

.o {
  text-shadow: var(--crt-text-shadow), 0 0 4px var(--orange);
  color: var(--orange);
}



  .ascii-art {
    font-size: 12px;
    transform: scale(0.6); 
    transform-origin: top left;
    display: inline-block; 
    white-space: pre;
    margin: 0;
    padding: 0; 
  }
  
  @keyframes Animation5 {
      from {background-position:0% 0%}
      to {background-position:200% 0%}
  }
  
  .clip-text {
    background-image: linear-gradient(90deg, #5000ff 0%, #00ffd0 50%, #5000ff 100%);  
    background-size: cover;
    background-position: center;
    transition: 400ms ease-in-out;
      background-size: 200% 100%;
      background-position: 0% 0%;
    text-shadow: var(--crt-text-shadow);/*, 0 0 3px #2880E8;*/
    font-size: 12px;
      animation: Animation5 3s linear infinite;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent; /* set to transparent, otherwise won't see the background */
    letter-spacing: 1px;
  }