def METHOD_NAME(io: TextIO, images: list[Image]):
    io.write(
        dedent(
            """\
            <!DOCTYPE html>
            <html lang="en">
            <head>
                <meta charset="utf-8" />
                <meta name="viewport" content="width=device-width, initial-scale=1.0" />
                <title>CC:T test screenshots</title>
                <style>
                body {
                    padding: 0;
                    margin: 0;
                    font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
                }
                .content {
                    margin: 1em;
                    gap: 1em;
                    display: grid;
                    grid-template-columns: repeat(auto-fit,minmax(25em,1fr));
                }
                .image {
                    display: flex;
                    flex-direction: column;
                }
                .desc { text-align: center; }
                .desc-prefix { color: #666; }
                </style>
            </head>
            <body>
            <div class="content">
            """
        )
    )
    for image in images:
        io.write(
            dedent(
                f"""\
            <div class="image">
                <img src="../{image.path}" />
                <span class="desc">
                    <span class="desc-prefix">{" » ".join(image.name[:-1])} »</span>
                    <span class="desc-main">{image.name[-1]}</span>
                </span>
            </div>
            """
            )
        )
    io.write("</div></body></html>")