feat(ui): adopt Tailwind v4 design system and archive change

- Add tailwindcss v4 + @tailwindcss/vite to mall, shop-admin, admin
- Add @vmall/shared/theme.css tokens with html[data-accent] presets
- Add @vmall/ui kit (VBtn/VBadge/VField/VInput/VCard/VPanel/VTable/VPage,
  VAccentSwatch, useAccent) as a Nuxt module
- Convert all three apps to kit + utilities; delete ui.css/mall.css and
  every <style scoped>; consoles get accent presets, mall locked to red
- Fix VCard boolean prop default (padding) and PDP/store stale
  useAsyncData keys on param navigation
- Archive adopt-tailwind-design-system; new frontend-ui capability spec

apps/mall/components/ui/QtyStepper.vue

@@ -9,49 +9,26 @@ function set(v: number): void {
 </script>
 
 <template>
-  <div class="stepper">
-    <button type="button" :disabled="modelValue <= 1" @click="set(modelValue - 1)">−</button>
+  <div class="inline-flex overflow-hidden rounded-md border border-border">
+    <button
+      type="button"
+      class="h-8 w-[30px] border-0 bg-bg text-sm transition-colors hover:text-primary disabled:cursor-not-allowed disabled:opacity-40"
+      :disabled="modelValue <= 1"
+      @click="set(modelValue - 1)"
+    >−</button>
     <input
       :value="modelValue"
       type="number"
       :min="1"
       :max="max"
+      class="h-8 w-12 [appearance:textfield] border-x border-border bg-surface text-center text-[13px] text-text outline-none focus:border-primary"
       @change="set(Number(($event.target as HTMLInputElement).value))"
     />
-    <button type="button" :disabled="modelValue >= max" @click="set(modelValue + 1)">+</button>
+    <button
+      type="button"
+      class="h-8 w-[30px] border-0 bg-bg text-sm transition-colors hover:text-primary disabled:cursor-not-allowed disabled:opacity-40"
+      :disabled="modelValue >= max"
+      @click="set(modelValue + 1)"
+    >+</button>
   </div>
 </template>
-
-<style scoped>
-.stepper {
-  display: inline-flex;
-  border: 1px solid var(--mall-line-dark);
-  border-radius: var(--mall-radius);
-  overflow: hidden;
-}
-button {
-  width: 30px;
-  height: 32px;
-  border: 0;
-  background: #fafafa;
-  cursor: pointer;
-  font-size: 14px;
-}
-button:disabled {
-  opacity: 0.4;
-  cursor: not-allowed;
-}
-input {
-  width: 48px;
-  height: 32px;
-  border: 0;
-  border-left: 1px solid var(--mall-line);
-  border-right: 1px solid var(--mall-line);
-  text-align: center;
-  font-size: 13px;
-  outline: none;
-}
-input::-webkit-inner-spin-button {
-  display: none;
-}
-</style>