diff --git a/README.md b/README.md
index 670ae9a..ecccf5e 100644
--- a/README.md
+++ b/README.md
@@ -6,21 +6,47 @@
   <strong><em>Browser-based live looper for music performance and audio fun!</em></strong>
 </p>
 
+- [How to use](#how-to-use)
+- [Motivation](#motivation)
+- [What features does this have?](#what-features-does-this-have)
+- [Where can I read more?](#where-can-i-read-more)
+- [Building / running locally](#building-running-locally)
+- [Useful resources in my Web Audio journey](#useful-resources-in-my-web-audio-journey)
+- [Acknowledgements](#acknowledgements)
+
+## How to use
+
+1. Go to [loopsupreme.com](https://loopsupreme.com)
+2. Click "play"
+3. Arm a track for recording
+4. Add more tracks and keep building!
+
 ## Motivation
 
 I wanted to do some live looping on my keyboard but wasn't super satisfied with any of the options out there. I wanted something quick-and-dirty but made it (somewhat) easy to do a loop performance.
 
 I've also been itching for a side project. Seemed like a great way to feed two birds with one scone!
 
-## What features does / will this have?
+## What features does this have?
 
 You can check out [The Roadmap](./roadmap.md)!
 
 ## Where can I read more?
 
-I'm planning to blog about the experience of building it.
+I blogged about this as I made it
 
-You can [check out my blog here!](https://ericyd.hashnode.dev/)
+* Part 12: v1.0 release, and project retro (_coming soon!_)
+* [Part 11: Exporting stems and changing inputs](https://ericyd.hashnode.dev/loop-supreme-part-11-exporting-stems-and-changing-inputs)
+* [Part 10: Keyboard bindings](https://ericyd.hashnode.dev/loop-supreme-part-10-keyboard-bindings)
+* [Part 9: Visualizing the waveform](https://ericyd.hashnode.dev/loop-supreme-part-9-visualizing-the-waveform)
+* [Part 8: Building and hosting](https://ericyd.hashnode.dev/loop-supreme-part-8-building-and-hosting)
+* [Part 7: Latency and adding Track functionality](https://ericyd.hashnode.dev/loop-supreme-part-7-latency-and-adding-track-functionality)
+* [Part 6: Workers and AudioWorklets](https://ericyd.hashnode.dev/loop-supreme-part-6-workers-and-audioworklets)
+* [Part 5: Record and loop a track](https://ericyd.hashnode.dev/loop-supreme-part-5-record-and-loop-a-track)
+* [Part 4: Adding a Scene](https://ericyd.hashnode.dev/loop-supreme-part-4-adding-a-scene)
+* [Part 3: Metronome click](https://ericyd.hashnode.dev/loop-supreme-part-3-metronome-click)
+* [Part 2: Adding a Metronome](https://ericyd.hashnode.dev/loop-supreme-part-2-adding-a-metronome)
+* [Part 1: New project: building a web-based audio looper!](https://ericyd.hashnode.dev/new-project-building-a-web-based-audio-looper)
 
 ## Building / running locally
 
@@ -52,7 +78,13 @@ npm run build
     - https://googlechromelabs.github.io/web-audio-samples/audio-worklet/
     - https://developer.chrome.com/blog/audio-worklet-design-pattern/
     - https://github.com/GoogleChromeLabs/web-audio-samples/tree/main/src/audio-worklet/migration/worklet-recorder
+- inspiration
+  - https://github.com/pkalogiros/AudioMass/
 
-## Icon attribution
+## Acknowledgements
 
 - Metronome by ChangHoon Baek from <a href="https://thenounproject.com/icon/metronome-118052/" target="_blank" title="Metronome Icons">Noun Project</a>
+- Cloudflare Pages has an amazing free hosting tier, and great admin and tooling
+- create-react-app is still going strong and super useful
+- [Chicle font](https://fonts.google.com/specimen/Chicle) used in the logo, copyright (c) 2011 Angel Koziupa (sudtipos@sudtipos.com) and copyright (c) 2011 Alejandro Paul (sudtipos@sudtipos.com)
+- MDN, what would we do without you
diff --git a/package.json b/package.json
index cd7b92a..75526c7 100644
--- a/package.json
+++ b/package.json
@@ -23,8 +23,6 @@
     "wrangler": "^2.4.2"
   },
   "scripts": {
-    "css": "npx tailwindcss -i src/index.css -o ./public/output.css",
-    "css:watch": "npx tailwindcss -i src/index.css -o ./public/output.css --watch",
     "start": "react-scripts start",
     "build": "react-scripts build",
     "postbuild": "./scripts/postbuild.sh",
diff --git a/public/icons/apple-touch-icon.png b/public/icons/apple-touch-icon.png
new file mode 100644
index 0000000..6ac1877
Binary files /dev/null and b/public/icons/apple-touch-icon.png differ
diff --git a/public/icons/iconmonstr-refresh-2-240.ico b/public/icons/iconmonstr-refresh-2-240.ico
deleted file mode 100644
index 0c31968..0000000
Binary files a/public/icons/iconmonstr-refresh-2-240.ico and /dev/null differ
diff --git a/public/icons/loop-supreme-icon-192.png b/public/icons/loop-supreme-icon-192.png
new file mode 100644
index 0000000..c1e2cfa
Binary files /dev/null and b/public/icons/loop-supreme-icon-192.png differ
diff --git a/public/icons/loop-supreme-icon-512.png b/public/icons/loop-supreme-icon-512.png
new file mode 100644
index 0000000..67363ba
Binary files /dev/null and b/public/icons/loop-supreme-icon-512.png differ
diff --git a/public/icons/loop-supreme-icon.ico b/public/icons/loop-supreme-icon.ico
new file mode 100644
index 0000000..94d2294
Binary files /dev/null and b/public/icons/loop-supreme-icon.ico differ
diff --git a/public/icons/loop-supreme-icon.svg b/public/icons/loop-supreme-icon.svg
new file mode 100644
index 0000000..e68502d
--- /dev/null
+++ b/public/icons/loop-supreme-icon.svg
@@ -0,0 +1,83 @@
+<svg version="1.1" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg">
+
+<defs>
+<!-- From: https://tympanus.net/codrops/2019/01/22/svg-filter-effects-outline-text-with-femorphology/ -->
+<filter id="outline1" x="-256" y="-256" height="512" width="512">
+  <!-- dilate the alpha channel twice: once for the padding (transparent), and another time for the outline -->
+  <feMorphology operator="dilate" radius="5" in="SourceAlpha" result="PADDING" />
+  <feMorphology operator="dilate" radius="25" in="SourceAlpha" result="OUTLINE_BASE" />
+
+  <!-- define the color we want for the outline -->
+  <feFlood flood-color="#528eb0ff" flood-opacity="1" result="OUTLINE_COLOR"></feFlood>
+  
+
+    <!-- cut out the "padding" from the base outline -->
+  <feComposite operator="out" in="OUTLINE_BASE" in2="PADDING" result="CUTOUT"></feComposite>
+  <!-- color the outline with the flood color -->
+  <feComposite operator="in" in="OUTLINE_COLOR" in2="CUTOUT" result="CUTOUT_COLOR"></feComposite>
+</filter>
+
+<filter id="outline2" x="-256" y="-256" height="512" width="512">
+  <feMorphology operator="dilate" radius="30" in="SourceAlpha" result="PADDING" />
+  <feMorphology operator="dilate" radius="50" in="SourceAlpha" result="OUTLINE_BASE" />
+  <feFlood flood-color="#c6c0e9ff" flood-opacity="1" result="OUTLINE_COLOR"></feFlood>
+  <feComposite operator="out" in="OUTLINE_BASE" in2="PADDING" result="CUTOUT"></feComposite>
+  <feComposite operator="in" in="OUTLINE_COLOR" in2="CUTOUT" result="CUTOUT_COLOR"></feComposite>
+</filter>
+
+<filter id="outline3" x="-256" y="-256" height="512" width="512">
+  <feMorphology operator="dilate" radius="55" in="SourceAlpha" result="PADDING" />
+  <feMorphology operator="dilate" radius="75" in="SourceAlpha" result="OUTLINE_BASE" />
+  <feFlood flood-color="#fadd8eff" flood-opacity="1" result="OUTLINE_COLOR"></feFlood>
+  <feComposite operator="out" in="OUTLINE_BASE" in2="PADDING" result="CUTOUT"></feComposite>
+  <feComposite operator="in" in="OUTLINE_COLOR" in2="CUTOUT" result="CUTOUT_COLOR"></feComposite>
+</filter>
+
+<filter id="outline4" x="-256" y="-256" height="512" width="512">
+  <feMorphology operator="dilate" radius="80" in="SourceAlpha" result="PADDING" />
+  <feMorphology operator="dilate" radius="100" in="SourceAlpha" result="OUTLINE_BASE" />
+  <feFlood flood-color="#f1b0b0ff" flood-opacity="1" result="OUTLINE_COLOR"></feFlood>
+  <feComposite operator="out" in="OUTLINE_BASE" in2="PADDING" result="CUTOUT"></feComposite>
+  <feComposite operator="in" in="OUTLINE_COLOR" in2="CUTOUT" result="CUTOUT_COLOR"></feComposite>
+</filter>
+
+<filter id="outline5" x="-256" y="-256" height="512" width="512">
+  <feMorphology operator="dilate" radius="105" in="SourceAlpha" result="PADDING" />
+  <feMorphology operator="dilate" radius="125" in="SourceAlpha" result="OUTLINE_BASE" />
+  <feFlood flood-color="#b1daeeff" flood-opacity="1" result="OUTLINE_COLOR"></feFlood>
+  <feComposite operator="out" in="OUTLINE_BASE" in2="PADDING" result="CUTOUT"></feComposite>
+  <feComposite operator="in" in="OUTLINE_COLOR" in2="CUTOUT" result="CUTOUT_COLOR"></feComposite>
+</filter>
+
+<filter id="outline6" x="-256" y="-256" height="512" width="512">
+  <feMorphology operator="dilate" radius="130" in="SourceAlpha" result="PADDING" />
+  <feMorphology operator="dilate" radius="150" in="SourceAlpha" result="OUTLINE_BASE" />
+  <feFlood flood-color="#411a71ff" flood-opacity="1" result="OUTLINE_COLOR"></feFlood>
+  <feComposite operator="out" in="OUTLINE_BASE" in2="PADDING" result="CUTOUT"></feComposite>
+  <feComposite operator="in" in="OUTLINE_COLOR" in2="CUTOUT" result="CUTOUT_COLOR"></feComposite>
+</filter>
+
+<filter id="outline7" x="-256" y="-256" height="512" width="512">
+  <feMorphology operator="dilate" radius="155" in="SourceAlpha" result="PADDING" />
+  <feMorphology operator="dilate" radius="175" in="SourceAlpha" result="OUTLINE_BASE" />
+  <feFlood flood-color="#c9574fff" flood-opacity="1" result="OUTLINE_COLOR"></feFlood>
+  <feComposite operator="out" in="OUTLINE_BASE" in2="PADDING" result="CUTOUT"></feComposite>
+  <feComposite operator="in" in="OUTLINE_COLOR" in2="CUTOUT" result="CUTOUT_COLOR"></feComposite>
+</filter>
+
+ <g stroke-width="107.67" aria-label="L" id="L">
+  <path d="m324.27 315.07q0 30.827-12.134 44.6t-58.046 13.774q-20.988 0-31.81-2.2956-10.494-2.2956-12.79-4.9191-2.2956-2.9515-2.2956-8.1986l0.65588-4.9191q7.5427-40.665 7.5427-110.52l-1.3118-55.75q-0.65589-11.806-7.5427-21.316-4.2632-4.2632-4.2632-8.8544 0-10.822 19.677-21.316 20.004-10.494 31.154-10.494 11.15 0 11.15 9.1824-4.2632 32.794-5.2471 60.013-0.65588 26.891-0.65588 61.653 0 34.434 0.32794 41.649 0.32794 7.2147 0.32794 7.8706 0.32794 0.65589 0.98383 2.2956 0.98382 1.6397 2.6235 2.9515 3.9353 2.9515 12.134 2.9515 18.037 0 28.859-12.462 5.2471-5.2471 10.494-5.2471 10.166 0 10.166 19.349z"/>
+ </g>
+
+ </defs>
+
+<use href="#L" filter="url(#outline7)" />
+<use href="#L" filter="url(#outline6)" />
+<use href="#L" filter="url(#outline5)" />
+<use href="#L" filter="url(#outline4)" />
+<use href="#L" filter="url(#outline3)" />
+<use href="#L" filter="url(#outline2)" />
+<use href="#L" filter="url(#outline1)" />
+<use href="#L"  />
+
+</svg>
diff --git a/public/icons/loop-supreme-logo.png b/public/icons/loop-supreme-logo.png
deleted file mode 100644
index ea776e1..0000000
Binary files a/public/icons/loop-supreme-logo.png and /dev/null differ
diff --git a/public/icons/loop-supreme-logo.svg b/public/icons/loop-supreme-logo.svg
deleted file mode 100644
index eead509..0000000
--- a/public/icons/loop-supreme-logo.svg
+++ /dev/null
@@ -1,22 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<!-- Created with Inkscape (http://www.inkscape.org/) -->
-<svg version="1.1" viewBox="0 0 88.156 88.156" xmlns="http://www.w3.org/2000/svg">
- <g transform="translate(-107.76 -138.88)">
-  <g aria-label="Loop Supreme">
-   <circle cx="151.83" cy="182.96" r="42.707" fill="none" stroke="#000" stroke-width="2.741"/>
-   <g transform="rotate(-14.839)" stroke-width="1.5208" aria-label="Loop Supreme">
-    <path d="m90.673 198.69q0 2.2559-0.88796 3.2638t-4.2478 1.008q-1.5359 0-2.3279-0.16799-0.76796-0.16799-0.93595-0.35998-0.16799-0.21599-0.16799-0.59997l0.048-0.35998q0.55197-2.9758 0.55197-8.0876l-0.096-4.0798q-0.048-0.86396-0.55197-1.5599-0.31198-0.31198-0.31198-0.64796 0-0.79196 1.4399-1.5599 1.4639-0.76796 2.2799-0.76796t0.81596 0.67197q-0.31198 2.3999-0.38398 4.3918-0.048 1.9679-0.048 4.5118 0 2.5199 0.024 3.0478 0.024 0.52798 0.024 0.57597 0.024 0.048 0.072 0.16799 0.072 0.12 0.19199 0.21599 0.28799 0.21599 0.88796 0.21599 1.3199 0 2.1119-0.91195 0.38398-0.38398 0.76796-0.38398 0.74396 0 0.74396 1.4159z"/>
-    <path d="m95.593 190.6q2.0879 0 3.1678 1.8239 1.1039 1.8239 1.1039 4.4638 0 3.4798-1.9919 5.2797-1.1039 0.98395-2.4479 0.98395t-2.2319-0.55197q-0.86396-0.55197-1.3199-1.4639-0.93595-1.7759-0.93595-3.7918 0-2.3519 1.0799-4.4158 0.52797-1.032 1.4639-1.6799t2.1119-0.64797zm1.3919 5.1118q0-0.71997-0.28799-1.2959-0.28798-0.57597-0.95995-0.57597-0.64797 0-1.2719 0.93595-0.59997 0.91196-0.59997 2.2319 0 1.8479 1.2239 1.8479 0.67197 0 1.2719-0.83996 0.62397-0.83996 0.62397-2.3039z"/>
-    <path d="m105.02 190.6q2.0879 0 3.1678 1.8239 1.1039 1.8239 1.1039 4.4638 0 3.4798-1.9919 5.2797-1.1039 0.98395-2.4479 0.98395-1.3439 0-2.2319-0.55197-0.86396-0.55197-1.3199-1.4639-0.93595-1.7759-0.93595-3.7918 0-2.3519 1.08-4.4158 0.52797-1.032 1.4639-1.6799 0.93596-0.64797 2.1119-0.64797zm1.3919 5.1118q0-0.71997-0.28799-1.2959-0.28798-0.57597-0.95995-0.57597-0.64797 0-1.2719 0.93595-0.59997 0.91196-0.59997 2.2319 0 1.8479 1.2239 1.8479 0.67197 0 1.2719-0.83996 0.62397-0.83996 0.62397-2.3039z"/>
-    <path d="m112.49 190.55q0.79197 0 0.79197 1.4159 0.072 0.144 0.14399 0.144 0.096 0 0.19199-0.12 0.096-0.14399 0.23999-0.31198 0.16799-0.19199 0.67196-0.47998 0.52798-0.28798 1.2959-0.28798t1.4879 0.52797q0.71997 0.50397 1.104 1.3919 0.71996 1.6559 0.71996 4.0318 0 0.74396-0.28798 1.9439-0.26399 1.1999-0.64797 2.0159-0.38398 0.79196-1.1759 1.4159t-1.8479 0.62397q-0.57597 0-1.032-0.19199t-0.62397-0.38398l-0.19199-0.16799q-0.072-0.072-0.14399-0.072-0.11999 0-0.16799 0.21599-0.072 1.1999-0.072 2.3519 0 1.1759 0.048 1.8479 0.072 0.69596 0.072 0.86396 0 0.79196-0.55198 1.2239-1.2719 1.08-3.0958 1.08-0.71997 0-0.71997-0.69596l0.072-0.43198q0.64797-1.8479 0.95995-4.1758 0.33599-2.3279 0.38398-4.0078 0.072-1.7039 0.072-3.3838 0-1.7039-0.024-2.2319-0.072-0.88796-0.62397-1.1999l-0.16799-0.12q-0.31198-0.28798-0.31198-0.57597 0-0.81596 1.2479-1.5359 1.2719-0.71997 2.1839-0.71997zm0.76797 5.6157q0 1.032 0.40798 1.8239 0.43197 0.76796 1.008 0.76796 0.57597 0 0.95995-0.62397 0.38398-0.64796 0.38398-1.6799 0-1.056-0.43198-1.8239-0.43198-0.79196-1.008-0.79196t-0.95995 0.64797q-0.35998 0.64796-0.35998 1.6799z"/>
-    <path d="m72.89 223.57q0.62397 0.79196 1.0559 1.9439t0.43198 2.4479q0 1.2719-0.33598 2.2319-0.31198 0.95996-0.86396 1.5119-0.52797 0.55197-1.0799 0.91195-0.52797 0.35998-1.1519 0.50398-0.93595 0.21599-1.4159 0.21599-2.1119 0-3.3358-1.2239-1.1999-1.2239-1.1999-3.1918 0-1.104 0.52797-2.0639 0.55197-0.98395 1.3919-0.98395 0.28799 0 0.45598 0.21599 0.19199 0.21599 0.23999 0.74396 0.048 0.52798 0.21599 1.032 0.16799 0.47998 0.35998 0.71996 0.19199 0.21599 0.43198 0.35999 0.33598 0.16799 0.57597 0.16799 0.59997 0 0.93595-0.40798 0.33598-0.43198 0.33598-1.128 0-0.69596-0.45598-1.5119-0.45598-0.83996-1.1039-1.5839-0.62397-0.76796-1.2719-1.5359-1.5599-1.8479-1.5599-3.5038 0-2.1599 1.4399-3.3118 1.4639-1.1759 3.7198-1.1759 1.2479 0 1.7759 0.47997 0.55197 0.47998 0.55197 1.7039 0 1.1999-0.69596 1.1999-0.23999 0-0.64797-0.16799-0.38398-0.192-0.88796-0.192t-0.83996 0.40798-0.33598 1.032q0 0.59997 0.43198 1.2959 0.43198 0.69596 1.0559 1.3919 0.62397 0.67196 1.2479 1.4639z"/>
-    <path d="m75.434 229.33 0.072-3.8878q0-0.69596-0.11999-1.1999-0.11999-0.52797-0.38398-0.81596-0.23999-0.31198-0.23999-0.64797 0-0.74396 1.1999-1.3679 1.1999-0.64796 1.8479-0.64796t0.86396 0.26398q0.23999 0.26399 0.23999 0.95995 0 0.69597-0.11999 2.2079-0.11999 1.4879-0.11999 1.7999 0 2.6159 1.1279 2.6159 0.81596 0 1.1039-1.7039 0.11999-0.62397 0.11999-1.3919 0-1.5359-0.26399-2.2799-0.26399-0.33598-0.26399-0.64797 0-0.71996 1.0799-1.1999 1.0799-0.50397 1.8959-0.50397 0.83996 0 0.83996 0.83996 0 0.81596-0.16799 2.5679-0.14399 1.7519-0.14399 2.7839 0 1.008 0.024 1.4399 0.024 0.40798 0.23999 1.2479 0.23999 0.81595 0.62397 1.0559 0.40798 0.19199 0.40798 0.52798 0 0.31198-0.19199 0.57597-0.88796 1.2239-2.8079 1.2239-1.0799-0.072-1.2239-0.81596l-0.16799-0.81596q-0.024-0.16799-0.14399-0.16799l-0.19199 0.096q-0.86396 1.6319-2.6399 1.6319-2.4959-0.048-2.4959-3.7438z"/>
-    <path d="m88.489 220.71q0.79196 0 0.79196 1.4159 0.072 0.14399 0.14399 0.14399 0.096 0 0.19199-0.11999 0.096-0.144 0.23999-0.31199 0.16799-0.19199 0.67197-0.47997 0.52797-0.28799 1.2959-0.28799 0.76796 0 1.4879 0.52797 0.71996 0.50398 1.1039 1.3919 0.71996 1.6559 0.71996 4.0318 0 0.74397-0.28798 1.9439-0.26399 1.1999-0.64797 2.0159-0.38398 0.79196-1.1759 1.4159-0.79196 0.62397-1.8479 0.62397-0.57597 0-1.0319-0.19199t-0.62397-0.38398l-0.19199-0.16799q-0.072-0.072-0.14399-0.072-0.11999 0-0.16799 0.21599-0.072 1.1999-0.072 2.3519 0 1.176 0.048 1.8479 0.072 0.69597 0.072 0.86396 0 0.79196-0.55197 1.2239-1.2719 1.0799-3.0958 1.0799-0.71996 0-0.71996-0.69596l0.072-0.43198q0.64797-1.8479 0.95995-4.1758 0.33598-2.3279 0.38398-4.0078 0.072-1.7039 0.072-3.3838 0-1.7039-0.024-2.2319-0.072-0.88796-0.62397-1.1999l-0.16799-0.11999q-0.31198-0.28799-0.31198-0.57597 0-0.81596 1.2479-1.5359 1.2719-0.71996 2.1839-0.71996zm0.76796 5.6157q0 1.032 0.40798 1.8239 0.43198 0.76796 1.0079 0.76796 0.57597 0 0.95995-0.62397 0.38398-0.64797 0.38398-1.6799 0-1.0559-0.43198-1.8239-0.43198-0.79196-1.008-0.79196t-0.95995 0.64797q-0.35998 0.64797-0.35998 1.6799z"/>
-    <path d="m99.529 230.89 0.048 0.59997q0 0.79196-0.55197 1.1759-0.93595 0.64797-2.3759 0.64797-0.91195 0-0.91195-0.79196l0.072-0.40798q0.57597-2.8319 0.57597-6.9357 0-1.2479-0.74396-1.7759-0.26399-0.16799-0.26399-0.55197 0-0.74396 1.1759-1.4399 1.1999-0.71996 1.9199-0.71996t0.81596 0.79196q0.096 0.55197 0.096 0.83996 0 0.26398 0.19199 0.26398 0.11999 0 0.16799-0.096 0.072-0.11999 0.11999-0.21599 0.072-0.11999 0.28799-0.38398 0.21599-0.28799 0.45598-0.47998 0.62396-0.55197 1.3919-0.55197 0.50397 0 1.008 0.31199 0.93595 0.57597 0.93595 2.2799 0 1.08-0.43198 1.8719t-1.3919 0.79196q-1.1999 0-1.1999-1.3199l0.024-0.35998q0-0.40798-0.33598-0.40798-1.2719 0-1.2719 3.6718 0 0.95995 0.19199 3.1918z"/>
-    <path d="m106.97 225.54q0 0.14399 0.096 0.23998 0.096 0.12 0.23999 0.12 1.3679-0.12 1.8239-1.2959 0.11999-0.26398 0.16799-0.62397-0.024-0.83995-0.67197-0.83995-0.74396 0-1.1519 0.71996-0.38398 0.71996-0.50397 1.6799zm1.6319-4.6078q1.6079 0 2.4959 0.81596 0.91196 0.81596 0.91196 2.4719 0 1.6559-1.3199 2.7359-1.2959 1.0799-3.2878 1.0799-0.28799 0-0.28799 0.28799 0 0.57597 0.40798 1.008 0.43198 0.40798 1.1519 0.40798 0.74397 0 1.3199-0.67197 0.59997-0.67197 1.0319-0.67197 0.45598 0 0.71997 0.38398 0.26399 0.38399 0.26399 1.104 0 0.69596-0.35999 1.4159-0.33598 0.69596-0.81596 1.056-0.47997 0.35998-1.0799 0.57597-0.88796 0.33598-1.8959 0.33598-0.98395 0-1.8479-0.47998-0.86396-0.47997-1.3439-1.2959-0.93595-1.6319-0.93595-3.5998 0-1.9919 0.47998-3.4558 0.47997-1.4639 1.6319-2.4719 1.176-1.032 2.7599-1.032z"/>
-    <path d="m116.28 226.62-0.048 1.7999q0 1.6799 0.072 2.3519 0.072 0.64796 0.072 0.81595 0 0.79196-0.55197 1.176-0.91195 0.62396-2.2799 0.62396-0.98395 0-0.98395-0.83995l0.048-0.38398q0.62397-2.9279 0.62397-7.3436 0-0.38398-0.16799-0.69596-0.16799-0.31199-0.52797-0.57597-0.26399-0.23999-0.26399-0.52798 0-0.76796 1.2719-1.4879 1.2719-0.71997 1.9919-0.71997 0.74396 0 0.79196 0.79196 0.048 0.33599 0.072 0.69597 0.048 0.16799 0.16799 0.16799 0.024 0 0.144-0.072 0.31198-0.47997 1.0559-0.88795 0.76797-0.40798 1.4879-0.40798 1.6079 0 2.0879 1.5839 0.048 0.072 0.12 0.072t0.16799-0.12q0.91195-1.5359 2.7599-1.5359 1.5119 0 1.8959 1.5599 0.28798 1.1519 0.28798 2.7359l-0.11999 3.0478q0 1.8479 0.81596 2.2799 0.40798 0.21599 0.40798 0.62397 0 0.69596-0.98395 1.2719-0.95995 0.55198-2.0399 0.55198t-1.2479-0.81596q-0.048-0.21599-0.048-1.104l0.144-3.8158q0.024-0.23999 0.024-0.64797 0-2.1119-0.88796-2.1119-0.57597 0-0.88796 0.69597-0.28798 0.67196-0.31198 1.2719t-0.024 1.5359q0 0.93596 0.024 1.6319 0.048 0.69597 0.096 1.128 0.048 0.40798 0.048 0.50397 0 0.71997-0.62397 1.1999-0.59997 0.47998-1.7999 0.47998-1.1759 0-1.1759-0.76796l0.096-0.55198q0.33598-1.5599 0.33598-5.0877 0-2.1119-0.91195-2.1119-0.59997 0-0.91196 0.67197-0.31198 0.67197-0.31198 1.3439z"/>
-    <path d="m130.85 225.54q0 0.14399 0.096 0.23998 0.096 0.12 0.23999 0.12 1.3679-0.12 1.8239-1.2959 0.11999-0.26398 0.16799-0.62397-0.024-0.83995-0.67196-0.83995-0.74397 0-1.152 0.71996-0.38398 0.71996-0.50397 1.6799zm1.6319-4.6078q1.6079 0 2.4959 0.81596 0.91196 0.81596 0.91196 2.4719 0 1.6559-1.3199 2.7359-1.2959 1.0799-3.2878 1.0799-0.28799 0-0.28799 0.28799 0 0.57597 0.40798 1.008 0.43198 0.40798 1.1519 0.40798 0.74397 0 1.3199-0.67197 0.59997-0.67197 1.032-0.67197 0.45597 0 0.71996 0.38398 0.26399 0.38399 0.26399 1.104 0 0.69596-0.35999 1.4159-0.33598 0.69596-0.81595 1.056-0.47998 0.35998-1.08 0.57597-0.88796 0.33598-1.8959 0.33598-0.98395 0-1.8479-0.47998-0.86396-0.47997-1.3439-1.2959-0.93595-1.6319-0.93595-3.5998 0-1.9919 0.47998-3.4558 0.47997-1.4639 1.6319-2.4719 1.176-1.032 2.7599-1.032z"/>
-   </g>
-  </g>
- </g>
-</svg>
diff --git a/public/index.html b/public/index.html
index e421763..293e669 100644
--- a/public/index.html
+++ b/public/index.html
@@ -2,17 +2,17 @@
 <html lang="en">
   <head>
     <meta charset="utf-8" />
-    <link rel="icon" href="%PUBLIC_URL%/icons/iconmonstr-refresh-2-240.ico" />
+    <link rel="icon" href="%PUBLIC_URL%/icons/loop-supreme-icon.ico" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta name="theme-color" content="#000000" />
     <meta property="og:title" content="Loop Supreme" />
     <meta
       property="og:description"
-      content="Browser-based live looper for audio performance and fun"
+      content="Browser-based live looper for music performance and audio fun"
     />
     <meta
       name="description"
-      content="Browser-based live looper for audio performance and fun"
+      content="Browser-based live looper for music performance and audio fun"
     />
     <meta property="og:url" content="https://loop-supreme.com" />
     <meta
@@ -22,7 +22,7 @@
     <meta property="og:type" content="website" />
     <link
       rel="apple-touch-icon"
-      href="%PUBLIC_URL%/icons/loop-supreme-logo.png"
+      href="%PUBLIC_URL%/icons/apple-touch-icon.png"
     />
     <!--
       manifest.json provides metadata used when your web app is installed on a
@@ -70,7 +70,7 @@ <h1>
               >GitHub</a
             >
             <a
-              href="https://ericyd.hashnode.dev/loop-supreme-part-10-keyboard-bindings"
+              href="https://ericyd.hashnode.dev/loop-supreme-part-11-exporting-stems-and-changing-inputs"
               target="_blank"
               rel="noreferrer"
               class="m-2 underline text-cyan-600 font-sans-real"
diff --git a/public/manifest.json b/public/manifest.json
index ca1290b..ae89bf3 100644
--- a/public/manifest.json
+++ b/public/manifest.json
@@ -3,14 +3,28 @@
   "name": "Loop Supreme",
   "icons": [
     {
-      "src": "icons/loop-supreme-logo.png",
+      "src": "icons/loop-supreme-icon-192.png",
       "type": "image/png",
-      "sizes": "240x240"
+      "sizes": "192x192",
+      "purpose": "any"
     },
     {
-      "src": "icons/loop-supreme-logo.svg",
-      "type": "image/svg",
-      "sizes": "240x240"
+      "src": "icons/loop-supreme-icon-512.png",
+      "type": "image/png",
+      "sizes": "512x512",
+      "purpose": "any"
+    },
+    {
+      "src": "icons/loop-supreme-icon-192.png",
+      "type": "image/png",
+      "sizes": "192x192",
+      "purpose": "maskable"
+    },
+    {
+      "src": "icons/loop-supreme-icon-512.png",
+      "type": "image/png",
+      "sizes": "512x512",
+      "purpose": "maskable"
     }
   ],
   "start_url": "https://loopsupreme.com",
diff --git a/roadmap.md b/roadmap.md
index ebf4c00..1a236c0 100644
--- a/roadmap.md
+++ b/roadmap.md
@@ -30,7 +30,6 @@ The `Metronome` is the heart of the app. The BPM, measure, current tick, and tim
 - [x] Metronome must initialize as "stopped", and can be "started" by user input https://github.com/ericyd/loop-supreme/pull/4
 - [x] Metronome can be muted, while still running https://github.com/ericyd/loop-supreme/pull/11
 - [x] ~move "playing" state into MetronomeControls; there is no obvious need for it to live in Metronome~ irrelevant after https://github.com/ericyd/loop-supreme/pull/28
-- [ ] allow changing tempo by typing value into an input
 
 ## Scene
 
@@ -43,7 +42,7 @@ A `Scene` is a collection of one or more Tracks. All Tracks in a Scene are synch
 - [ ] Component has a vertical line that tracks the current tick/current measure
 - [ ] global lock prevents recording multiple tracks at once
 
-## Track
+## ✅ Track
 
 A `Track` is a single mono or stereo audio buffer that contains audio data. A `Track` can be armed for recording, de-armed, muted, and unmuted. By default, the audio data in a `Track` will loop indefinitely. The audio data in a `Track` can be cleared.
 
@@ -91,7 +90,7 @@ A `Track` is a single mono or stereo audio buffer that contains audio data. A `T
 - [x] building (GH Actions) https://github.com/ericyd/loop-supreme/pull/17 and https://github.com/ericyd/loop-supreme/pull/19
 - [x] hosting (Cloudflare)
 
-## Misc
+## ✅ Misc
 
 - [x] `Bug`: using keyboard shortcuts is causing weird recording artifacts... 😭 https://github.com/ericyd/loop-supreme/pull/30
 - [x] clean up "start" button/view
@@ -113,3 +112,7 @@ A `Track` is a single mono or stereo audio buffer that contains audio data. A `T
 - [ ] make Track controls slightly less wide
 - [x] add track ID indicator so keyboard controls make sense
 - [x] make beat counter sticky so you can see it even when you scroll
+
+## Enhancements
+
+- [ ] allow changing tempo by typing value into an input
diff --git a/src/AudioProvider/index.tsx b/src/AudioProvider/index.tsx
index 681ede0..0ac8535 100644
--- a/src/AudioProvider/index.tsx
+++ b/src/AudioProvider/index.tsx
@@ -1,6 +1,5 @@
 /**
- * Exposes AudioContext (the web audio kind, not a React context)
- * and a MediaStream globally.
+ * Exposes AudioContext (the web audio kind, not a React context) globally.
  * This could probably just be passed as props, but this is marginally more convenient.
  */
 import React, { createContext, useContext } from 'react'
diff --git a/src/Track/Waveform.tsx b/src/Track/Waveform.tsx
index ff66f67..29b2402 100644
--- a/src/Track/Waveform.tsx
+++ b/src/Track/Waveform.tsx
@@ -8,30 +8,31 @@ type Props = {
   worker: Worker
   sampleRate: number
 }
-export function Waveform(props: Props) {
+export function Waveform({ worker, sampleRate }: Props) {
   const [path, setPath] = useState('M 0 0')
 
   const yMax = 2
   const xMax = 30
   useEffect(() => {
-    props.worker.postMessage({
+    worker.postMessage({
       message: 'INITIALIZE',
       yMax,
       xMax,
-      sampleRate: props.sampleRate,
+      sampleRate,
     } as WaveformWorkerInitializeMessage)
   })
 
   useEffect(() => {
-    props.worker.addEventListener(
-      'message',
-      (event: MessageEvent<WaveformControllerMessage>) => {
-        if (event.data.message === 'WAVEFORM_PATH') {
-          setPath(event.data.path)
-        }
+    const messageHandler = (event: MessageEvent<WaveformControllerMessage>) => {
+      if (event.data.message === 'WAVEFORM_PATH') {
+        setPath(event.data.path)
       }
-    )
-  })
+    }
+    worker.addEventListener('message', messageHandler)
+    return () => {
+      worker.removeEventListener('message', messageHandler)
+    }
+  }, [worker])
 
   return (
     <svg
diff --git a/src/hooks/use-keybindings.ts b/src/hooks/use-keybindings.ts
index d28ca4a..f4808ad 100644
--- a/src/hooks/use-keybindings.ts
+++ b/src/hooks/use-keybindings.ts
@@ -1,5 +1,5 @@
-import { useEffect } from "react"
-import { logger } from "../util/logger"
+import { useEffect } from 'react'
+import { logger } from '../util/logger'
 
 type KeyboardEventHandler = (event: KeyboardEvent) => void
 type IgnorableTagName = 'INPUT' | 'SELECT' | 'BUTTON'
@@ -31,4 +31,4 @@ export function useKeybindings(bindings: CallbackMap) {
       window.removeEventListener('keydown', keydownCallback)
     }
   }, [bindings])
-}
\ No newline at end of file
+}
diff --git a/src/util/get-latency-samples.ts b/src/util/get-latency-samples.ts
index e40a9cf..05f83e2 100644
--- a/src/util/get-latency-samples.ts
+++ b/src/util/get-latency-samples.ts
@@ -1,11 +1,9 @@
 import { logger } from './logger'
 
 /**
- *
- * @param sampleRate
- * @param stream
- * @param audioContext
- * @returns
+ * Media streams typically have some amount of latency.
+ * Latency is reported in seconds, but converting it to
+ * number of samples is more useful to offset the audio buffer.
  */
 export function getLatencySamples(
   sampleRate: number,