:root { color-scheme: dark; background: #000; color: #fff; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100svh; background: #000; }
main { min-height: 100svh; display: grid; place-items: center; }
canvas { display: block; width: min(80vw, 80svh, 640px); height: auto; aspect-ratio: 1; image-rendering: pixelated; image-rendering: crisp-edges; }
footer { position: fixed; right: max(12px, env(safe-area-inset-right)); bottom: max(8px, env(safe-area-inset-bottom)); }
a { display: grid; min-width: 44px; min-height: 44px; padding: 12px; place-items: center; color: #717171; font-size: 11px; line-height: 1; text-decoration: none; }
a:hover { color: #b8b8b8; }
a:focus-visible { color: #fff; outline: 1px solid #fff; outline-offset: -4px; }