html,
            body {
                margin: 0;
                padding: 0;
                background: pink;
  font-family: "Outfit", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}

            h1 {
                text-wrap: balance;
            }

            canvas {
                display: block;
                text-align: center;
            }

            main {
                position: fixed;
                top: 50%;
                left: 50%;
                transform: translate(-50%, -50%);
                width: min(90vw, 800px);
                background: rgba(255, 255, 255, 0.25);
                box-shadow: 0 0 5px rgba(0, 0, 0, 0.25);
                border-radius: 10px;
            }

            main > div {
                width: 46%;
                margin: 2%;
                float: left;
            }

            @media (orientation: portrait) {
                main > div {
                    width: 96%;
                    margin: 2%;
                    float: none;
                }
            }

            canvas {
                border-radius: 10px;
            }

            span {
                text-decoration: underline;
            }