diff --git a/src/browser/base/content/zen-assets.jar.inc.mn b/src/browser/base/content/zen-assets.jar.inc.mn
index e13214714..3e5d5e1b0 100644
--- a/src/browser/base/content/zen-assets.jar.inc.mn
+++ b/src/browser/base/content/zen-assets.jar.inc.mn
@@ -66,6 +66,7 @@
         content/browser/zen-images/layouts/multiple-toolbar.png (content/zen-images/layouts/multiple-toolbar.png)
         content/browser/zen-images/layouts/single-toolbar.png   (content/zen-images/layouts/single-toolbar.png)
         content/browser/zen-images/grain-bg.png                 (content/zen-images/grain-bg.png)
+        content/browser/zen-images/note-indicator.svg           (content/zen-images/note-indicator.svg)
 
         # Actors
         content/browser/zen-components/actors/ZenThemeMarketplaceParent.sys.mjs (zen-components/actors/ZenThemeMarketplaceParent.sys.mjs)
diff --git a/src/browser/base/content/zen-images/note-indicator.svg b/src/browser/base/content/zen-images/note-indicator.svg
new file mode 100644
index 000000000..3e0a64c1f
--- /dev/null
+++ b/src/browser/base/content/zen-images/note-indicator.svg
@@ -0,0 +1,100 @@
+<svg viewBox="0 0 36 36" xmlns="http://www.w3.org/2000/svg">
+  <rect width="100%" height="100%" fill="none"/>
+  
+    <style type="text/css"><![CDATA[
+    .note {
+      fill: white;
+      transform-box: fill-box;
+      transform-origin: center;
+    }
+    
+    @keyframes flyUpLeft {
+      from {
+        opacity: 1;
+        transform: translate(0px, 0px) scale(0.5) rotate(0deg);
+      }
+      to {
+        opacity: 0;
+        transform: translate(-9px, -35px) scale(5) rotate(0deg);
+      }
+    }
+    @keyframes flyUpRight {
+      from {
+        opacity: 1;
+        transform: translate(0px, 0px) scale(0.5) rotate(0deg);
+      }
+      to {
+        opacity: 0;
+        transform: translate(9px, -35px) scale(5) rotate(0deg);
+      }
+    }
+    @keyframes flyUpCenter {
+      from {
+        opacity: 1;
+        transform: translate(0px, 0px) scale(0.5) rotate(0deg);
+      }
+      to {
+        opacity: 0;
+        transform: translate(0px, -35px) scale(5) rotate(0deg);
+      }
+    }
+    }*/
+  ]]></style>
+
+  
+  <g class="note-group">
+    <g class="note" style="animation: flyUpLeft 3s ease-in-out infinite; animation-delay: 0s;">
+      <path transform="translate(15,40) scale(0.0078)" d="M448.231,166.755C352.139,64.989,240.998,2.38,240.998,2.38
+        c-3.297-2.625-7.813-3.125-11.609-1.281c-3.813,1.844-6.219,5.688-6.219,9.906v329
+        c-20.078-8.281-44.688-11.656-71.344-8.344C84.717,340.005,30.514,386.849,30.67,436.255
+        c0.188,49.453,54.703,82.813,121.75,74.469c67.078-8.328,121.297-55.188,121.125-104.641V164.817
+        c15.828,3.313,34.391,10.531,54.391,25.219c67.703,49.625,100.905,81.484,58.218,166.859
+        C475.403,321.974,514.2,236.599,448.231,166.755z"/>
+    </g>
+    
+    <g class="note" style="animation: flyUpRight 3s ease-in-out infinite; animation-delay: 0.5s;">
+      <path transform="translate(15,40) scale(0.0078)" d="M133.703,45.86v86.43v240.66c-16.8-6.173-36.654-8.012-57.11-4.054
+        c-49.141,9.454-82.977,48.227-75.577,86.559c7.389,38.353,53.195,61.757,102.326,52.292
+        c43.602-8.4,75.093-39.892,76.449-73.727h0.28V129.246L465.644,93.83v237.595
+        c-16.811-6.162-36.644-7.98-57.1-4.033c-49.152,9.443-82.966,48.217-75.6,86.559
+        c7.389,38.342,53.185,61.746,102.327,52.271c43.612-8.389,75.115-39.892,76.449-73.706
+        H512V90.785V2.152L133.703,45.86z"/>
+    </g>
+    
+    <g class="note" style="animation: flyUpCenter 3s ease-in-out infinite; animation-delay: 1s;">
+      <path transform="translate(15,40) scale(0.0078)" d="M448.231,166.755C352.139,64.989,240.998,2.38,240.998,2.38
+        c-3.297-2.625-7.813-3.125-11.609-1.281c-3.813,1.844-6.219,5.688-6.219,9.906v329
+        c-20.078-8.281-44.688-11.656-71.344-8.344C84.717,340.005,30.514,386.849,30.67,436.255
+        c0.188,49.453,54.703,82.813,121.75,74.469c67.078-8.328,121.297-55.188,121.125-104.641V164.817
+        c15.828,3.313,34.391,10.531,54.391,25.219c67.703,49.625,100.905,81.484,58.218,166.859
+        C475.403,321.974,514.2,236.599,448.231,166.755z"/>
+    </g>
+
+    <g class="note" style="animation: flyUpLeft 3s ease-in-out infinite; animation-delay: 1.5s;">
+      <path transform="translate(15,40) scale(0.0078)" d="M133.703,45.86v86.43v240.66c-16.8-6.173-36.654-8.012-57.11-4.054
+        c-49.141,9.454-82.977,48.227-75.577,86.559c7.389,38.353,53.195,61.757,102.326,52.292
+        c43.602-8.4,75.093-39.892,76.449-73.727h0.28V129.246L465.644,93.83v237.595
+        c-16.811-6.162-36.644-7.98-57.1-4.033c-49.152,9.443-82.966,48.217-75.6,86.559
+        c7.389,38.342,53.185,61.746,102.327,52.271c43.612-8.389,75.115-39.892,76.449-73.706
+        H512V90.785V2.152L133.703,45.86z"/>
+    </g>
+    
+    <g class="note" style="animation: flyUpRight 3s ease-in-out infinite; animation-delay: 2s;">
+      <path transform="translate(15,40) scale(0.0078)" d="M448.231,166.755C352.139,64.989,240.998,2.38,240.998,2.38
+        c-3.297-2.625-7.813-3.125-11.609-1.281c-3.813,1.844-6.219,5.688-6.219,9.906v329
+        c-20.078-8.281-44.688-11.656-71.344-8.344C84.717,340.005,30.514,386.849,30.67,436.255
+        c0.188,49.453,54.703,82.813,121.75,74.469c67.078-8.328,121.297-55.188,121.125-104.641V164.817
+        c15.828,3.313,34.391,10.531,54.391,25.219c67.703,49.625,100.905,81.484,58.218,166.859
+        C475.403,321.974,514.2,236.599,448.231,166.755z"/>
+    </g>
+    
+    <g class="note" style="animation: flyUpCenter 3s ease-in-out infinite; animation-delay: 2.5s;">
+      <path transform="translate(15,40) scale(0.0078)" d="M133.703,45.86v86.43v240.66c-16.8-6.173-36.654-8.012-57.11-4.054
+        c-49.141,9.454-82.977,48.227-75.577,86.559c7.389,38.353,53.195,61.757,102.326,52.292
+        c43.602-8.4,75.093-39.892,76.449-73.727h0.28V129.246L465.644,93.83v237.595
+        c-16.811-6.162-36.644-7.98-57.1-4.033c-49.152,9.443-82.966,48.217-75.6,86.559
+        c7.389,38.342,53.185,61.746,102.327,52.271c43.612-8.389,75.115-39.892,76.449-73.706
+        H512V90.785V2.152L133.703,45.86z"/>
+    </g>
+  </g>
+</svg>
diff --git a/src/browser/base/content/zen-styles/zen-media-controls.css b/src/browser/base/content/zen-styles/zen-media-controls.css
index cd256a8cd..91b0ebbac 100644
--- a/src/browser/base/content/zen-styles/zen-media-controls.css
+++ b/src/browser/base/content/zen-styles/zen-media-controls.css
@@ -71,6 +71,20 @@
     }
   }
 
+  &:not(:hover) {
+    #zen-media-focus-button::after {
+      content: '';
+      position: absolute;
+      width: 100%;
+      height: 100%;
+      background-repeat: no-repeat;
+      opacity: 1;
+      background: url('note-indicator.svg') no-repeat;
+      top: -20px;
+      left: 8px;
+    }
+  }
+
   #zen-media-focus-button {
     align-self: center;
     transition: