*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#080b11;color:#c4d7e7;font:14px system-ui}body{display:flex;flex-direction:column;align-items:center;gap:8px;padding:8px}nav{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;flex:none}button,a{color:#d9edff;background:#152333;border:1px solid #344e67;border-radius:8px;padding:8px 12px;font:inherit;cursor:pointer}a{text-decoration:none}button:focus-visible,a:focus-visible{outline:2px solid #6be4ff}#stage{position:relative;flex:1;min-height:40px;width:100%;overflow:hidden}#wrap{position:absolute;left:50%;top:50%;transform-origin:center center;background:#000;padding:0;opacity:0}.loaded #wrap{opacity:1}#wrap-inner{position:relative;overflow:hidden}canvas{position:absolute;top:0;left:0;display:block;cursor:crosshair;touch-action:none}#touch{display:none;flex:none;gap:28px;align-items:center;justify-content:center;width:100%}#move{display:grid;grid-template-columns:repeat(3,44px);grid-template-rows:repeat(2,42px);gap:4px;touch-action:none}#move button{padding:0;font-size:21px;touch-action:none;user-select:none}#move [data-dir=up]{grid-column:2}#move [data-dir=left]{grid-row:2;grid-column:1}#move [data-dir=down]{grid-row:2;grid-column:2}#move [data-dir=right]{grid-row:2;grid-column:3}#aim{width:104px;height:88px;display:grid;place-items:center;border:1px solid #47667d;border-radius:50%;background:radial-gradient(circle,#263e51,#0b1825);touch-action:none;user-select:none;color:#b4e9ff;font-size:13px}p{margin:0;font-size:12px;text-align:center;flex:none}#live{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}@media(pointer:coarse),(max-width:700px){#touch{display:flex}#hint{max-width:320px}nav{gap:4px}button,a{padding:7px 9px}}