/* positioned to fill the viewport */
.layer {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: calc(100vh - var(--taskbar-height));
}

/* background: lowest layer, receives all mouse events by default */
.layer--background {
  z-index: var(--z-background);
  background: url('../assets/background.png') center/cover no-repeat;
}

/*
  desktop & window: wrappers are pointer-events:none so mouse events
  pass through to the background grid underneath
*/
.layer--desktop {
  z-index: var(--z-desktop);
  pointer-events: none;
}

.layer--windows {
  z-index: var(--z-windows);
  pointer-events: none;
}