diff --git a/src/food-market.web/src/components/DataTable.tsx b/src/food-market.web/src/components/DataTable.tsx
index 96cfc78..e1d4b59 100644
--- a/src/food-market.web/src/components/DataTable.tsx
+++ b/src/food-market.web/src/components/DataTable.tsx
@@ -1,6 +1,7 @@
 import type { ReactNode } from 'react'
 import { ArrowUpDown, ArrowUp, ArrowDown } from 'lucide-react'
 import { cn } from '@/lib/utils'
+import { TableSkeleton } from '@/components/Skeleton'
 
 export type SortOrder = 'asc' | 'desc'
 
@@ -80,11 +81,10 @@ export function DataTable<T>({
       </thead>
       <tbody>
         {isLoading ? (
-          <tr>
-            <td colSpan={columns.length} className="px-4 py-8 text-center text-slate-400">
-              Загрузка…
-            </td>
-          </tr>
+          // Shimmer skeleton вместо «Загрузка…»: 8 строк с псевдо-случайной
+          // шириной плейсхолдеров, чтобы превью таблицы выглядело
+          // естественно, пока приходят данные с сервера.
+          <TableSkeleton rows={8} columns={columns.length} />
         ) : rows.length === 0 ? (
           <tr>
             <td colSpan={columns.length} className="px-4 py-8 text-center text-slate-400">
diff --git a/src/food-market.web/src/components/Skeleton.tsx b/src/food-market.web/src/components/Skeleton.tsx
new file mode 100644
index 0000000..4abb082
--- /dev/null
+++ b/src/food-market.web/src/components/Skeleton.tsx
@@ -0,0 +1,92 @@
+import { cn } from '@/lib/utils'
+import type { ReactNode } from 'react'
+
+/**
+ * Реюзабельный shimmer-плейсхолдер. Заменяет «Загрузка…» в data-таблицах,
+ * карточках и edit-страницах на анимированный серый блок — пользователь
+ * видит будущую структуру вместо пустого текста.
+ *
+ * Примеры:
+ *   <Skeleton className="h-4 w-32" />                — линия (текст)
+ *   <Skeleton className="h-9 w-full" />              — input
+ *   <Skeleton variant="circle" className="w-10 h-10" /> — аватар
+ *   <Skeleton variant="block" className="h-48 w-full" /> — карточка
+ *
+ * Под капотом: bg-slate-200 + анимация pulse. На dark — slate-700.
+ */
+interface SkeletonProps {
+  className?: string
+  variant?: 'line' | 'block' | 'circle'
+  children?: ReactNode
+}
+
+export function Skeleton({ className, variant = 'line', children }: SkeletonProps) {
+  return (
+    <div
+      aria-busy="true"
+      role="status"
+      className={cn(
+        'animate-pulse bg-slate-200/80 dark:bg-slate-700/60',
+        variant === 'circle' ? 'rounded-full' : variant === 'block' ? 'rounded-lg' : 'rounded',
+        className,
+      )}
+    >
+      {children}
+    </div>
+  )
+}
+
+/**
+ * Готовый шаблон для скелета таблицы: N строк × M колонок, ширина рандомная
+ * по seed чтобы выглядело естественно. Заменяет «Загрузка…» в DataTable.
+ */
+export function TableSkeleton({ rows = 8, columns = 5 }: { rows?: number; columns?: number }) {
+  // Псевдо-random ширины — стабильные между рендерами и реалистичные.
+  const widths = ['w-24', 'w-32', 'w-40', 'w-20', 'w-16', 'w-28']
+  return (
+    <>
+      {Array.from({ length: rows }).map((_, r) => (
+        <tr key={r}>
+          {Array.from({ length: columns }).map((__, c) => (
+            <td
+              key={c}
+              className="px-3 sm:px-4 py-2.5 border-b border-slate-100 dark:border-slate-800"
+            >
+              <Skeleton className={cn('h-4', widths[(r + c) % widths.length])} />
+            </td>
+          ))}
+        </tr>
+      ))}
+    </>
+  )
+}
+
+/**
+ * Скелет для edit-страниц: 1 заголовок + 2 «секции» с полями.
+ * Используется когда `existing.isLoading` пока тащит данные.
+ */
+export function FormSkeleton() {
+  return (
+    <div className="max-w-5xl mx-auto p-3 sm:p-6 space-y-4">
+      <div className="flex items-center gap-3">
+        <Skeleton className="h-7 w-48" />
+        <Skeleton className="h-4 w-32" />
+      </div>
+      {[0, 1].map((s) => (
+        <section
+          key={s}
+          className="bg-white dark:bg-slate-900 rounded-lg border border-slate-200 dark:border-slate-800 p-4"
+        >
+          <div className="grid grid-cols-1 md:grid-cols-3 gap-x-4 gap-y-4">
+            {Array.from({ length: 6 }).map((_, i) => (
+              <div key={i} className="space-y-1.5">
+                <Skeleton className="h-3 w-24" />
+                <Skeleton className="h-9 w-full" />
+              </div>
+            ))}
+          </div>
+        </section>
+      ))}
+    </div>
+  )
+}
diff --git a/src/food-market.web/src/pages/DashboardPage.tsx b/src/food-market.web/src/pages/DashboardPage.tsx
index 1a740c0..b07159d 100644
--- a/src/food-market.web/src/pages/DashboardPage.tsx
+++ b/src/food-market.web/src/pages/DashboardPage.tsx
@@ -2,6 +2,7 @@ import { useQuery } from '@tanstack/react-query'
 import { Package, Users, Warehouse, Store, TrendingUp, TrendingDown, Receipt, Banknote, Calendar } from 'lucide-react'
 import { PageHeader } from '@/components/PageHeader'
 import { SalesChart } from '@/components/SalesChart'
+import { Skeleton } from '@/components/Skeleton'
 import { api } from '@/lib/api'
 import type { PagedResult, SalesStatsResponse } from '@/lib/types'
 
@@ -138,7 +139,8 @@ export function DashboardPage() {
           </div>
         </div>
         {stats.isLoading ? (
-          <div className="h-72 flex items-center justify-center text-slate-400 text-sm">Загрузка…</div>
+          // Shimmer на месте графика: примерно той же высоты, чтобы layout не прыгал.
+          <Skeleton variant="block" className="h-72 w-full" />
         ) : !hasAnySales ? (
           <div className="h-72 flex flex-col items-center justify-center text-slate-400 text-sm gap-2">
             <Receipt className="w-8 h-8 text-slate-300" />
diff --git a/src/food-market.web/src/pages/DemandEditPage.tsx b/src/food-market.web/src/pages/DemandEditPage.tsx
index ed79117..5aac9ae 100644
--- a/src/food-market.web/src/pages/DemandEditPage.tsx
+++ b/src/food-market.web/src/pages/DemandEditPage.tsx
@@ -8,6 +8,7 @@ import { Field, TextArea, Select, AsyncSelect, MoneyInput, NumberInput, Checkbox
 import { DateField } from '@/components/DateField'
 import { ProductPicker } from '@/components/ProductPicker'
 import { ConfirmDialog } from '@/components/ConfirmDialog'
+import { FormSkeleton } from '@/components/Skeleton'
 import { useConfirm } from '@/lib/useConfirm'
 import { useStores, useCurrencies } from '@/lib/useLookups'
 import { useOrgSettings } from '@/lib/useOrgSettings'
@@ -209,6 +210,9 @@ export function DemandEditPage() {
     ? { minimumFractionDigits: 2, maximumFractionDigits: 2 }
     : { maximumFractionDigits: 0 }
 
+  // На редактировании пока тащим документ — показываем скелет.
+  if (!isNew && existing.isLoading) return <FormSkeleton />
+
   return (
     <form onSubmit={onSubmit} className="flex flex-col h-full">
       <div className="flex items-center justify-between gap-4 px-6 py-3 border-b border-slate-200 dark:border-slate-800 bg-white dark:bg-slate-900">
diff --git a/src/food-market.web/src/pages/EnterEditPage.tsx b/src/food-market.web/src/pages/EnterEditPage.tsx
index b912fd4..97c79ac 100644
--- a/src/food-market.web/src/pages/EnterEditPage.tsx
+++ b/src/food-market.web/src/pages/EnterEditPage.tsx
@@ -8,6 +8,7 @@ import { Field, TextArea, Select, MoneyInput, NumberInput, Checkbox } from '@/co
 import { DateField } from '@/components/DateField'
 import { ProductPicker } from '@/components/ProductPicker'
 import { ConfirmDialog } from '@/components/ConfirmDialog'
+import { FormSkeleton } from '@/components/Skeleton'
 import { useConfirm } from '@/lib/useConfirm'
 import { useStores, useCurrencies } from '@/lib/useLookups'
 import { useOrgSettings } from '@/lib/useOrgSettings'
@@ -189,6 +190,9 @@ export function EnterEditPage() {
     ? { minimumFractionDigits: 2, maximumFractionDigits: 2 }
     : { maximumFractionDigits: 0 }
 
+  // На редактировании пока тащим документ — показываем скелет.
+  if (!isNew && existing.isLoading) return <FormSkeleton />
+
   return (
     <form onSubmit={onSubmit} className="flex flex-col h-full">
       <div className="flex items-center justify-between gap-4 px-6 py-3 border-b border-slate-200 dark:border-slate-800 bg-white dark:bg-slate-900">
diff --git a/src/food-market.web/src/pages/InventoryEditPage.tsx b/src/food-market.web/src/pages/InventoryEditPage.tsx
index 1aa9e84..a92cfd3 100644
--- a/src/food-market.web/src/pages/InventoryEditPage.tsx
+++ b/src/food-market.web/src/pages/InventoryEditPage.tsx
@@ -7,6 +7,7 @@ import { Button } from '@/components/Button'
 import { Field, TextArea, Select, NumberInput, Checkbox } from '@/components/Field'
 import { DateField } from '@/components/DateField'
 import { ConfirmDialog } from '@/components/ConfirmDialog'
+import { FormSkeleton } from '@/components/Skeleton'
 import { useConfirm } from '@/lib/useConfirm'
 import { useStores } from '@/lib/useLookups'
 import { InventoryStatus, type InventoryDto } from '@/lib/types'
@@ -205,6 +206,9 @@ export function InventoryEditPage() {
 
   const canPost = isDraft && form.lines.some((l) => l.diff !== 0) && !isNew
 
+  // На редактировании пока тащим документ — показываем скелет.
+  if (!isNew && existing.isLoading) return <FormSkeleton />
+
   return (
     <form onSubmit={onSubmit} className="flex flex-col h-full">
       <div className="flex items-center justify-between gap-4 px-6 py-3 border-b border-slate-200 dark:border-slate-800 bg-white dark:bg-slate-900">
diff --git a/src/food-market.web/src/pages/LossEditPage.tsx b/src/food-market.web/src/pages/LossEditPage.tsx
index 885b8cf..c99af54 100644
--- a/src/food-market.web/src/pages/LossEditPage.tsx
+++ b/src/food-market.web/src/pages/LossEditPage.tsx
@@ -8,6 +8,7 @@ import { Field, TextArea, Select, MoneyInput, NumberInput, Checkbox } from '@/co
 import { DateField } from '@/components/DateField'
 import { ProductPicker } from '@/components/ProductPicker'
 import { ConfirmDialog } from '@/components/ConfirmDialog'
+import { FormSkeleton } from '@/components/Skeleton'
 import { useConfirm } from '@/lib/useConfirm'
 import { useStores, useCurrencies } from '@/lib/useLookups'
 import { useOrgSettings } from '@/lib/useOrgSettings'
@@ -192,6 +193,9 @@ export function LossEditPage() {
     ? { minimumFractionDigits: 2, maximumFractionDigits: 2 }
     : { maximumFractionDigits: 0 }
 
+  // На редактировании пока тащим документ — показываем скелет.
+  if (!isNew && existing.isLoading) return <FormSkeleton />
+
   return (
     <form onSubmit={onSubmit} className="flex flex-col h-full">
       <div className="flex items-center justify-between gap-4 px-6 py-3 border-b border-slate-200 dark:border-slate-800 bg-white dark:bg-slate-900">
diff --git a/src/food-market.web/src/pages/OrganizationSettingsPage.tsx b/src/food-market.web/src/pages/OrganizationSettingsPage.tsx
index 451371e..7228e67 100644
--- a/src/food-market.web/src/pages/OrganizationSettingsPage.tsx
+++ b/src/food-market.web/src/pages/OrganizationSettingsPage.tsx
@@ -5,6 +5,7 @@ import { api } from '@/lib/api'
 import { PageHeader } from '@/components/PageHeader'
 import { Button } from '@/components/Button'
 import { Field, TextInput, Select, Checkbox } from '@/components/Field'
+import { FormSkeleton } from '@/components/Skeleton'
 import { useCountries } from '@/lib/useLookups'
 import { useOrgSettings, type OrgSettings } from '@/lib/useOrgSettings'
 
@@ -66,7 +67,7 @@ export function OrganizationSettingsPage() {
     meta: { successMessage: 'Настройки сохранены' },
   })
 
-  if (!form) return <div className="p-6 text-sm text-slate-500">Загрузка…</div>
+  if (!form) return <FormSkeleton />
 
   return (
     <div className="h-full overflow-auto">
diff --git a/src/food-market.web/src/pages/ProductEditPage.tsx b/src/food-market.web/src/pages/ProductEditPage.tsx
index 6db8c17..774d6bf 100644
--- a/src/food-market.web/src/pages/ProductEditPage.tsx
+++ b/src/food-market.web/src/pages/ProductEditPage.tsx
@@ -12,6 +12,7 @@ import { useOrgSettings } from '@/lib/useOrgSettings'
 import { BarcodeType, Packaging, type Product } from '@/lib/types'
 import { ProductImageGallery } from '@/components/ProductImageGallery'
 import { ConfirmDialog } from '@/components/ConfirmDialog'
+import { FormSkeleton } from '@/components/Skeleton'
 import { useConfirm } from '@/lib/useConfirm'
 import { generateEan13InternalPrefix2, generateBarcode, generateArticle } from '@/lib/barcode'
 
@@ -220,6 +221,10 @@ export function ProductEditPage() {
     && form.barcodes.length > 0
     && missingRequiredPrices.length === 0
 
+  // На редактировании пока тащим существующий товар — показываем скелет
+  // вместо пустых полей формы, чтобы не путать пользователя.
+  if (!isNew && existing.isLoading) return <FormSkeleton />
+
   return (
     <form onSubmit={onSubmit} className="flex flex-col h-full">
       {/* Sticky top bar */}
diff --git a/src/food-market.web/src/pages/RetailSaleEditPage.tsx b/src/food-market.web/src/pages/RetailSaleEditPage.tsx
index 8d3aaa6..d9ed513 100644
--- a/src/food-market.web/src/pages/RetailSaleEditPage.tsx
+++ b/src/food-market.web/src/pages/RetailSaleEditPage.tsx
@@ -7,6 +7,7 @@ import { Button } from '@/components/Button'
 import { Field, TextInput, TextArea, Select, AsyncSelect, MoneyInput, NumberInput } from '@/components/Field'
 import { ProductPicker } from '@/components/ProductPicker'
 import { ConfirmDialog } from '@/components/ConfirmDialog'
+import { FormSkeleton } from '@/components/Skeleton'
 import { useConfirm } from '@/lib/useConfirm'
 import { useStores, useCurrencies } from '@/lib/useLookups'
 import { useOrgSettings } from '@/lib/useOrgSettings'
@@ -208,6 +209,9 @@ export function RetailSaleEditPage() {
   // кнопка disabled с подсказкой.
   const canSave = !!form.storeId && !!form.currencyId && isDraft && form.lines.length > 0
 
+  // На редактировании пока тащим документ — показываем скелет.
+  if (!isNew && existing.isLoading) return <FormSkeleton />
+
   return (
     <form onSubmit={onSubmit} className="flex flex-col h-full">
       <div className="flex items-center justify-between gap-4 px-6 py-3 border-b border-slate-200 dark:border-slate-800 bg-white dark:bg-slate-900">
diff --git a/src/food-market.web/src/pages/SupplierReturnEditPage.tsx b/src/food-market.web/src/pages/SupplierReturnEditPage.tsx
index 75c9c88..4172750 100644
--- a/src/food-market.web/src/pages/SupplierReturnEditPage.tsx
+++ b/src/food-market.web/src/pages/SupplierReturnEditPage.tsx
@@ -8,6 +8,7 @@ import { Field, TextArea, Select, AsyncSelect, MoneyInput, NumberInput, Checkbox
 import { DateField } from '@/components/DateField'
 import { ProductPicker } from '@/components/ProductPicker'
 import { ConfirmDialog } from '@/components/ConfirmDialog'
+import { FormSkeleton } from '@/components/Skeleton'
 import { useConfirm } from '@/lib/useConfirm'
 import { useStores, useCurrencies } from '@/lib/useLookups'
 import { useOrgSettings } from '@/lib/useOrgSettings'
@@ -195,6 +196,9 @@ export function SupplierReturnEditPage() {
     ? { minimumFractionDigits: 2, maximumFractionDigits: 2 }
     : { maximumFractionDigits: 0 }
 
+  // На редактировании пока тащим документ — показываем скелет.
+  if (!isNew && existing.isLoading) return <FormSkeleton />
+
   return (
     <form onSubmit={onSubmit} className="flex flex-col h-full">
       <div className="flex items-center justify-between gap-4 px-6 py-3 border-b border-slate-200 dark:border-slate-800 bg-white dark:bg-slate-900">
diff --git a/src/food-market.web/src/pages/SupplyEditPage.tsx b/src/food-market.web/src/pages/SupplyEditPage.tsx
index 6b2db8b..653f425 100644
--- a/src/food-market.web/src/pages/SupplyEditPage.tsx
+++ b/src/food-market.web/src/pages/SupplyEditPage.tsx
@@ -9,6 +9,7 @@ import { DateField } from '@/components/DateField'
 import { ProductPicker } from '@/components/ProductPicker'
 import { SupplyLineQuickAdd, type AddedProduct } from '@/components/SupplyLineQuickAdd'
 import { ConfirmDialog } from '@/components/ConfirmDialog'
+import { FormSkeleton } from '@/components/Skeleton'
 import { useConfirm } from '@/lib/useConfirm'
 import { useStores, useCurrencies, usePriceTypes } from '@/lib/useLookups'
 import { useOrgSettings } from '@/lib/useOrgSettings'
@@ -268,6 +269,9 @@ export function SupplyEditPage() {
     && form.lines.length > 0
     && isDraft
 
+  // На редактировании пока тащим документ — показываем скелет.
+  if (!isNew && existing.isLoading) return <FormSkeleton />
+
   return (
     <form onSubmit={onSubmit} className="flex flex-col h-full">
       {/* Sticky top bar */}
diff --git a/src/food-market.web/src/pages/TransferEditPage.tsx b/src/food-market.web/src/pages/TransferEditPage.tsx
index 977405f..e572189 100644
--- a/src/food-market.web/src/pages/TransferEditPage.tsx
+++ b/src/food-market.web/src/pages/TransferEditPage.tsx
@@ -8,6 +8,7 @@ import { Field, TextArea, Select, MoneyInput, NumberInput, Checkbox } from '@/co
 import { DateField } from '@/components/DateField'
 import { ProductPicker } from '@/components/ProductPicker'
 import { ConfirmDialog } from '@/components/ConfirmDialog'
+import { FormSkeleton } from '@/components/Skeleton'
 import { useConfirm } from '@/lib/useConfirm'
 import { useStores } from '@/lib/useLookups'
 import { useOrgSettings } from '@/lib/useOrgSettings'
@@ -177,6 +178,9 @@ export function TransferEditPage() {
     ? { minimumFractionDigits: 2, maximumFractionDigits: 2 }
     : { maximumFractionDigits: 0 }
 
+  // На редактировании пока тащим документ — показываем скелет.
+  if (!isNew && existing.isLoading) return <FormSkeleton />
+
   return (
     <form onSubmit={onSubmit} className="flex flex-col h-full">
       <div className="flex items-center justify-between gap-4 px-6 py-3 border-b border-slate-200 dark:border-slate-800 bg-white dark:bg-slate-900">