feat: support simultaneous Tailscale and LAN communication for Yahboom cameras

src/renderer/public/splash.html

@@ -9,7 +9,7 @@
       width: 100%;
       height: 100%;
       overflow: hidden;
-      background: #07111f;
+      background: #ffffff;
       font-family: NanumSquare, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
     }
 
@@ -17,7 +17,7 @@
       position: relative;
       width: 100vw;
       height: 100vh;
-      background: radial-gradient(circle at 50% 35%, #11243e 0%, #07111f 54%, #03070d 100%);
+      background: #ffffff;
       -webkit-app-region: drag;
     }
 
@@ -31,22 +31,53 @@
       -webkit-user-drag: none;
     }
 
-    .fallback-title {
+    .brand-logo {
       position: absolute;
-      top: 45%;
+      top: 116px;
+      left: calc(50% - 3px);
+      z-index: 1;
+      width: 80px;
+      height: 70px;
+      transform: translateX(-50%);
+      object-fit: contain;
+      user-select: none;
+      -webkit-user-drag: none;
+    }
+
+    .brand-copy {
+      position: absolute;
+      top: 187px;
       left: 50%;
-      transform: translate(-50%, -50%);
-      color: #4d5d76;
-      text-shadow: 0 1px 12px rgba(255, 255, 255, 0.28);
-      font-size: 28px;
-      font-weight: 800;
+      z-index: 1;
+      width: 290px;
+      transform: translateX(-50%);
+      text-align: center;
+    }
+
+    .brand-title {
+      color: #252d39;
+      font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+      font-size: 32px;
+      font-weight: 400;
+      line-height: 1;
       letter-spacing: 6px;
+      text-indent: 6px;
+    }
+
+    .brand-subtitle {
+      margin-top: 9px;
+      color: #7a8495;
+      font-size: 12px;
+      font-weight: 400;
+      line-height: 1.2;
+      letter-spacing: 0;
     }
 
     .loading {
       position: absolute;
       right: 26px;
       bottom: 20px;
+      z-index: 2;
       color: #64738a;
       text-shadow: 0 1px 10px rgba(255, 255, 255, 0.24);
       font-size: 12px;
@@ -58,6 +89,7 @@
       position: absolute;
       bottom: 20px;
       left: 20px;
+      z-index: 2;
       color: #7a8495;
       text-shadow: 0 1px 8px rgba(255, 255, 255, 0.2);
       font-size: 11px;
@@ -68,15 +100,17 @@
 </head>
 <body>
   <div class="splash">
-    <div class="fallback-title">LMS</div>
-    <img class="splash-image" id="splash-image" alt="" />
+    <img class="splash-image" src="./assets/splash.png" alt="" />
+    <img class="brand-logo" src="./assets/splash-logo.png" alt="" />
+    <div class="brand-copy">
+      <div class="brand-title">LMS</div>
+      <div class="brand-subtitle">Learning Management System</div>
+    </div>
     <div class="copyright">© 2026 Autonomy Studio. All rights reserved.</div>
     <div class="loading" id="loading-text">학습 환경 준비 중...</div>
   </div>
 
   <script>
-    document.getElementById('splash-image').src = './assets/splash.png'
-
     const el = document.getElementById('loading-text')
     const translations = {
       '학습 환경 준비 중...': 'Preparing your learning environment...',