Galaxy: show developer mode guidance

Co-authored-by: AngusBell97 <124716116+AngusBell97@users.noreply.github.com>

starpilot/system/the_galaxy/assets/components/tools/device_settings.css

@@ -4,6 +4,43 @@
   padding: var(--padding-base) var(--padding-lg) var(--padding-xxl);
 }
 
+.ds-dev-mode-notice {
+  align-items: center;
+  background: var(--input-bg);
+  border: var(--border-style-main);
+  border-radius: var(--border-radius-lg);
+  color: var(--text-color);
+  display: flex;
+  gap: var(--padding-sm);
+  margin-bottom: var(--margin-lg);
+  padding: var(--padding-sm) var(--padding-base);
+}
+
+.ds-dev-mode-notice > i {
+  color: var(--main-fg);
+  flex: 0 0 auto;
+}
+
+.ds-dev-mode-notice > span {
+  flex: 1;
+}
+
+.ds-dev-mode-notice-btn {
+  background: var(--main-fg);
+  border: 0;
+  border-radius: var(--border-radius-base);
+  color: var(--color-black);
+  cursor: pointer;
+  font-family: var(--font-body);
+  font-size: var(--font-size-sm);
+  padding: 0.55rem 0.8rem;
+  white-space: nowrap;
+}
+
+.ds-dev-mode-notice-btn:hover {
+  filter: brightness(1.08);
+}
+
 /* ――― Section Tabs ――― */
 .ds-tabs {
   display: flex;

starpilot/system/the_galaxy/assets/components/tools/device_settings.js

@@ -6,7 +6,12 @@ import {
   shouldSubmitPersonalityPreset,
   valueFromPointer,
 } from "/assets/components/tools/personality_profiles.mjs"
-import { formatNumericParamValue, resolveVehicleUnitParam, vehicleSpeedUnit } from "/assets/mobile/js/params.js"
+import {
+  countAdvancedHiddenByDeveloperMode,
+  formatNumericParamValue,
+  resolveVehicleUnitParam,
+  vehicleSpeedUnit,
+} from "/assets/mobile/js/params.js"
 
 import { LONGITUDINAL_MODE_KEY, longitudinalModeLayout, validLongitudinalSnapshot } from "/assets/components/tools/longitudinal_mode.mjs"
 
@@ -2821,6 +2826,8 @@ export function DeviceSettings({ params }) {
         return html`<div class="ds-empty">No settings available.</div>`
       }
 
+      const hiddenAdvancedCount = countAdvancedHiddenByDeveloperMode(state.layout, state.values)
+
       // Sync DOM inputs after ArrowJS renders (safe: syncScheduled is non-reactive)
       scheduleSyncInputs()
 
@@ -2861,6 +2868,18 @@ export function DeviceSettings({ params }) {
       const visibleParams = activeSection.params.filter(p => matchesFilter(p))
 
       return html`
+          ${hiddenAdvancedCount > 0 ? html`
+            <div class="ds-dev-mode-notice" role="status">
+              <i class="bi bi-shield-lock" aria-hidden="true"></i>
+              <span>${hiddenAdvancedCount} advanced setting${hiddenAdvancedCount === 1 ? "" : "s"} hidden. Enable Developer Mode to view them.</span>
+              <button type="button" class="ds-dev-mode-notice-btn"
+                @click="${() => {
+                  if (typeof window.__theGalaxyNavigate === "function") window.__theGalaxyNavigate("/device_settings/developer")
+                }}">
+                Enable Developer Mode
+              </button>
+            </div>
+          ` : ""}
           <div class="ds-tabs" id="ds-tabs">
             ${sections.map(section => html`
               <button

starpilot/system/the_galaxy/tests/test_device_settings_frontend.py

@@ -14,7 +14,6 @@ def test_device_settings_surfaces_hidden_advanced_settings_count():
   source = _device_settings()
 
   assert "countAdvancedHiddenByDeveloperMode" in source
-  assert "isAdvancedHiddenByDeveloperMode" in source
   assert "hiddenAdvancedCount" in source
 
 
@@ -35,7 +34,8 @@ def test_developer_mode_notice_navigates_to_developer_section():
 def test_advanced_settings_hidden_count_shown_in_status_bar():
   source = _device_settings()
 
-  assert "advanced hidden" in source
+  assert "advanced setting" in source
+  assert "hidden" in source
 
 
 def test_device_settings_uses_the_params_api_and_layout_json():