Split desktop and mobile layouts with shared page data so APIs fetch once per context.

Add layout shells, desktop views, module-level page caches, and UI fixes for auth, home, wallet, transactions, address, and related pages.

Co-authored-by: Cursor <cursoragent@cursor.com>

src/views/base/home/desktop/components/DesktopLivePrice.vue

@@ -0,0 +1,46 @@
+<template>
+  <div class="dhome-surface dhome-hero-price">
+    <span class="dhome-label">قیمت لحظه‌ای</span>
+    <p class="dhome-hero-price__brand">{{ config.config?.name_fa }}</p>
+    <div class="dhome-hero-price__value-row">
+      <span
+        v-if="percentChange !== 0"
+        class="dhome-hero-price__delta"
+        :class="percentChange >= 0 ? 'dhome-hero-price__delta--up' : 'dhome-hero-price__delta--down'"
+      >
+        {{ useTowDecimal(percentChange) }}%
+      </span>
+      <Vue3Odometer
+        :value="displayGoldVal"
+        class="dhome-hero-price__odometer o-text"
+        style="font-family: var(--App-font-family)"
+      />
+      <span class="dhome-hero-price__unit">ریال</span>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { computed } from 'vue'
+import Vue3Odometer from 'vue3-odometer'
+import 'odometer/themes/odometer-theme-default.css'
+import { useConfigStore } from '@/store/configStore'
+import { getTradeBuyPrice, lastPrice, percentPriceChanged } from '@/utils/price'
+import { useTowDecimal } from '@/utils/usePrice'
+
+const config = useConfigStore()
+
+const isMarketClosed = computed(
+  () => lastPrice?.value?.goldir === 0 && getTradeBuyPrice(lastPrice.value) === 0,
+)
+
+const displayGoldVal = computed(() => {
+  if (isMarketClosed.value) return 0
+  return getTradeBuyPrice(lastPrice.value)
+})
+
+const percentChange = computed(() => {
+  if (!getTradeBuyPrice(lastPrice.value)) return 0
+  return percentPriceChanged()
+})
+</script>