body.test-runner {
  font: 10px Ahem;
}

article {
  position: relative;
  overflow: hidden;
}

/* a needs to precede .dragged, because the cursor rules depend on the .dragged
   block being more specific than the a block. */
a {
  display: block;

  /* Intended to help manual testers not accidentally drag the text when we
     expect them to drag the containing box. */
  cursor: not-allowed;
}

.box {
  display: block;
  border: 1px solid black;
  width: 150px;
  height: 100px;
  margin: 10px;
  float: left;
}
.dragged {
  background-color: hsla(120, 50%, 70%, 1);
  cursor: pointer;
}
.dropzone {
  border-style: dashed;
}