Don't use CSS zoom.

README.md

@@ -40,10 +40,6 @@ const cbl = new Checkboxland({
 });
 ```
 
-The cursed CSS property [zoom](https://developer.mozilla.org/en-US/docs/Web/CSS/zoom) is used to shrink the checkboxes down. `transform: scale(x)` resulted in worse performance, and worse visuals. Unfortunately, this means that Firefox users need to manually zoom out.
-
-> Non-standard: This feature is non-standard and is not on a standards track. Do not use it on production sites facing the Web: it will not work for every user.
-
 Key events are forwarded to the hidden `<canvas>` to avoid focus issues.
 
 ```js

index.html

@@ -19,22 +19,28 @@
         * {
             font-family: sans-serif;
         }
-        
+
         body {
             padding: 5px;
         }
-        
+
         #hide {
             display: none;
         }
-
-        #checkboxes {
-            zoom: 0.4;
+
+        #checkboxes > div {
+            line-height: calc(0.4 * 0.75) !important;
+        }
+
+        #checkboxes input {
+            width: calc(0.4 * 13px);
+            height: calc(0.4 * 13px);
             pointer-events: none;
         }
-        
+
         video {
-            zoom: 2;
+            width: 320px;
+            height: 200px;
         }
     </style>
 </head>
@@ -76,4 +82,4 @@
 <script type="module" src="glue.js"></script>
 <script src="doom.js" defer></script>
 
-</html>
+</html>