feat: add server and frontend initial - wood chopping

packages/overlay/src/App.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
   import { onMount } from 'svelte';
   import { mountWorld, type WorldHandle } from '@idle/render';
-  import { connectWorld, type ConnectHandlers, type NetStatus } from './net';
+  import { connectWorld, type NetStatus } from './net';
 
   const STATUS_TEXT: Record<NetStatus, string> = {
     connecting: 'подключение…',
@@ -19,13 +19,14 @@
     if (host) {
       void mountWorld(host, { backgroundAlpha: 0 }).then((w) => {
         world = w;
-        const handlers: ConnectHandlers = {
+        disposeNet = connectWorld({
           onStatus: (s) => {
             status = s;
           },
-          onSnapshot: (snap) => world?.applySnapshot(snap.avatars),
-        };
-        disposeNet = connectWorld(handlers);
+          onWelcome: (msg) => world?.setWelcome(msg),
+          onSnapshot: (msg) => world?.applySnapshot(msg),
+          onDelta: (msg) => world?.applyDelta(msg),
+        });
       });
     }
 
@@ -39,6 +40,10 @@
 <div class="root">
   <div class="world" bind:this={host}></div>
   <div class="badge">{STATUS_TEXT[status]}</div>
+  <!-- онбординг — в самом виджете, чат ботом не засоряем -->
+  {#if status === 'online'}
+    <div class="hint">!рубить — валить лес&nbsp;&nbsp;·&nbsp;&nbsp;!стоп — отдых</div>
+  {/if}
 </div>
 
 <style>
@@ -60,4 +65,16 @@
     padding: 2px 8px;
     border-radius: 8px;
   }
+  .hint {
+    position: absolute;
+    bottom: 14px;
+    left: 50%;
+    transform: translateX(-50%);
+    font: 13px/1.4 monospace;
+    color: #eef4fa;
+    background: rgba(16, 19, 26, 0.6);
+    padding: 5px 14px;
+    border-radius: 10px;
+    white-space: nowrap;
+  }
 </style>