*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden;background:#f4f4f4;font-family:Arial,"PingFang SC","Microsoft YaHei",sans-serif;touch-action:none}body{display:grid;place-items:center}#shell{position:relative;width:min(100vw,560px);height:100dvh;max-height:960px;overflow:hidden;background:#f6f6f6;box-shadow:0 0 50px #0001}canvas{display:block;width:100%;height:100%;touch-action:none}#hud{position:absolute;top:max(22px,env(safe-area-inset-top));left:25px;right:25px;display:flex;justify-content:space-between;text-align:center;color:#555;pointer-events:none}#hud div{min-width:55px}#hud small{display:block;font-size:11px;letter-spacing:.14em;color:#999}#hud b{display:block;margin-top:3px;font-size:23px;font-weight:400}.score-box b{font-size:39px!important;line-height:.9}#precision{position:absolute;left:50%;top:26%;transform:translate(-50%,-8px);font-size:24px;font-weight:500;letter-spacing:.08em;opacity:0;transition:.22s;pointer-events:none;white-space:nowrap}#precision.show{opacity:1;transform:translate(-50%,0)}#power{position:absolute;left:50%;bottom:max(38px,env(safe-area-inset-bottom));width:min(74%,310px);height:13px;transform:translateX(-50%);border:1px solid #aaa;background:#fffa;border-radius:2px;opacity:0;transition:.15s;overflow:hidden}#power.show{opacity:1}#power>i{display:block;width:0;height:100%;background:linear-gradient(90deg,#7fa895 0 43%,#e5b66c 65%,#dc7767 100%)}.ticks{position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(5% - 1px),#7778 calc(5% - 1px),#7778 5%)}.overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#f6f6f6e8;opacity:0;pointer-events:none;transition:opacity .22s}.overlay.visible{opacity:1;pointer-events:auto}.overlay h1{margin:0 0 18px;font-size:39px;font-weight:400;letter-spacing:.1em;color:#333}.overlay p{margin:4px 0 26px;color:#888;font-size:15px}.overlay strong{font-size:70px;font-weight:300;color:#444;margin:-10px 0 22px}.overlay button{width:190px;padding:13px;border:1px solid #555;border-radius:4px;background:#fff;color:#333;font-size:17px;cursor:pointer}.overlay button:active{background:#ededed}
