#container {
  display: flex;
  gap: 32px;
}

.region-container {
  display: flex;
  flex-direction: column;

  border: 2px solid;
  padding: 16px;

  gap: 8px;

  width: 640px;
  height: 822px;
}

.region-title {
  margin-bottom: 8px;
}

#editor {
}

#editor-code {
}

#editor-code-title {
}

#editor-code-editor {
  resize: none;
}

#runner {
}

#runner-title {
}

#runner-container {
}

#runner-controls {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

#runner-button-container {
}

#runner-debug-container {
}

#runner-canvas {
}

#analyser {
}

#analyser-title {
}

#analyser-container {
  width: 400px;
}

#analyser-register-container {
  display: flex;
  flex-direction: column;
}

#analyser-flags-container {
  display: flex;
  gap: 8px;
}

.analyser-sub-container {
  display: flex;
  flex-direction: row;

  gap: 16px;
}

.analyser-field {
  margin: 0;

  font: monospace;
}