/* Lab 04: The Garden – a small white isometric landscape drawn in black lines, where the clock man sows
   his field and harvests the projects that grow from it */

html,
body {
  margin: 0;
  height: 100%;
  overflow: hidden; /* the page never scrolls – scrolling and pinching zoom */
  overscroll-behavior: none;
  background: #ffffff;
}

.garden {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  touch-action: none;
}

/* A harvested project's title, in a cloud that floats up, breaks into bubbles and dissolves.
   Everything is placed and moved from script.js; the cloud's centre is at the element's position */
.clouds {
  position: fixed;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
}

.cloud {
  position: absolute;
  top: 0;
  left: 0;
}

/* The cloud is a heap of circles. Each has its own outline; while they are one cloud, a layer of
   plain white circles on top hides the outlines inside, so only the cloud's outer edge shows */
.puff,
.puff-fill {
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 50%;
  background: #ffffff;
}

.puff {
  box-shadow: inset 0 0 0 2px #000000; /* a 2px black line, drawn inside */
}

.cloud-title {
  position: absolute;
  top: 0;
  left: 0;
  white-space: nowrap;
  font: 14px/18px "Suisse Intl", sans-serif;
  letter-spacing: -0.01em;
  text-transform: uppercase;
  color: #000000;
  transform: translate(-50%, -50%);
}

.cloud-title span {
  display: inline-block;
  white-space: pre;
}

/* Night: the clouds turn dark with light lines, like the rest of the drawing */
.lab-dark .puff,
.lab-dark .puff-fill {
  background: #1d2130;
}

.lab-dark .puff {
  box-shadow: inset 0 0 0 2px #e6e6e6;
}

.lab-dark .cloud-title {
  color: #e6e6e6;
}

/* Z z z – floating up from the roof while he sleeps */
.snore {
  position: absolute;
  top: 0;
  left: 0;
  font-family: "Suisse Intl", sans-serif;
  color: #e6e6e6;
}

/* A retro cursor: the old pixel arrow, and the pointing hand over anything you can click (drawn here,
   pixel by pixel, at 2 screen pixels each). The same by day and by night */
html,
html.lab-dark {
  --cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='38' shape-rendering='crispEdges'%3E%3Crect x='0' y='0' width='2' height='2' fill='%23000'/%3E%3Crect x='0' y='2' width='2' height='2' fill='%23000'/%3E%3Crect x='2' y='2' width='2' height='2' fill='%23000'/%3E%3Crect x='0' y='4' width='2' height='2' fill='%23000'/%3E%3Crect x='2' y='4' width='2' height='2' fill='%23fff'/%3E%3Crect x='4' y='4' width='2' height='2' fill='%23000'/%3E%3Crect x='0' y='6' width='2' height='2' fill='%23000'/%3E%3Crect x='2' y='6' width='2' height='2' fill='%23fff'/%3E%3Crect x='4' y='6' width='2' height='2' fill='%23fff'/%3E%3Crect x='6' y='6' width='2' height='2' fill='%23000'/%3E%3Crect x='0' y='8' width='2' height='2' fill='%23000'/%3E%3Crect x='2' y='8' width='2' height='2' fill='%23fff'/%3E%3Crect x='4' y='8' width='2' height='2' fill='%23fff'/%3E%3Crect x='6' y='8' width='2' height='2' fill='%23fff'/%3E%3Crect x='8' y='8' width='2' height='2' fill='%23000'/%3E%3Crect x='0' y='10' width='2' height='2' fill='%23000'/%3E%3Crect x='2' y='10' width='2' height='2' fill='%23fff'/%3E%3Crect x='4' y='10' width='2' height='2' fill='%23fff'/%3E%3Crect x='6' y='10' width='2' height='2' fill='%23fff'/%3E%3Crect x='8' y='10' width='2' height='2' fill='%23fff'/%3E%3Crect x='10' y='10' width='2' height='2' fill='%23000'/%3E%3Crect x='0' y='12' width='2' height='2' fill='%23000'/%3E%3Crect x='2' y='12' width='2' height='2' fill='%23fff'/%3E%3Crect x='4' y='12' width='2' height='2' fill='%23fff'/%3E%3Crect x='6' y='12' width='2' height='2' fill='%23fff'/%3E%3Crect x='8' y='12' width='2' height='2' fill='%23fff'/%3E%3Crect x='10' y='12' width='2' height='2' fill='%23fff'/%3E%3Crect x='12' y='12' width='2' height='2' fill='%23000'/%3E%3Crect x='0' y='14' width='2' height='2' fill='%23000'/%3E%3Crect x='2' y='14' width='2' height='2' fill='%23fff'/%3E%3Crect x='4' y='14' width='2' height='2' fill='%23fff'/%3E%3Crect x='6' y='14' width='2' height='2' fill='%23fff'/%3E%3Crect x='8' y='14' width='2' height='2' fill='%23fff'/%3E%3Crect x='10' y='14' width='2' height='2' fill='%23fff'/%3E%3Crect x='12' y='14' width='2' height='2' fill='%23fff'/%3E%3Crect x='14' y='14' width='2' height='2' fill='%23000'/%3E%3Crect x='0' y='16' width='2' height='2' fill='%23000'/%3E%3Crect x='2' y='16' width='2' height='2' fill='%23fff'/%3E%3Crect x='4' y='16' width='2' height='2' fill='%23fff'/%3E%3Crect x='6' y='16' width='2' height='2' fill='%23fff'/%3E%3Crect x='8' y='16' width='2' height='2' fill='%23fff'/%3E%3Crect x='10' y='16' width='2' height='2' fill='%23fff'/%3E%3Crect x='12' y='16' width='2' height='2' fill='%23fff'/%3E%3Crect x='14' y='16' width='2' height='2' fill='%23fff'/%3E%3Crect x='16' y='16' width='2' height='2' fill='%23000'/%3E%3Crect x='0' y='18' width='2' height='2' fill='%23000'/%3E%3Crect x='2' y='18' width='2' height='2' fill='%23fff'/%3E%3Crect x='4' y='18' width='2' height='2' fill='%23fff'/%3E%3Crect x='6' y='18' width='2' height='2' fill='%23fff'/%3E%3Crect x='8' y='18' width='2' height='2' fill='%23fff'/%3E%3Crect x='10' y='18' width='2' height='2' fill='%23fff'/%3E%3Crect x='12' y='18' width='2' height='2' fill='%23fff'/%3E%3Crect x='14' y='18' width='2' height='2' fill='%23fff'/%3E%3Crect x='16' y='18' width='2' height='2' fill='%23fff'/%3E%3Crect x='18' y='18' width='2' height='2' fill='%23000'/%3E%3Crect x='0' y='20' width='2' height='2' fill='%23000'/%3E%3Crect x='2' y='20' width='2' height='2' fill='%23fff'/%3E%3Crect x='4' y='20' width='2' height='2' fill='%23fff'/%3E%3Crect x='6' y='20' width='2' height='2' fill='%23fff'/%3E%3Crect x='8' y='20' width='2' height='2' fill='%23fff'/%3E%3Crect x='10' y='20' width='2' height='2' fill='%23fff'/%3E%3Crect x='12' y='20' width='2' height='2' fill='%23000'/%3E%3Crect x='14' y='20' width='2' height='2' fill='%23000'/%3E%3Crect x='16' y='20' width='2' height='2' fill='%23000'/%3E%3Crect x='18' y='20' width='2' height='2' fill='%23000'/%3E%3Crect x='20' y='20' width='2' height='2' fill='%23000'/%3E%3Crect x='0' y='22' width='2' height='2' fill='%23000'/%3E%3Crect x='2' y='22' width='2' height='2' fill='%23fff'/%3E%3Crect x='4' y='22' width='2' height='2' fill='%23fff'/%3E%3Crect x='6' y='22' width='2' height='2' fill='%23000'/%3E%3Crect x='8' y='22' width='2' height='2' fill='%23fff'/%3E%3Crect x='10' y='22' width='2' height='2' fill='%23fff'/%3E%3Crect x='12' y='22' width='2' height='2' fill='%23000'/%3E%3Crect x='0' y='24' width='2' height='2' fill='%23000'/%3E%3Crect x='2' y='24' width='2' height='2' fill='%23fff'/%3E%3Crect x='4' y='24' width='2' height='2' fill='%23000'/%3E%3Crect x='8' y='24' width='2' height='2' fill='%23000'/%3E%3Crect x='10' y='24' width='2' height='2' fill='%23fff'/%3E%3Crect x='12' y='24' width='2' height='2' fill='%23fff'/%3E%3Crect x='14' y='24' width='2' height='2' fill='%23000'/%3E%3Crect x='0' y='26' width='2' height='2' fill='%23000'/%3E%3Crect x='2' y='26' width='2' height='2' fill='%23000'/%3E%3Crect x='8' y='26' width='2' height='2' fill='%23000'/%3E%3Crect x='10' y='26' width='2' height='2' fill='%23fff'/%3E%3Crect x='12' y='26' width='2' height='2' fill='%23fff'/%3E%3Crect x='14' y='26' width='2' height='2' fill='%23000'/%3E%3Crect x='0' y='28' width='2' height='2' fill='%23000'/%3E%3Crect x='10' y='28' width='2' height='2' fill='%23000'/%3E%3Crect x='12' y='28' width='2' height='2' fill='%23fff'/%3E%3Crect x='14' y='28' width='2' height='2' fill='%23fff'/%3E%3Crect x='16' y='28' width='2' height='2' fill='%23000'/%3E%3Crect x='10' y='30' width='2' height='2' fill='%23000'/%3E%3Crect x='12' y='30' width='2' height='2' fill='%23fff'/%3E%3Crect x='14' y='30' width='2' height='2' fill='%23fff'/%3E%3Crect x='16' y='30' width='2' height='2' fill='%23000'/%3E%3Crect x='12' y='32' width='2' height='2' fill='%23000'/%3E%3Crect x='14' y='32' width='2' height='2' fill='%23fff'/%3E%3Crect x='16' y='32' width='2' height='2' fill='%23fff'/%3E%3Crect x='18' y='32' width='2' height='2' fill='%23000'/%3E%3Crect x='12' y='34' width='2' height='2' fill='%23000'/%3E%3Crect x='14' y='34' width='2' height='2' fill='%23fff'/%3E%3Crect x='16' y='34' width='2' height='2' fill='%23fff'/%3E%3Crect x='18' y='34' width='2' height='2' fill='%23000'/%3E%3Crect x='14' y='36' width='2' height='2' fill='%23000'/%3E%3Crect x='16' y='36' width='2' height='2' fill='%23000'/%3E%3C/svg%3E") 0 0, default;
  --cursor-clickable: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='38' shape-rendering='crispEdges'%3E%3Crect x='8' y='0' width='2' height='2' fill='%23000'/%3E%3Crect x='10' y='0' width='2' height='2' fill='%23000'/%3E%3Crect x='6' y='2' width='2' height='2' fill='%23000'/%3E%3Crect x='8' y='2' width='2' height='2' fill='%23fff'/%3E%3Crect x='10' y='2' width='2' height='2' fill='%23fff'/%3E%3Crect x='12' y='2' width='2' height='2' fill='%23000'/%3E%3Crect x='6' y='4' width='2' height='2' fill='%23000'/%3E%3Crect x='8' y='4' width='2' height='2' fill='%23fff'/%3E%3Crect x='10' y='4' width='2' height='2' fill='%23fff'/%3E%3Crect x='12' y='4' width='2' height='2' fill='%23000'/%3E%3Crect x='6' y='6' width='2' height='2' fill='%23000'/%3E%3Crect x='8' y='6' width='2' height='2' fill='%23fff'/%3E%3Crect x='10' y='6' width='2' height='2' fill='%23fff'/%3E%3Crect x='12' y='6' width='2' height='2' fill='%23000'/%3E%3Crect x='6' y='8' width='2' height='2' fill='%23000'/%3E%3Crect x='8' y='8' width='2' height='2' fill='%23fff'/%3E%3Crect x='10' y='8' width='2' height='2' fill='%23fff'/%3E%3Crect x='12' y='8' width='2' height='2' fill='%23000'/%3E%3Crect x='6' y='10' width='2' height='2' fill='%23000'/%3E%3Crect x='8' y='10' width='2' height='2' fill='%23fff'/%3E%3Crect x='10' y='10' width='2' height='2' fill='%23fff'/%3E%3Crect x='12' y='10' width='2' height='2' fill='%23000'/%3E%3Crect x='14' y='10' width='2' height='2' fill='%23000'/%3E%3Crect x='16' y='10' width='2' height='2' fill='%23000'/%3E%3Crect x='6' y='12' width='2' height='2' fill='%23000'/%3E%3Crect x='8' y='12' width='2' height='2' fill='%23fff'/%3E%3Crect x='10' y='12' width='2' height='2' fill='%23fff'/%3E%3Crect x='12' y='12' width='2' height='2' fill='%23000'/%3E%3Crect x='14' y='12' width='2' height='2' fill='%23fff'/%3E%3Crect x='16' y='12' width='2' height='2' fill='%23fff'/%3E%3Crect x='18' y='12' width='2' height='2' fill='%23000'/%3E%3Crect x='20' y='12' width='2' height='2' fill='%23000'/%3E%3Crect x='22' y='12' width='2' height='2' fill='%23000'/%3E%3Crect x='6' y='14' width='2' height='2' fill='%23000'/%3E%3Crect x='8' y='14' width='2' height='2' fill='%23fff'/%3E%3Crect x='10' y='14' width='2' height='2' fill='%23fff'/%3E%3Crect x='12' y='14' width='2' height='2' fill='%23000'/%3E%3Crect x='14' y='14' width='2' height='2' fill='%23fff'/%3E%3Crect x='16' y='14' width='2' height='2' fill='%23fff'/%3E%3Crect x='18' y='14' width='2' height='2' fill='%23000'/%3E%3Crect x='20' y='14' width='2' height='2' fill='%23fff'/%3E%3Crect x='22' y='14' width='2' height='2' fill='%23fff'/%3E%3Crect x='24' y='14' width='2' height='2' fill='%23000'/%3E%3Crect x='26' y='14' width='2' height='2' fill='%23000'/%3E%3Crect x='0' y='16' width='2' height='2' fill='%23000'/%3E%3Crect x='2' y='16' width='2' height='2' fill='%23000'/%3E%3Crect x='6' y='16' width='2' height='2' fill='%23000'/%3E%3Crect x='8' y='16' width='2' height='2' fill='%23fff'/%3E%3Crect x='10' y='16' width='2' height='2' fill='%23fff'/%3E%3Crect x='12' y='16' width='2' height='2' fill='%23000'/%3E%3Crect x='14' y='16' width='2' height='2' fill='%23fff'/%3E%3Crect x='16' y='16' width='2' height='2' fill='%23fff'/%3E%3Crect x='18' y='16' width='2' height='2' fill='%23000'/%3E%3Crect x='20' y='16' width='2' height='2' fill='%23fff'/%3E%3Crect x='22' y='16' width='2' height='2' fill='%23fff'/%3E%3Crect x='24' y='16' width='2' height='2' fill='%23000'/%3E%3Crect x='26' y='16' width='2' height='2' fill='%23fff'/%3E%3Crect x='28' y='16' width='2' height='2' fill='%23000'/%3E%3Crect x='0' y='18' width='2' height='2' fill='%23000'/%3E%3Crect x='2' y='18' width='2' height='2' fill='%23fff'/%3E%3Crect x='4' y='18' width='2' height='2' fill='%23000'/%3E%3Crect x='6' y='18' width='2' height='2' fill='%23000'/%3E%3Crect x='8' y='18' width='2' height='2' fill='%23fff'/%3E%3Crect x='10' y='18' width='2' height='2' fill='%23fff'/%3E%3Crect x='12' y='18' width='2' height='2' fill='%23fff'/%3E%3Crect x='14' y='18' width='2' height='2' fill='%23fff'/%3E%3Crect x='16' y='18' width='2' height='2' fill='%23fff'/%3E%3Crect x='18' y='18' width='2' height='2' fill='%23fff'/%3E%3Crect x='20' y='18' width='2' height='2' fill='%23fff'/%3E%3Crect x='22' y='18' width='2' height='2' fill='%23fff'/%3E%3Crect x='24' y='18' width='2' height='2' fill='%23000'/%3E%3Crect x='26' y='18' width='2' height='2' fill='%23fff'/%3E%3Crect x='28' y='18' width='2' height='2' fill='%23000'/%3E%3Crect x='0' y='20' width='2' height='2' fill='%23000'/%3E%3Crect x='2' y='20' width='2' height='2' fill='%23fff'/%3E%3Crect x='4' y='20' width='2' height='2' fill='%23fff'/%3E%3Crect x='6' y='20' width='2' height='2' fill='%23000'/%3E%3Crect x='8' y='20' width='2' height='2' fill='%23fff'/%3E%3Crect x='10' y='20' width='2' height='2' fill='%23fff'/%3E%3Crect x='12' y='20' width='2' height='2' fill='%23fff'/%3E%3Crect x='14' y='20' width='2' height='2' fill='%23fff'/%3E%3Crect x='16' y='20' width='2' height='2' fill='%23fff'/%3E%3Crect x='18' y='20' width='2' height='2' fill='%23fff'/%3E%3Crect x='20' y='20' width='2' height='2' fill='%23fff'/%3E%3Crect x='22' y='20' width='2' height='2' fill='%23fff'/%3E%3Crect x='24' y='20' width='2' height='2' fill='%23fff'/%3E%3Crect x='26' y='20' width='2' height='2' fill='%23fff'/%3E%3Crect x='28' y='20' width='2' height='2' fill='%23000'/%3E%3Crect x='2' y='22' width='2' height='2' fill='%23000'/%3E%3Crect x='4' y='22' width='2' height='2' fill='%23fff'/%3E%3Crect x='6' y='22' width='2' height='2' fill='%23000'/%3E%3Crect x='8' y='22' width='2' height='2' fill='%23fff'/%3E%3Crect x='10' y='22' width='2' height='2' fill='%23fff'/%3E%3Crect x='12' y='22' width='2' height='2' fill='%23fff'/%3E%3Crect x='14' y='22' width='2' height='2' fill='%23fff'/%3E%3Crect x='16' y='22' width='2' height='2' fill='%23fff'/%3E%3Crect x='18' y='22' width='2' height='2' fill='%23fff'/%3E%3Crect x='20' y='22' width='2' height='2' fill='%23fff'/%3E%3Crect x='22' y='22' width='2' height='2' fill='%23fff'/%3E%3Crect x='24' y='22' width='2' height='2' fill='%23fff'/%3E%3Crect x='26' y='22' width='2' height='2' fill='%23fff'/%3E%3Crect x='28' y='22' width='2' height='2' fill='%23000'/%3E%3Crect x='4' y='24' width='2' height='2' fill='%23000'/%3E%3Crect x='6' y='24' width='2' height='2' fill='%23fff'/%3E%3Crect x='8' y='24' width='2' height='2' fill='%23fff'/%3E%3Crect x='10' y='24' width='2' height='2' fill='%23fff'/%3E%3Crect x='12' y='24' width='2' height='2' fill='%23fff'/%3E%3Crect x='14' y='24' width='2' height='2' fill='%23fff'/%3E%3Crect x='16' y='24' width='2' height='2' fill='%23fff'/%3E%3Crect x='18' y='24' width='2' height='2' fill='%23fff'/%3E%3Crect x='20' y='24' width='2' height='2' fill='%23fff'/%3E%3Crect x='22' y='24' width='2' height='2' fill='%23fff'/%3E%3Crect x='24' y='24' width='2' height='2' fill='%23fff'/%3E%3Crect x='26' y='24' width='2' height='2' fill='%23fff'/%3E%3Crect x='28' y='24' width='2' height='2' fill='%23000'/%3E%3Crect x='4' y='26' width='2' height='2' fill='%23000'/%3E%3Crect x='6' y='26' width='2' height='2' fill='%23fff'/%3E%3Crect x='8' y='26' width='2' height='2' fill='%23fff'/%3E%3Crect x='10' y='26' width='2' height='2' fill='%23fff'/%3E%3Crect x='12' y='26' width='2' height='2' fill='%23fff'/%3E%3Crect x='14' y='26' width='2' height='2' fill='%23fff'/%3E%3Crect x='16' y='26' width='2' height='2' fill='%23fff'/%3E%3Crect x='18' y='26' width='2' height='2' fill='%23fff'/%3E%3Crect x='20' y='26' width='2' height='2' fill='%23fff'/%3E%3Crect x='22' y='26' width='2' height='2' fill='%23fff'/%3E%3Crect x='24' y='26' width='2' height='2' fill='%23fff'/%3E%3Crect x='26' y='26' width='2' height='2' fill='%23000'/%3E%3Crect x='6' y='28' width='2' height='2' fill='%23000'/%3E%3Crect x='8' y='28' width='2' height='2' fill='%23fff'/%3E%3Crect x='10' y='28' width='2' height='2' fill='%23fff'/%3E%3Crect x='12' y='28' width='2' height='2' fill='%23fff'/%3E%3Crect x='14' y='28' width='2' height='2' fill='%23fff'/%3E%3Crect x='16' y='28' width='2' height='2' fill='%23fff'/%3E%3Crect x='18' y='28' width='2' height='2' fill='%23fff'/%3E%3Crect x='20' y='28' width='2' height='2' fill='%23fff'/%3E%3Crect x='22' y='28' width='2' height='2' fill='%23fff'/%3E%3Crect x='24' y='28' width='2' height='2' fill='%23fff'/%3E%3Crect x='26' y='28' width='2' height='2' fill='%23000'/%3E%3Crect x='6' y='30' width='2' height='2' fill='%23000'/%3E%3Crect x='8' y='30' width='2' height='2' fill='%23fff'/%3E%3Crect x='10' y='30' width='2' height='2' fill='%23fff'/%3E%3Crect x='12' y='30' width='2' height='2' fill='%23fff'/%3E%3Crect x='14' y='30' width='2' height='2' fill='%23fff'/%3E%3Crect x='16' y='30' width='2' height='2' fill='%23fff'/%3E%3Crect x='18' y='30' width='2' height='2' fill='%23fff'/%3E%3Crect x='20' y='30' width='2' height='2' fill='%23fff'/%3E%3Crect x='22' y='30' width='2' height='2' fill='%23fff'/%3E%3Crect x='24' y='30' width='2' height='2' fill='%23000'/%3E%3Crect x='8' y='32' width='2' height='2' fill='%23000'/%3E%3Crect x='10' y='32' width='2' height='2' fill='%23fff'/%3E%3Crect x='12' y='32' width='2' height='2' fill='%23fff'/%3E%3Crect x='14' y='32' width='2' height='2' fill='%23fff'/%3E%3Crect x='16' y='32' width='2' height='2' fill='%23fff'/%3E%3Crect x='18' y='32' width='2' height='2' fill='%23fff'/%3E%3Crect x='20' y='32' width='2' height='2' fill='%23fff'/%3E%3Crect x='22' y='32' width='2' height='2' fill='%23fff'/%3E%3Crect x='24' y='32' width='2' height='2' fill='%23000'/%3E%3Crect x='8' y='34' width='2' height='2' fill='%23000'/%3E%3Crect x='10' y='34' width='2' height='2' fill='%23fff'/%3E%3Crect x='12' y='34' width='2' height='2' fill='%23fff'/%3E%3Crect x='14' y='34' width='2' height='2' fill='%23fff'/%3E%3Crect x='16' y='34' width='2' height='2' fill='%23fff'/%3E%3Crect x='18' y='34' width='2' height='2' fill='%23fff'/%3E%3Crect x='20' y='34' width='2' height='2' fill='%23fff'/%3E%3Crect x='22' y='34' width='2' height='2' fill='%23fff'/%3E%3Crect x='24' y='34' width='2' height='2' fill='%23000'/%3E%3Crect x='8' y='36' width='2' height='2' fill='%23000'/%3E%3Crect x='10' y='36' width='2' height='2' fill='%23000'/%3E%3Crect x='12' y='36' width='2' height='2' fill='%23000'/%3E%3Crect x='14' y='36' width='2' height='2' fill='%23000'/%3E%3Crect x='16' y='36' width='2' height='2' fill='%23000'/%3E%3Crect x='18' y='36' width='2' height='2' fill='%23000'/%3E%3Crect x='20' y='36' width='2' height='2' fill='%23000'/%3E%3Crect x='22' y='36' width='2' height='2' fill='%23000'/%3E%3Crect x='24' y='36' width='2' height='2' fill='%23000'/%3E%3C/svg%3E") 9 0, pointer;
}


/* Choosing where the garden goes: a little pixel flower */
.garden.is-planting {
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='28' shape-rendering='crispEdges'%3E%3Crect x='8' y='0' width='2' height='2' fill='%23000'/%3E%3Crect x='10' y='0' width='2' height='2' fill='%23000'/%3E%3Crect x='12' y='0' width='2' height='2' fill='%23000'/%3E%3Crect x='6' y='2' width='2' height='2' fill='%23000'/%3E%3Crect x='8' y='2' width='2' height='2' fill='%23fff'/%3E%3Crect x='10' y='2' width='2' height='2' fill='%23fff'/%3E%3Crect x='12' y='2' width='2' height='2' fill='%23fff'/%3E%3Crect x='14' y='2' width='2' height='2' fill='%23000'/%3E%3Crect x='2' y='4' width='2' height='2' fill='%23000'/%3E%3Crect x='4' y='4' width='2' height='2' fill='%23000'/%3E%3Crect x='6' y='4' width='2' height='2' fill='%23000'/%3E%3Crect x='8' y='4' width='2' height='2' fill='%23fff'/%3E%3Crect x='10' y='4' width='2' height='2' fill='%23fff'/%3E%3Crect x='12' y='4' width='2' height='2' fill='%23fff'/%3E%3Crect x='14' y='4' width='2' height='2' fill='%23000'/%3E%3Crect x='16' y='4' width='2' height='2' fill='%23000'/%3E%3Crect x='18' y='4' width='2' height='2' fill='%23000'/%3E%3Crect x='0' y='6' width='2' height='2' fill='%23000'/%3E%3Crect x='2' y='6' width='2' height='2' fill='%23fff'/%3E%3Crect x='4' y='6' width='2' height='2' fill='%23fff'/%3E%3Crect x='6' y='6' width='2' height='2' fill='%23fff'/%3E%3Crect x='8' y='6' width='2' height='2' fill='%23000'/%3E%3Crect x='10' y='6' width='2' height='2' fill='%23000'/%3E%3Crect x='12' y='6' width='2' height='2' fill='%23000'/%3E%3Crect x='14' y='6' width='2' height='2' fill='%23fff'/%3E%3Crect x='16' y='6' width='2' height='2' fill='%23fff'/%3E%3Crect x='18' y='6' width='2' height='2' fill='%23fff'/%3E%3Crect x='20' y='6' width='2' height='2' fill='%23000'/%3E%3Crect x='0' y='8' width='2' height='2' fill='%23000'/%3E%3Crect x='2' y='8' width='2' height='2' fill='%23fff'/%3E%3Crect x='4' y='8' width='2' height='2' fill='%23fff'/%3E%3Crect x='6' y='8' width='2' height='2' fill='%23fff'/%3E%3Crect x='8' y='8' width='2' height='2' fill='%23000'/%3E%3Crect x='10' y='8' width='2' height='2' fill='%23000'/%3E%3Crect x='12' y='8' width='2' height='2' fill='%23000'/%3E%3Crect x='14' y='8' width='2' height='2' fill='%23fff'/%3E%3Crect x='16' y='8' width='2' height='2' fill='%23fff'/%3E%3Crect x='18' y='8' width='2' height='2' fill='%23fff'/%3E%3Crect x='20' y='8' width='2' height='2' fill='%23000'/%3E%3Crect x='0' y='10' width='2' height='2' fill='%23000'/%3E%3Crect x='2' y='10' width='2' height='2' fill='%23fff'/%3E%3Crect x='4' y='10' width='2' height='2' fill='%23fff'/%3E%3Crect x='6' y='10' width='2' height='2' fill='%23fff'/%3E%3Crect x='8' y='10' width='2' height='2' fill='%23000'/%3E%3Crect x='10' y='10' width='2' height='2' fill='%23000'/%3E%3Crect x='12' y='10' width='2' height='2' fill='%23000'/%3E%3Crect x='14' y='10' width='2' height='2' fill='%23fff'/%3E%3Crect x='16' y='10' width='2' height='2' fill='%23fff'/%3E%3Crect x='18' y='10' width='2' height='2' fill='%23fff'/%3E%3Crect x='20' y='10' width='2' height='2' fill='%23000'/%3E%3Crect x='2' y='12' width='2' height='2' fill='%23000'/%3E%3Crect x='4' y='12' width='2' height='2' fill='%23000'/%3E%3Crect x='6' y='12' width='2' height='2' fill='%23000'/%3E%3Crect x='8' y='12' width='2' height='2' fill='%23fff'/%3E%3Crect x='10' y='12' width='2' height='2' fill='%23fff'/%3E%3Crect x='12' y='12' width='2' height='2' fill='%23fff'/%3E%3Crect x='14' y='12' width='2' height='2' fill='%23000'/%3E%3Crect x='16' y='12' width='2' height='2' fill='%23000'/%3E%3Crect x='18' y='12' width='2' height='2' fill='%23000'/%3E%3Crect x='6' y='14' width='2' height='2' fill='%23000'/%3E%3Crect x='8' y='14' width='2' height='2' fill='%23fff'/%3E%3Crect x='10' y='14' width='2' height='2' fill='%23fff'/%3E%3Crect x='12' y='14' width='2' height='2' fill='%23fff'/%3E%3Crect x='14' y='14' width='2' height='2' fill='%23000'/%3E%3Crect x='8' y='16' width='2' height='2' fill='%23000'/%3E%3Crect x='10' y='16' width='2' height='2' fill='%23000'/%3E%3Crect x='12' y='16' width='2' height='2' fill='%23000'/%3E%3Crect x='10' y='18' width='2' height='2' fill='%23000'/%3E%3Crect x='6' y='20' width='2' height='2' fill='%23000'/%3E%3Crect x='8' y='20' width='2' height='2' fill='%23000'/%3E%3Crect x='10' y='20' width='2' height='2' fill='%23000'/%3E%3Crect x='10' y='22' width='2' height='2' fill='%23000'/%3E%3Crect x='10' y='24' width='2' height='2' fill='%23000'/%3E%3Crect x='12' y='24' width='2' height='2' fill='%23000'/%3E%3Crect x='14' y='24' width='2' height='2' fill='%23000'/%3E%3Crect x='10' y='26' width='2' height='2' fill='%23000'/%3E%3C/svg%3E") 11 8, crosshair;
}

/* Points, top right, and messages, top middle – frosted pills like the buttons */
.score,
.message {
  position: fixed;
  top: 4px;
  z-index: 40;
  margin: 0;
  padding: 10px 18px;
  border-radius: 999px;
  background: rgb(246 246 246 / 60%);
  box-shadow: inset 0 0 0 1px rgb(213 213 213 / 80%);
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  font: 14px/18px "Suisse Intl", sans-serif;
  letter-spacing: -0.01em;
  text-transform: uppercase;
  color: #121212;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.5s ease, background-color 0.6s ease, color 0.6s ease;
}

.score {
  right: 4px;
}

.message {
  left: 50%;
  transform: translateX(-50%);
}

.score.is-shown,
.message.is-shown {
  opacity: 1;
}

.lab-dark .score,
.lab-dark .message,
.lab-dark .machine {
  background: rgb(9 9 9 / 60%);
  box-shadow: inset 0 0 0 1px rgb(42 42 42 / 80%);
  color: #ededed;
}

/* +100 floating up from a harvest */
.points-float {
  position: absolute;
  top: 0;
  left: 0;
  font: 14px/18px "Suisse Intl", sans-serif;
  color: #121212;
}

.lab-dark .points-float {
  color: #e6e6e6;
}

/* The machine's panel */
.machine {
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 70;
  width: 300px;
  padding: 16px;
  border-radius: 18px;
  background: rgb(246 246 246 / 80%);
  box-shadow: inset 0 0 0 1px rgb(213 213 213 / 80%);
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  font: 14px/18px "Suisse Works", serif;
  letter-spacing: -0.018em;
  color: #757575;
  transform: translate(-50%, -50%) scale(0.96);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s ease, transform 0.25s ease;
}

.machine.is-open {
  opacity: 1;
  transform: translate(-50%, -50%);
  pointer-events: auto;
}

.machine p {
  margin: 0 0 18px;
}

.machine-title,
.machine-button,
.machine-close {
  font-family: "Suisse Intl", sans-serif;
  letter-spacing: -0.01em;
  text-transform: uppercase;
  color: #121212;
}

.lab-dark .machine-title,
.lab-dark .machine-button,
.lab-dark .machine-close {
  color: #ededed;
}

.machine-close {
  position: absolute;
  top: 10px;
  right: 14px;
  border: 0;
  background: none;
  font-size: 18px;
}

.machine-button {
  padding: 8px 14px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  box-shadow: inset 0 0 0 1px currentColor;
  font-size: 14px;
}

.machine-button:disabled {
  opacity: 0.35;
}