fix(materials): синхронизация легенды и маркеров на превью и презентации

Легенда и цифры на материале масштабируются от экрана игроков и не обрезаются жёлтой рамкой. Переключение сцен без записи project.json на диск.

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

app/renderer/shared/materials/MaterialOverlay.module.css

@@ -17,6 +17,29 @@
   pointer-events: none;
 }
 
+.hostViewport {
+  position: absolute;
+  overflow: hidden;
+  pointer-events: none;
+  z-index: 41;
+}
+
+.markerLayer {
+  position: absolute;
+  inset: 0;
+  z-index: 45;
+  overflow: visible;
+  pointer-events: none;
+}
+
+.legendLayer {
+  position: absolute;
+  inset: 0;
+  z-index: 46;
+  overflow: visible;
+  pointer-events: none;
+}
+
 .viewportGuide {
   position: absolute;
   inset: 0;
@@ -65,7 +88,7 @@
   width: 100%;
   height: 100%;
   display: block;
-  object-fit: fill;
+  object-fit: contain;
   border-radius: 6px;
   box-shadow: 0 18px 48px rgba(0, 0, 0, 0.55);
   user-select: none;
@@ -90,6 +113,24 @@
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
 }
 
+.legendMarkerHost {
+  position: absolute;
+  transform-origin: center center;
+  width: 26px;
+  height: 26px;
+  border-radius: 50%;
+  background: #1e3a5f;
+  border: 2px solid #f5c542;
+  color: #fff;
+  font-size: 12px;
+  font-weight: 800;
+  display: grid;
+  place-items: center;
+  pointer-events: none;
+  z-index: 47;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
+}
+
 .handle {
   position: absolute;
   width: 12px;