From 762f43dad42e6dbdecc19fdba73b24a4886386cb Mon Sep 17 00:00:00 2001
From: NikitaKalitov <nikitakalitov@yandex.ru>
Date: Thu, 27 Aug 2026 14:33:35 +0300
Subject: [PATCH] =?UTF-8?q?=D0=A4=D0=B8=D0=BA=D1=81=20=D1=81=D1=82=D0=B5?=
 =?UTF-8?q?=D0=B9=D1=82=D0=B0=20=D0=B7=D0=B0=D0=B3=D1=80=D1=83=D0=B7=D0=BA?=
 =?UTF-8?q?=D0=B8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.tsx   |  2 +-
 src/index.css | 17 +++++++++++++++++
 2 files changed, 18 insertions(+), 1 deletion(-)

diff --git a/src/App.tsx b/src/App.tsx
index 2ce4ba8..43b498c 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -97,7 +97,7 @@ function App() {
   }, []);
 
   if (!doc) {
-    return <p style={{ padding: 16, fontFamily: 'system-ui, sans-serif' }}>Загрузка диаграммы…</p>;
+    return <div className="diagram-loading">Загрузка диаграммы…</div>;
   }
 
   return (
diff --git a/src/index.css b/src/index.css
index ae2c06e..cc2393a 100644
--- a/src/index.css
+++ b/src/index.css
@@ -21,3 +21,20 @@ body,
 .diagram-breadcrumbs:hover {
   cursor: pointer;
 }
+
+/*
+ * Экран ожидания `diagram:init` от хоста. Занимает ровно высоту вьюпорта и
+ * центрирует надпись. Раньше это был <p> с отступом: его собственный
+ * margin выходил за пределы 100%-высоты предка и давал вертикальный скролл
+ * на пустом экране.
+ */
+.diagram-loading {
+  height: 100%;
+  margin: 0;
+  padding: 16px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  text-align: center;
+  color: #525a64;
+}