*{box-sizing:border-box}body{color:#e8e4da;background:#16161d;flex-direction:column;min-height:100dvh;margin:0;padding:0;font-family:system-ui,sans-serif;display:flex}header{padding:.75rem 1rem}header nav a{color:#e8e4da;font-size:.9rem;text-decoration:none}header nav a:hover,header nav a:focus-visible{text-decoration:underline}main{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:.75rem;padding:0 1rem 1.5rem;display:flex}h1{letter-spacing:.08em;text-transform:uppercase;margin:0;font-size:1rem;font-weight:600}canvas{touch-action:none;cursor:pointer;background:#e8e4da;border-radius:.5rem;width:min(90vw,720px);height:clamp(400px,60vh,480px)}canvas:focus-visible{outline-offset:2px;outline:3px solid #7fb2ff}.visually-hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}
