@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800&display=swap";:root{color:#e9fff1;background:#061014;font-family:Inter,system-ui,sans-serif}*{box-sizing:border-box}body{margin:0}main{background:radial-gradient(circle at 50% 0,#12352d 0,#061014 52%);place-items:start center;min-height:100vh;padding:12px 24px 24px;display:grid}.card{background:#0a181dd1;border:1px solid #95ffb326;border-radius:28px;width:min(620px,100%);padding:28px;box-shadow:0 24px 80px #0007}header{justify-content:space-between;align-items:start;display:flex}h1{letter-spacing:.08em;margin:0;font-size:clamp(24px,5vw,34px);font-weight:800}header p{color:#91ada2;margin:7px 0 20px;font-size:13px}.sound{cursor:pointer;background:#ffffff0d;border:0;border-radius:12px;padding:10px;font-size:18px}.stats{gap:10px;margin-bottom:16px;display:flex}.stats span{color:#7f9d92;text-transform:uppercase;letter-spacing:.1em;background:#ffffff08;border-radius:12px;flex:1;padding:10px 12px;font-size:11px}.stats strong{color:#edfff2;letter-spacing:0;margin-top:3px;font-size:18px;display:block}.board-wrap{border:1px solid #75dd8940;border-radius:18px;max-width:520px;margin-inline:auto;position:relative;overflow:hidden}canvas{aspect-ratio:1;width:100%;display:block}.overlay{text-align:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#061014b9;place-content:center;padding:20px;display:grid;position:absolute;inset:0}h2{letter-spacing:.12em;margin:0 0 8px;font-size:30px}.overlay p{color:#a3b9ad;margin:0 0 20px;font-size:13px}.overlay button,footer button{color:#082016;cursor:pointer;background:#65e479;border:0;border-radius:12px;padding:12px 20px;font-weight:800}.overlay .secondary,footer .secondary{color:#c9dfd0;background:#ffffff0d}.pad{text-align:center;margin:16px auto 6px;display:none}.pad button{color:#dbffe2;cursor:pointer;touch-action:manipulation;background:#ffffff0b;border:1px solid #9cffae33;border-radius:12px;width:48px;height:44px;margin:3px;font-size:24px}.pad button:active,button:active{transform:scale(.94)}footer{gap:10px;margin-top:18px;display:flex}footer button{flex:1}@media (width<=600px){main{padding:12px}.card{border-radius:22px;padding:18px}.board-wrap{max-width:none}.pad{display:block}footer{margin-top:10px}h2{font-size:26px}.stats span{padding:8px;font-size:10px}.stats strong{font-size:16px}}
