feat(user-apps): appearance settings (dark mode + reduced motion), product morph, filter sheet

Applies to both user-app and user-app-v2. Logic and structure are shared;
each app keeps its own look.

Appearance settings
- New "تنظیمات ظاهری" page (/settings/appearance), opened from the
  dashboard and available without login. It offers a light/dark/system
  theme and a "fast & light" motion switch.
- appearanceStore saves the choice to localStorage. A small inline boot
  script in index.html applies it before first paint so there is no
  white flash. The "system" option follows OS changes live.
- New ToggleSwitch component.

Dark mode
- Theme LESS tokens now compile to CSS custom properties. Light/dark
  values come from a generated virtual:palette.css (themeConfig/
  appearance.ts, with colors.json + new colors.dark.json).
- New LESS alpha() plugin replaces fade() on theme tokens.
- New semantic tokens: page, onInk, heroSurface, hairlineStrong,
  photoMat, photoStage.
- The dark palette is layered (page < card < panel < border) so
  surfaces separate without shadows.
- Hard-coded colors were replaced by tokens according to their role.
- antd inputs/text get dark overrides; vant uses its own
  .van-theme-dark.
- Light mode looks the same as before.

Reduced motion
- With html.motion-reduced, transitions are capped at 120ms, keyframe
  loops stop, and backdrop blurs and permanent will-change are dropped.
- Spinners and the toast progress bar (which closes the toast) are
  exempt via .keep-motion.
- Carousel autoplay, the v1 Lottie and the product morph honor the
  setting.

Product detail
- Opening a product is now a container-transform morph from the tapped
  card (ProductMorph). It replaces the bottom Drawer and uses composited
  transform/opacity only.
- The detail view is seeded with the card's data, so it no longer
  opens blank and jumps.

Filters and sheets
- Filters are now a full-width bottom sheet. Selections stay a draft
  until applied, so the result list no longer re-renders while
  dragging the slider.
- DropDown collapse animates grid-template-rows instead of a capped
  max-height.
- v2 IslandSheet is restyled to the v2 design language (API unchanged).

Fixes
- filtersStore.reset() shallow-copied shared arrays, so clearing the
  filters never cleared the selected brands.

apps/user-app/src/views/user/DashboardView.vue

@@ -130,8 +130,8 @@
       </template>
       <template v-slot:title>آیا می خواهید از برنامه خارج شوید؟</template>
       <template v-slot:button>
-        <div class="text-center text-[#23493c]" @click="logOut">بله</div>
-        <div class="text-center text-[#6b7280]" @click="data.notify = false">بی خیال</div>
+        <div class="text-center text-[color:var(--c-primary)]" @click="logOut">بله</div>
+        <div class="text-center text-[color:var(--c-inkMuted)]" @click="data.notify = false">بی خیال</div>
       </template>
     </DialogVant>
 
@@ -146,7 +146,7 @@
         </div>
       </template>
       <template v-slot:button>
-        <div class="text-center text-[#23493c]" @click="router.push({ name: 'login' })">ورود/ثبت نام</div>
+        <div class="text-center text-[color:var(--c-primary)]" @click="router.push({ name: 'login' })">ورود/ثبت نام</div>
         <div class="text-center text-danger" @click="data.loginNotify = false">بیخیال</div>
       </template>
     </DialogVant>
@@ -208,11 +208,22 @@ const EXPERT_TILES = [
   { id: 5, icon: 'vuesax-linear:profile-2user', title: 'مشتریان من', disabled: false },
 ]
 
-const list = computed(() =>
-  session.isSalesExpert ? [...BASE_TILES, ...EXPERT_TILES] : BASE_TILES,
-)
+// Appearance (theme + reduced motion) — always last, and open to everyone:
+// device preferences, not account data. See goToDetails.
+const APPEARANCE_TILE = { id: 7, icon: 'vuesax-linear:brush', title: 'ظاهر', disabled: false }
+
+const list = computed(() => [
+  ...BASE_TILES,
+  ...(session.isSalesExpert ? EXPERT_TILES : []),
+  APPEARANCE_TILE,
+])
 
 function goToDetails(id: number) {
+  // The only tile that needs no login.
+  if (id === 7) {
+    router.push({ name: 'appearanceSettings' })
+    return
+  }
   if (!session.isLoggedIn) {
     data.loginNotify = true
     return
@@ -260,7 +271,7 @@ onMounted(async () => {
 
 <style scoped lang="less">
 .dash {
-  background: @canvas;
+  background: @page;
   min-height: 100vh;
 }
 
@@ -270,7 +281,7 @@ onMounted(async () => {
   left: 0;
   right: 0;
   z-index: 20;
-  background: rgba(255, 255, 255, 0.88);
+  background: alpha(@canvas, 88%);
   backdrop-filter: blur(14px);
   border-bottom: 1px solid @hairline;
 }
@@ -368,7 +379,7 @@ onMounted(async () => {
 }
 
 .dash__seal.is-creditor {
-  color: @ink;
+  color: #14161A;
   background: rgba(255, 255, 255, 0.9);
 }