fix: 💄 Enhance visualisation of the Tutorial on mobile

repl/src/tutorial/Tutorial.js

@@ -19,11 +19,9 @@ ReactDOM.render(
           )}
         </div>
       </header>
-      <div className="flex justify-center">
-        <main className="p-4 max-w-3xl prose">
-          <Tutorial />
-        </main>
-      </div>
+      <main className="p-4 max-w-3xl prose">
+        <Tutorial />
+      </main>
     </div>
   </React.StrictMode>,
   document.getElementById('root')

repl/src/tutorial/style.css

@@ -8,6 +8,6 @@
   height: inherit !important;
 }
 
-.justify-center {
-  justify-content: center;
+main {
+  margin: 0 auto;
 }

repl/src/tutorial/tutorial.mdx

@@ -315,7 +315,7 @@ Like "\*" in mini notation, **fast** will play a pattern times the given number
 
 With early, you can nudge a pattern to start earlier in time:
 
-<MiniRepl tune={`cat(e5, b4.late(0.5))`} />
+<MiniRepl tune={`cat(e5, b4.early(0.5))`} />
 
 ### late(cycles)