:root{--bg:#dcd8cf;--ink:#4a423c;--ink-soft:#7a716a;--chip:#fbfaf7}html,body{background:var(--bg);touch-action:none;-webkit-user-select:none;user-select:none;height:100%;margin:0;font-family:ui-rounded,SF Pro Rounded,system-ui,sans-serif;overflow:hidden}#renderCanvas{outline:none;width:100%;height:100%;display:block}#hud{top:max(16px, env(safe-area-inset-top));color:var(--ink);pointer-events:none;position:fixed;left:16px;right:16px}#status{font-size:18px;font-weight:700}#controls{right:16px;bottom:max(16px, env(safe-area-inset-bottom));gap:10px;display:flex;position:fixed}#controls button{color:var(--ink);background:var(--chip);border:none;border-radius:999px;padding:12px 18px;font:600 14px ui-rounded,SF Pro Rounded,system-ui,sans-serif;box-shadow:0 2px 8px #4a423c1f}#controls button[hidden]{display:none}#debug{top:max(52px, calc(env(safe-area-inset-top) + 36px));color:var(--ink);background:#fbfaf7d9;border-radius:10px;padding:8px 10px;font:11px/1.4 ui-monospace,Menlo,monospace;position:fixed;left:16px;box-shadow:0 2px 8px #4a423c1f}#debug-version{color:var(--ink-soft);margin-bottom:4px}#debug pre{font:inherit;margin:0 0 6px}.debug-row{gap:6px;display:flex}.debug-row button{color:var(--ink);background:#ece8e0;border:none;border-radius:999px;padding:6px 10px;font:600 12px ui-rounded,system-ui,sans-serif}.debug-row button.on{background:var(--ink);color:var(--chip)}.debug-row button:disabled{opacity:.35}#joystick{pointer-events:none;background:#fbfaf773;border-radius:50%;width:120px;height:120px;margin:-60px 0 0 -60px;display:none;position:fixed;box-shadow:0 2px 10px #4a423c1f}#joystick-knob{background:var(--chip);border-radius:50%;width:48px;height:48px;margin:-24px 0 0 -24px;position:absolute;top:50%;left:50%;box-shadow:0 2px 6px #4a423c2e}