:root { color-scheme: dark; --ink: #f6e9d0; --bg: #0b0712; }
* { box-sizing: border-box; }
/* A game, not a page: nothing scrolls, zooms, selects or pops a menu under a thumb (touch-action is set here and on every canvas, because the
   browser takes the intersection up the tree and a touch it takes for panning is a pointercancel for us). */
html, body { margin: 0; height: 100%; background: var(--bg); color: var(--ink); overflow: hidden; overscroll-behavior: none; touch-action: none; -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; -webkit-tap-highlight-color: transparent; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { position: fixed; inset: 0; width: 100%; }
body { font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; }
#stage { position: fixed; inset: 0; display: grid; place-items: center; background: var(--bg); touch-action: none; }
#view, #hud { position: absolute; display: block; image-rendering: pixelated; image-rendering: crisp-edges; touch-action: none; -webkit-user-drag: none; user-select: none; -webkit-touch-callout: none; outline: none; }
/* The HUD layer takes the pointer only while a menu or an overlay is up (the app switches it inline). */
#hud { pointer-events: none; outline: none; }
#boot { position: absolute; inset: 0; display: grid; place-items: center; align-content: center; gap: 6px; font-size: 44px; letter-spacing: .3em; font-weight: 800; color: #ffd166; background: var(--bg); transition: opacity .4s; }
#boot small { font-size: 11px; letter-spacing: .5em; opacity: .6; font-weight: 500; }
#boot.gone { opacity: 0; pointer-events: none; }