/* (removing the cube shadow) */
html { background: var(--gradient) fixed; }

body { display: unset; }

/* doesn't do anything without js */
#face-menu { display: none; }

#outer, #cube {
  position: unset;
  height: unset;
  width: unset;
  max-width: max(100%, 45em);
}

#outer::after {
  display: none;
}

#outer {
  margin: 2em auto 5em;
  padding: 0 1em;
}

#cube > section {
  position: relative;
  inset: unset;
  overflow: unset;
}
#cube > section + section {
  margin-top: 2em;
}
#cube > section::after {
  content: ' ';
  position: absolute;
  inset: calc(0px - var(--border-thickness));
  box-shadow: 0 0 40px hsl(var(--shadow-hsl) / 40%);
  mix-blend-mode: multiply;
  pointer-events: none;
}

#cube #hello {
  background-size: auto 95%, auto, auto;
  background-position: bottom right;
  padding-right: 45%;
}

#cube #activities {
  background-size: auto 5em, auto, auto;
  background-position: bottom left;
  padding-bottom: 6em;
}

#cube #six {
  background-size: auto 100%, auto, auto;
  background-position: bottom right;
}