feat(web): centralise Vietnamese price formatting across all pages

Create a single `currency.ts` utility with `formatPrice`, `formatVND`,
`formatPricePerM2`, and `parseVND` to replace 9+ duplicated inline
formatters. This fixes inconsistent decimal handling (1.5M was truncated
to "1 triệu") and standardises price/m² display. Integrated across
property cards, listing detail, dashboard, analytics, payments, pricing,
and admin moderation pages with 19 new unit tests.

Co-Authored-By: Paperclip <noreply@paperclip.ing>

apps/web/app/[locale]/(dashboard)/dashboard/page.tsx

@@ -6,6 +6,7 @@ import Link from 'next/link';
 import { ListingStatusBadge } from '@/components/listings/listing-status-badge';
 import { Button } from '@/components/ui/button';
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
+import { formatPrice, formatPricePerM2 } from '@/lib/currency';
 import { useMarketReport, useHeatmap } from '@/lib/hooks/use-analytics';
 import { useListingsSearch } from '@/lib/hooks/use-listings';
 
@@ -17,18 +18,6 @@ const DistrictBarChart = dynamic(
 const CITY = 'Ho Chi Minh';
 const PERIOD = '2026-Q1';
 
-function formatPrice(priceStr: string): string {
-  const num = Number(priceStr);
-  if (num >= 1_000_000_000) return `${(num / 1_000_000_000).toFixed(1)} tỷ`;
-  if (num >= 1_000_000) return `${(num / 1_000_000).toFixed(0)} triệu`;
-  return num.toLocaleString('vi-VN');
-}
-
-function formatPriceM2(price: number): string {
-  if (price >= 1_000_000) return `${(price / 1_000_000).toFixed(1)} tr/m²`;
-  return `${price.toLocaleString('vi-VN')} đ/m²`;
-}
-
 interface StatCardProps {
   title: string;
   value: string;
@@ -105,9 +94,9 @@ export default function DashboardPage() {
 
   return (
     <div className="space-y-8">
-      <div className="flex items-center justify-between">
+      <div className="flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between">
         <div>
-          <h1 className="text-3xl font-bold">Bảng điều khiển</h1>
+          <h1 className="text-2xl font-bold sm:text-3xl">Bảng điều khiển</h1>
           <p className="mt-2 text-muted-foreground">
             Tổng quan thị trường và tin đăng của bạn
           </p>
@@ -136,7 +125,7 @@ export default function DashboardPage() {
         />
         <StatCard
           title="Giá TB thị trường"
-          value={loading ? '...' : formatPriceM2(avgPriceM2)}
+          value={loading ? '...' : formatPricePerM2(avgPriceM2)}
           trend={avgYoy}
           description="YoY"
         />
@@ -186,7 +175,7 @@ export default function DashboardPage() {
             <div className="flex items-center justify-between">
               <span className="text-sm text-muted-foreground">Giá TB/m²</span>
               <span className="font-semibold">
-                {loading ? '...' : formatPriceM2(avgPriceM2)}
+                {loading ? '...' : formatPricePerM2(avgPriceM2)}
               </span>
             </div>
             <div className="flex items-center justify-between">
@@ -214,7 +203,7 @@ export default function DashboardPage() {
 
       {/* Recent listings */}
       <Card>
-        <CardHeader className="flex flex-row items-center justify-between">
+        <CardHeader className="flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between">
           <div>
             <CardTitle className="text-lg">Tin đăng gần đây</CardTitle>
             <CardDescription>Danh sách tin đăng mới nhất của bạn</CardDescription>

apps/web/app/[locale]/(dashboard)/dashboard/payments/page.tsx

@@ -13,15 +13,9 @@ import {
   TableHeader,
   TableRow,
 } from '@/components/ui/table';
+import { formatVND } from '@/lib/currency';
 import { useTransactions } from '@/lib/hooks/use-payments';
 
-function formatVND(amount: string | number): string {
-  const num = typeof amount === 'string' ? Number(amount) : amount;
-  if (num >= 1_000_000_000) return `${(num / 1_000_000_000).toFixed(1)} tỷ đ`;
-  if (num >= 1_000_000) return `${(num / 1_000_000).toFixed(0)} triệu đ`;
-  return num.toLocaleString('vi-VN') + ' đ';
-}
-
 const STATUS_LABELS: Record<string, { label: string; variant: 'default' | 'secondary' | 'destructive' | 'outline' }> = {
   PENDING: { label: 'Chờ xử lý', variant: 'secondary' },
   PROCESSING: { label: 'Đang xử lý', variant: 'secondary' },
@@ -66,14 +60,14 @@ export default function PaymentsPage() {
   return (
     <div className="space-y-6">
       <div>
-        <h1 className="text-3xl font-bold">Thanh toán</h1>
+        <h1 className="text-2xl font-bold sm:text-3xl">Thanh toán</h1>
         <p className="mt-2 text-muted-foreground">
           Lịch sử giao dịch và quản lý thanh toán
         </p>
       </div>
 
       {/* Summary cards */}
-      <div className="grid gap-4 sm:grid-cols-3">
+      <div className="grid grid-cols-2 gap-4 sm:grid-cols-3">
         <Card>
           <CardHeader className="pb-2">
             <CardDescription>Tổng giao dịch</CardDescription>
@@ -104,12 +98,12 @@ export default function PaymentsPage() {
 
       {/* Transactions table */}
       <Card>
-        <CardHeader className="flex flex-row items-center justify-between">
+        <CardHeader className="flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between">
           <div>
             <CardTitle className="text-lg">Lịch sử giao dịch</CardTitle>
             <CardDescription>Tất cả giao dịch thanh toán của bạn</CardDescription>
           </div>
-          <div className="w-40">
+          <div className="w-full sm:w-40">
             <Select
               value={statusFilter}
               onChange={(e) => {