*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#f7f4ed;color:#38473e;font-family:system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif}html{-webkit-text-size-adjust:100%;text-size-adjust:100%}body{padding:16px;min-width:0;width:100%}main{width:100%;max-width:1000px;margin:auto;min-width:0}header{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;min-height:32px}h1{font-size:20px;margin:0;font-weight:650}nav{display:flex;align-items:center;gap:14px}a,button{font:inherit;font-size:13px;color:inherit}a{text-underline-offset:3px}button{border:1px solid #c8cfc8;border-radius:6px;background:#fffdf7;padding:6px 10px;cursor:pointer}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:2px solid #2c6c58;outline-offset:3px}#stage{position:relative;width:100%;max-width:650px;margin:auto;overflow:hidden;background:#acd1ed;aspect-ratio:650/450}canvas{display:block;position:absolute;inset:0;width:100%;height:100%;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}#loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;margin:0;background:#f7f4ed;font-size:15px}#tip,#notice{font-size:12px;line-height:1.6;text-align:center;color:#687369;margin:12px 0}#notice:empty{display:none}#touch-controls{width:100%;max-width:650px;margin:10px auto 0;display:flex;justify-content:space-between;align-items:center;gap:12px;user-select:none;-webkit-user-select:none}#touch-controls>div{display:flex;gap:8px}#touch-controls button{touch-action:none;min-width:54px;min-height:44px;padding:10px;font-weight:600;-webkit-tap-highlight-color:transparent}#touch-controls button.pressed{background:#2c6c58;color:white;border-color:#2c6c58}.sr-only,.keyboard-controls{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.keyboard-controls:focus-within{position:static;width:auto;height:auto;clip:auto;white-space:normal;text-align:center;margin:12px 0}.keyboard-controls button{margin:3px}[hidden]{display:none!important}@media(max-width:550px){body{padding:8px}h1{font-size:17px}header{margin-bottom:8px}nav{gap:8px}a,button{font-size:12px}#touch-controls{gap:6px}#touch-controls>div{gap:5px}#touch-controls button{min-width:45px;padding:8px}#tip{margin:8px 0}}@media(max-height:500px) and (orientation:landscape){body{padding:4px}header{margin:0 auto 4px;max-width:650px;min-height:24px}h1{font-size:14px}nav{gap:12px}nav a,nav button{font-size:11px;padding:3px 7px}#stage{max-width:min(650px,calc((100dvh - 104px)*650/450))}#touch-controls{max-width:min(650px,calc((100dvh - 104px)*650/450));margin-top:5px}#touch-controls button{min-height:40px;padding:5px 12px}#tip{display:none}}
