*{box-sizing:border-box;margin:0;padding:0;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}html,body{width:100%;height:100%;height:100dvh;overflow:hidden;background:#000;display:flex;align-items:center;justify-content:center;touch-action:none;font-family:-apple-system,BlinkMacSystemFont,Helvetica Neue,sans-serif;position:fixed}#app{width:100%;height:100%;height:100dvh;display:flex;align-items:center;justify-content:center;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}.canvas-wrapper{width:100%;height:100%;max-width:56.25dvh;max-height:calc(100vw * (1024 / 576));position:relative;display:flex;align-items:center;justify-content:center}canvas#metronome-canvas{width:100%;height:100%;display:block;cursor:pointer;touch-action:none}