:root { color-scheme:light dark; font-family:Arial,Helvetica,sans-serif; background:#ede4c6; }
* { box-sizing:border-box; }
html,body { margin:0; width:100%; height:100%; overflow:hidden; }
main { position:relative; width:100%; height:100vh; height:100dvh; }
canvas { display:block; width:100%; height:100%; touch-action:none; cursor:grab; }
#loading { position:absolute; inset:50% auto auto 50%; width:10px; height:10px; background:#101526; }
#loading[hidden],#fallback[hidden] { display:none; }
#fallback { position:absolute; inset:45% 20px auto; padding:14px; color:#f3ead1; background:#101526; font-size:14px; text-align:center; }
@media(prefers-color-scheme:dark) { :root { background:#101526; } #loading { background:#f3ead1; } }