*{box-sizing:border-box}html,body{color:#fff7d6;background:radial-gradient(circle at 50% 30%,#2d2350,#120c1f 70%);height:100%;margin:0;font-family:Trebuchet MS,Comic Sans MS,Segoe UI,sans-serif}.wrap{flex-direction:column;justify-content:center;align-items:center;gap:12px;min-height:100%;padding:12px;display:flex}.stage{aspect-ratio:2;width:min(96vw,200vh - 160px);position:relative}canvas{cursor:pointer;background:#1d2b53;border:5px solid #2a1b33;border-radius:22px;width:100%;height:100%;display:block;box-shadow:0 10px 40px #00000080,0 0 0 4px #6cc04a}.sound{color:#2a1b33;cursor:pointer;background:#fff3c4;border:3px solid #2a1b33;border-radius:14px;padding:6px 12px;font-family:inherit;font-size:15px;font-weight:700;position:absolute;bottom:14px;right:14px;box-shadow:0 3px #2a1b33}.sound:active{transform:translateY(2px);box-shadow:0 1px #2a1b33}.help{opacity:.8;text-align:center;margin:0;font-size:14px}