Cannot access '<component_name>' before initialization while using styled-components

Question

I have the below code that is producing the ReferenceError: Cannot access 'Foo' before initialization error:

import styled, { css } from "styled-components/macro";

const Foo = styled.div``;

export default function App() {
  return <Foo css={css``} />;
}

Reproduction is available here:

https://codesandbox.io/s/great-golick-s3ofx0?file=/src/App.js

The project is built using Create React App.

May someone help me understand why is this erroring?