diff --git a/src/static_src/scss/_note.scss b/src/static_src/scss/_note.scss
index 4b004f2..a23deee 100644
--- a/src/static_src/scss/_note.scss
+++ b/src/static_src/scss/_note.scss
@@ -5,8 +5,10 @@
     align-items: center;
     gap: 0.75rem;
     padding: 0.75rem 1rem;
-    background: rgba(var(--priUser), 0.12);
-    border-left: 3px solid rgba(var(--priUser), 0.6);
+    background-color: rgba(var(--tooltip-bg), 0.82);
+    backdrop-filter: blur(8px);
+    border: 0.1rem solid rgba(var(--secUser), 0.4);
+    border-radius: 0.5rem;
     margin-bottom: 0.75rem;
 
     .note-banner__body {
@@ -37,8 +39,6 @@
     .note-banner__nvm,
     .note-banner__fyi {
         flex-shrink: 0;
-        font-size: 0.8rem;
-        padding: 0.25rem 0.6rem;
     }
 }
 
diff --git a/src/static_src/tests/SpecRunner.html b/src/static_src/tests/SpecRunner.html
index 6e68d9f..e8bfc7d 100644
--- a/src/static_src/tests/SpecRunner.html
+++ b/src/static_src/tests/SpecRunner.html
@@ -23,10 +23,10 @@
     <script src="TraySpec.js"></script>
     <script src="SigSelectSpec.js"></script>
     <script src="NatusWheelSpec.js"></script>
-    <script src="RecognitionSpec.js"></script>
+    <script src="NoteSpec.js"></script>
     <!-- src files -->
     <script src="/static/apps/dashboard/dashboard.js"></script>
-    <script src="/static/apps/dashboard/recognition.js"></script>
+    <script src="/static/apps/dashboard/note.js"></script>
     <script src="/static/apps/epic/role-select.js"></script>
     <script src="/static/apps/epic/tray.js"></script>
     <script src="/static/apps/epic/sig-select.js"></script>
diff --git a/src/templates/apps/dashboard/_partials/_applet-my-sky.html b/src/templates/apps/dashboard/_partials/_applet-my-sky.html
index 3ea55da..646a7f1 100644
--- a/src/templates/apps/dashboard/_partials/_applet-my-sky.html
+++ b/src/templates/apps/dashboard/_partials/_applet-my-sky.html
@@ -332,7 +332,7 @@
         formWrap.style.display = 'none';
         svgEl.style.display    = '';
         NatusWheel.preload().then(() => NatusWheel.draw(svgEl, _lastChartData));
-        Recognition.handleSaveResponse(data);
+        Note.handleSaveResponse(data);
       })
       .catch(err => {
         setStatus(`Save failed: ${err.message}`, 'error');
diff --git a/src/templates/apps/dashboard/sky.html b/src/templates/apps/dashboard/sky.html
index f635799..ffcb5c4 100644
--- a/src/templates/apps/dashboard/sky.html
+++ b/src/templates/apps/dashboard/sky.html
@@ -300,7 +300,7 @@
         if (!r.ok) throw new Error(`HTTP ${r.status}`);
         return r.json();
       })
-      .then(data => { setStatus('Sky saved!'); Recognition.handleSaveResponse(data); })
+      .then(data => { setStatus('Sky saved!'); Note.handleSaveResponse(data); })
       .catch(err => {
         setStatus(`Save failed: ${err.message}`, 'error');
         confirmBtn.disabled = false;