fix: clarify scene 4 department filtering

Author: Oussama

website/src/lib/scenes/Scene4Explorer.svelte

@@ -29,6 +29,7 @@
   let countryName = $derived(
     countrySummary.find((d) => d.iso3 === $filters.selectedCountry)?.country_name ?? $filters.selectedCountry,
   );
+  let selectedDepartmentList = $derived([...$filters.selectedDepartments].sort());
 </script>
 
 <section class="scene-explorer" aria-labelledby="scene-4-title">
@@ -41,7 +42,7 @@
     <div class="filter-bar" aria-label="Explorer filters">
       <DecadeSlider {timeline} ariaLabel="Filter medium explorer by decade range" />
       <div class="filter-group">
-        <p>Departments</p>
+        <p>Curatorial departments</p>
         <div class="chip-row">
           {#each departments as department}
             <button
@@ -73,6 +74,14 @@
         <button type="button" class="reset" onclick={resetFilters}>Reset filters</button>
       </div>
     </div>
+    {#if selectedDepartmentList.length}
+      <p class="filter-note">
+        <strong>Department filter:</strong>
+        {selectedDepartmentList.join(', ')}. The cards below still show the actual medium classifications found inside
+        that department, so a Painting & Sculpture selection can contain a small number of photographs, drawings, or
+        prints.
+      </p>
+    {/if}
     <Legend mode="categorical" items={genderLegend} caption="Unknown gender is retained as its own bucket." />
     <MediumExplorer {data} />
   </div>
@@ -132,6 +141,22 @@
     text-transform: uppercase;
   }
 
+  .filter-note {
+    margin: calc(-1 * var(--space-1)) 0 var(--space-2);
+    padding: var(--space-1) var(--space-2);
+    color: var(--fg-on-light-mute);
+    background: color-mix(in srgb, var(--accent-primary) 8%, var(--bg-paper));
+    border-left: 3px solid var(--accent-primary);
+    font-family: var(--font-body);
+    font-size: var(--type-small-size);
+    line-height: var(--type-small-line);
+  }
+
+  .filter-note strong {
+    color: var(--fg-on-light-strong);
+    font-family: var(--font-ui);
+  }
+
   button {
     border: 1px solid var(--rule-on-light);
     padding: 0.375rem 0.5rem;