说明

因能力有限，无法实现 CSS Battle 官网上的完美解决方案，此处的原则是：在尽量少用标签的前提下，减少样式代码

因浏览器与 CSS Battle 官网展示差异，将代码复制到官网上时，可能需要微调

为了尽量模拟官网的效果，因此对样式进行初始化，代码如下

/** @format */

html,
body {
    overflow: hidden;
}
html {
    width: 100%;
    height: 100%;
}
body {
    width: calc(100% - 16px);
    height: calc(100% - 16px);
}