Discovered Patterns

%absolute-corners

%absolute-corners {
  position:absolute;
  top:0;
  left:0;
  right:0;
  bottom:0;
}

Clicky Checkboxes

Each cell of the art–board is a

<td data-row="1" data-col="1">
  <input type="checkbox" id="c__17" name="c__17" value="1">
  <label for="c__17"><span>Cell B1</span></label>
</td>

The checkboxes are visually hidden as is the span within the label.

#stage input[type="checkbox] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: 0 0;
  opacity: 0
}

The label uses absolute positioning to glue itself to all for corners of the cell.

#stage input[type=checkbox]+label {
  @extend %absolute-corners;
}

And the <td> container has position:relative.

All together, this creates a keyboard focusable and accessible hidden checkbox input.

Lazy Referrer

Rather than require the possibly heavy data URI the <form> that makes up the Export widget gets the data from the Referrer Header. Kinda hack and possible unreliable but it works and shaved off a few kB for 10kApart.