* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; background: #101712; }
body { color: #fff; font: 15px Arial, sans-serif; }
canvas { display: block; width: 100%; height: 100%; background: #101712; outline: none; }
canvas:focus-visible { outline: 2px solid #d7f5a3; outline-offset: -2px; }
#loading { position: fixed; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; background: #101712; text-align: center; padding: 24px; }
#loading[hidden] { display: none; }
#status { max-width: 480px; line-height: 1.5; overflow-wrap: anywhere; }
progress { width: min(240px, 80vw); height: 6px; accent-color: #d7f5a3; }
body[data-game-state="error"] progress { display: none; }