*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none;background:#090e20;font-family:system-ui,sans-serif;color:#342c36}body{display:flex;justify-content:center}#frame{position:relative;width:390px;max-width:100vw;height:100dvh;overflow:hidden;flex-shrink:0;background:#11162f}canvas{display:block;width:100%;height:100%;touch-action:none}#keyboard{position:absolute;bottom:24px;left:12px;right:12px;display:flex;padding:12px;background:#fff8e9;border:4px solid white;border-radius:12px;gap:8px}#keyboard input{width:100%;min-width:0;border:1px solid #b9a37a;border-radius:7px;padding:10px;font-size:16px;color:#342c36}#keyboard button{flex-shrink:0;border:2px solid white;border-radius:7px;background:#d9c18e;color:#342c36;padding:10px}
html,body{height:100%;min-height:0;overflow:hidden;overscroll-behavior:none}body{position:fixed;inset:0}#frame{--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);height:100%;height:var(--viewport-height,100dvh);max-width:100vw;overflow:hidden;flex-shrink:0}#privacy-open{display:none}dialog{max-width:340px;width:86vw;border:4px solid #fff;border-radius:20px;background:#fff9ea;color:#342c36;padding:24px;font-size:14px;line-height:1.8}dialog::backdrop{background:#090e20bb}dialog h2{margin-top:0;font-size:20px}dialog button{border:3px solid #fff;border-radius:10px;background:#e9ce96;color:#342c36;padding:10px 20px}