*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

body{
  background:black url("https://www.transparenttextures.com/patterns/dark-matter.png");
  color:#33ff33;
  font-family:Courier New;
}

.container{
  width:90%;
  max-width:1200px;
  margin:40px auto;
  padding:25px;
  border:3px solid darkred;
  background:rgba(0,0,0,0.9);
  box-shadow:0 0 20px darkred inset;
}

.title{
  text-align:center;
  font-size:3rem;
  color:red;
  text-shadow:0 0 10px red;
  animation:glitch 0.25s infinite;
}

@keyframes glitch{
  0%{transform:translate(0);}
  50%{transform:translate(2px,-2px);}
  100%{transform:translate(-2px,2px);}
}

a{
  color:red;
  text-decoration:none;
}

a:hover{
  text-shadow:0 0 10px red;
}

.menu a{
  display:block;
  padding:10px;
  border:1px solid red;
  margin:8px 0;
}

input{
  padding:10px;
  background:black;
  border:1px solid red;
  color:#33ff33;
  width:100%;
}

.node{
  display:inline-block;
  padding:10px;
  margin:10px;
  border:1px solid red;
  cursor:pointer;
}

.node:hover{
  background:red;
  color:black;
}

.terminal{
  border:1px solid #33ff33;
  padding:10px;
  height:250px;
  overflow-y:auto;
}

/* GLITCH GLOBAL ALEATORIO */
body::after{
  content:"";
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  pointer-events:none;
  background:rgba(255,0,0,0.02);
  animation:noise 0.15s infinite;
}

@keyframes noise{
  0%{transform:translate(0,0);}
  25%{transform:translate(-2px,2px);}
  50%{transform:translate(2px,-2px);}
  75%{transform:translate(1px,1px);}
  100%{transform:translate(0,0);}
}