:root { color-scheme: dark; font-family: "Segoe UI", system-ui, Roboto, Arial, sans-serif; }
* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; }
body { background: #0f1b2d; }
body.transparent { background: transparent; }
html:has(body.transparent) { background: transparent; color-scheme: normal; }
main { width: 100%; height: 100%; display: grid; place-items: center; overflow: hidden; }
canvas { display: block; width: min(100vw, 56.25vh); height: min(100vh, 177.777778vw); touch-action: none; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
noscript { position: fixed; inset: 40% 10% auto; padding: 2rem; text-align: center; background: #13243f; color: #fff7ea; border-radius: 1rem; }
