Run the art to the bottom edge, lift only the rack

The remaining gap was the home-indicator inset being reserved on the canvas
element. Unlike the status bar that is a slim translucent bar, not opaque UI,
so the canvas now runs to the physical bottom edge and the court art fills it —
only the weapon rack and the draw meter lift clear of it, through SAFE.bottom.
The top keeps its element inset, since the scoreboard genuinely has to clear
the status bar.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

index.html

@@ -31,15 +31,16 @@
      explicit px) meant it was laid out against whatever innerHeight reported at load — before iOS
      Safari's toolbars had settled — and it stayed a strip short of the bottom forever after.
      100dvh is the dynamic viewport height, so it tracks those toolbars. */
-  /* The canvas lives ENTIRELY INSIDE the safe area — never under the notch, the status bar or the
-     home indicator. Doing the inset here rather than offsetting the HUD in canvas space keeps it in
-     ONE place: render.js then just matches its logical grid to whatever box it was given.
+  /* TOP inset only. The status bar is opaque UI and the scoreboard must clear it, so the canvas starts
+     below it — but the home indicator is a slim translucent bar, so the canvas runs all the way to the
+     PHYSICAL bottom edge and the court art fills it. Only the weapon RACK lifts clear of the indicator,
+     via SAFE.bottom in render.js. Reserving the bottom inset here instead just left a dead band.
      100dvh is the dynamic viewport height, so it tracks iOS Safari's toolbars appearing/hiding. */
   canvas { image-rendering: pixelated; display: block; position: fixed; touch-action: none;
            top: env(safe-area-inset-top, 0px);
            left: env(safe-area-inset-left, 0px);
            width: calc(100vw - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px));
-           height: calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); }
+           height: calc(100dvh - env(safe-area-inset-top, 0px)); }
   #hint { position: fixed; bottom: 8px; width: 100%; text-align: center;
           font: 400 10px Silkscreen, monospace; color: #6b7688; }
   @media (pointer: coarse) { #hint, #intro .kb { display: none; } }
@@ -79,6 +80,6 @@
     <p class="start">TAP TO START</p>
   </div>
 </div>
-<script type="module" src="main.js?v=46"></script>
+<script type="module" src="main.js?v=47"></script>
 </body>
 </html>