diff --git a/src/features/enhancedAnnouncementsDot/presentation/scripts/styles.script.ts b/src/features/enhancedAnnouncementsDot/presentation/scripts/styles.script.ts
new file mode 100644
index 0000000..5844311
--- /dev/null
+++ b/src/features/enhancedAnnouncementsDot/presentation/scripts/styles.script.ts
@@ -0,0 +1,10 @@
+import StylesheetScript from '../../../../common/architecture/scripts/stylesheet/StylesheetScript';
+
+export default class EnhancedAnnouncementsDotStylesScript extends StylesheetScript {
+  stylesheet = 'css/enhanced_announcements_dot.css';
+  page: never;
+
+  async shouldBeInjected(): Promise<boolean> {
+    return await this.optionsProvider.isEnabled('enhancedannouncementsdot');
+  }
+}
diff --git a/src/features/enhancedAnnouncementsDot/ui/styles.css b/src/features/enhancedAnnouncementsDot/ui/styles.css
new file mode 100644
index 0000000..3e394ef
--- /dev/null
+++ b/src/features/enhancedAnnouncementsDot/ui/styles.css
@@ -0,0 +1,41 @@
+@keyframes TWPTAnnouncementDot {
+  from {
+    background-color: #d93025;
+    bottom: 8px;
+  }
+
+  to {
+    background-color: #e2b3b0;
+    bottom: 0px;
+  }
+}
+
+@keyframes TWPTAnnouncementDot-v2 {
+  from {
+    background-color: #d93025;
+    top: 4px;
+  }
+
+  to {
+    background-color: #e2b3b0;
+    top: 12px;
+  }
+}
+
+header .left-control .material-drawer-button.has-updates::after,
+    header .right-control material-button.has-updates::after {
+  height: 10px;
+  width: 10px;
+}
+
+header .left-control .material-drawer-button.has-updates::after {
+  animation: .5s infinite alternate ease-in TWPTAnnouncementDot;
+}
+
+header .right-control .help-button.has-updates::after {
+  animation: .5s infinite alternate ease-in TWPTAnnouncementDot-v2;
+}
+
+header .sash {
+  display: none;
+}