diff --git a/library/components/legends/LegendMobile.vue b/library/components/legends/LegendMobile.vue
index b274bae81..6c02fda59 100644
--- a/library/components/legends/LegendMobile.vue
+++ b/library/components/legends/LegendMobile.vue
@@ -539,6 +539,16 @@ const justDragged = () => Date.now() - lastDragEndAt < 400
 
 // Computed properties from stores
 const legendState = computed(() => uiStore.legendState)
+/**
+ * ★ WHAT THE CARET ANNOUNCES. Every toggle in this file carried aria-label="aria.toggleLegend" and
+ * NO aria-expanded, so a screen-reader user was told the control is a toggle and never told its
+ * STATE — they could not hear whether the legend was open or closed. SemanticTreeLegend has had
+ * this right all along; this is the copy that drifted, and it drifted on whether the control is
+ * usable without sight rather than on decoration. gospel found it while measuring four
+ * implementations of the same control; I verified it here before changing anything: 0 occurrences
+ * of aria-expanded against 4 toggle labels.
+ */
+const legendExpanded = computed(() => legendState.value !== 'collapsed')
 const legendHeight = computed(() => uiStore.legendHeight)
 const caretRotation = computed(() => uiStore.caretRotation)
 const showPullTab = computed(() => uiStore.showPullTab)
@@ -796,6 +806,7 @@ onBeforeUnmount(() => {
         v-if="legendMode === 'detail' && legendState !== 'collapsed'"
         class="detail-collapse-btn-mobile"
         @click.stop="handleCaretClick"
+        :aria-expanded="String(legendExpanded)"
         :aria-label="t('aria.toggleLegend')"
       ></button>
 
@@ -825,7 +836,8 @@ onBeforeUnmount(() => {
       >
         <button class="mobile-collapse-caret"
           :style="{ transform: `rotate(${caretRotation}deg)` }"
-          :aria-label="t('aria.toggleLegend')"
+          :aria-expanded="String(legendExpanded)"
+        :aria-label="t('aria.toggleLegend')"
           tabindex="-1"
         >
           <svg width="9" height="9" viewBox="0 0 12 12" fill="none">
@@ -875,7 +887,8 @@ onBeforeUnmount(() => {
             <button class="mobile-collapse-caret"
               :style="{ transform: `rotate(${caretRotation}deg)` }"
               @click.stop="handleCaretClick"
-              :aria-label="t('aria.toggleLegend')">
+              :aria-expanded="String(legendExpanded)"
+        :aria-label="t('aria.toggleLegend')">
               <svg width="9" height="9" viewBox="0 0 12 12" fill="none">
                 <path d="M4.5 3L7.5 6L4.5 9" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"/>
               </svg>
@@ -906,7 +919,8 @@ onBeforeUnmount(() => {
             <button class="mobile-collapse-caret"
               :style="{ transform: `rotate(${caretRotation}deg)` }"
               @click.stop="handleCaretClick"
-              :aria-label="t('aria.toggleLegend')">
+              :aria-expanded="String(legendExpanded)"
+        :aria-label="t('aria.toggleLegend')">
               <svg width="9" height="9" viewBox="0 0 12 12" fill="none">
                 <path d="M4.5 3L7.5 6L4.5 9" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"/>
               </svg>