: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}#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}#home-btn{left:16px;bottom:max(16px, env(safe-area-inset-bottom));width:46px;height:46px;color:var(--ink);background:var(--chip);border:none;border-radius:50%;place-items:center;padding:0;display:grid;position:fixed;box-shadow:0 2px 8px #4a423c1f}.home #renderCanvas,.home #controls,.home #home-btn,.home #joystick{display:none}#home{padding:max(24px, env(safe-area-inset-top)) 0 max(24px, env(safe-area-inset-bottom));box-sizing:border-box;flex-direction:column;display:flex;position:fixed;inset:0;overflow:hidden}#home .track{will-change:transform;flex:1;min-height:0;transition:transform .35s cubic-bezier(.25,.8,.3,1);display:flex}#home .slide{cursor:pointer;flex:0 0 100%;place-items:center;display:grid;position:relative}#home .slide img{object-fit:contain;object-position:center;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}#home .slide canvas.live{pointer-events:none;visibility:hidden;outline:none;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}#home .slide.live canvas.live{visibility:visible}#home .slide.live img{visibility:hidden}#home .slide.loading img,#home .slide.failed img{display:none}#home .slide.loading:after{content:"";background:var(--chip);border-radius:50%;width:28px;height:28px;animation:1s ease-in-out infinite alternate pulse;box-shadow:0 2px 8px #4a423c26}@keyframes pulse{to{opacity:.5;transform:scale(.6)}}#home .dots{justify-content:center;align-items:center;margin-top:16px;display:flex}#home .dots button{background:0 0;border:none;place-items:center;width:28px;height:24px;padding:0;transition:width .25s;display:grid;overflow:hidden}#home .dots button.out{width:0}#home .dots button.near-edge:before{transform:scale(.75)}#home .dots button.edge:before{transform:scale(.5)}#home .dots button:before{content:"";background:var(--ink-soft);opacity:.45;border-radius:50%;width:7px;height:7px;transition:all .25s}#home .dots button.on:before{opacity:1;background:#d65a54;width:16px;height:16px}#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}