*{box-sizing:border-box}
html{background:#fff;color:#242424;font-family:system-ui,-apple-system,sans-serif}
body{margin:0;min-height:100svh;display:grid;grid-template-rows:1fr auto}
main{position:relative;display:grid;place-items:center;min-height:260px;padding:40px 24px}
#engine{display:block;width:clamp(150px,24vw,200px);padding:0;background:transparent;border:0;border-radius:50%;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;transition:transform .16s ease;filter:drop-shadow(0 9px 9px #0002)}
#engine img{display:block;width:100%;height:auto;user-select:none}
#engine:focus-visible{outline:3px solid #ad2029;outline-offset:10px}
#engine:active{transform:translateY(5px) scale(.94)}
#engine.fired{animation:recoil .65s ease-out}
@keyframes recoil{0%,25%{transform:translateY(5px) scale(.94)}65%{transform:translateY(-1px) scale(1.015)}100%{transform:none}}
 .sound-control{margin-bottom:22px;text-align:center}
#sound-toggle{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:1fr;width:min(100%,340px);margin:0 auto;padding:0;overflow:hidden;border:1px solid #c9c9c9;border-radius:8px;background:#f7f7f7;color:#444;font:700 .875rem/1.5 system-ui;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
#sound-toggle span{display:flex;align-items:center;justify-content:center;padding:13px 8px;min-height:52px;min-width:0;text-align:center}
#sound-toggle span:nth-child(odd){border-right:1px solid #d8d8d8}
#sound-toggle span:nth-child(-n+2){border-bottom:1px solid #d8d8d8}
#sound-toggle .sound-caption{font-weight:700;color:#666}
#sound-toggle #sound-action{background:#333;color:white;font-size:inherit;font-weight:800}
#sound-toggle[aria-pressed="true"]{background:#f0f8f3;border-color:#8aab95;color:#24643c}
#sound-toggle[aria-pressed="true"] #sound-action{background:#24643c}
#sound-toggle:focus-visible{outline:3px solid #ad2029;outline-offset:3px}
#sound-hint{font-size:inherit;font-weight:700}
#sound-state{font-weight:800}
#status{margin:6px 0 0;color:#666;font-size:14px;line-height:1.6}
#status:empty{display:none}
footer{text-align:center;padding:24px 20px max(28px,env(safe-area-inset-bottom));font-size:14px}
footer a{color:#656565;text-decoration:none;text-underline-offset:4px}
footer a:hover{text-decoration:underline}
@media(prefers-reduced-motion:reduce){#engine{transition:none}#engine.fired{animation:none}}