update desige 2 3 5 6

www/html/Game/public/js/play.js

@@ -19242,6 +19242,35 @@
     return !!(img && img.src && img.src !== defaultAvatarImg.src && img.complete && img.naturalWidth > 8 && img.naturalHeight > 8);
   }
 
+  /** crop หัว (จัตุรัส) จาก src เต็มตัว (lobby idle — ย้อมสีถูกแล้ว) → 120×120 data URL (async, cache)
+   *  ใช้เมื่อ composeCyberHudFacePortraitDataUrl คืน '' (เช่นตัวที่ layer ไม่ compose) → human เป็น "หน้า" เหมือนบอท ไม่ใช่เต็มตัว */
+  var cyberHudLobbyFaceCropCache = new Map();
+  function cyberHudLobbyIdleHeadFaceDataUrl(src) {
+    if (!src) return '';
+    if (src.indexOf('data:') === 0 && src.length < 200) return '';
+    if (cyberHudLobbyFaceCropCache.has(src)) return cyberHudLobbyFaceCropCache.get(src);
+    cyberHudLobbyFaceCropCache.set(src, '');
+    var im = new Image();
+    im.onload = function () {
+      try {
+        var sw = im.naturalWidth, sh = im.naturalHeight;
+        if (!sw || !sh) { cyberHudLobbyFaceCropCache.set(src, ''); return; }
+        var c = document.createElement('canvas');
+        c.width = 120; c.height = 120;
+        var ctx = c.getContext('2d');
+        if (!ctx) { cyberHudLobbyFaceCropCache.set(src, ''); return; }
+        var cw = sw * 0.8, ch = sh * 0.5, cs = Math.min(cw, ch);
+        var sxC = sw * 0.1 + (cw - cs) * 0.5, syC = sh * 0.02;
+        ctx.clearRect(0, 0, 120, 120);
+        ctx.drawImage(im, sxC, syC, cs, cs, 0, 0, 120, 120);
+        cyberHudLobbyFaceCropCache.set(src, playCanvasHasOpaquePixels(c) ? c.toDataURL('image/png') : '');
+      } catch (e) { cyberHudLobbyFaceCropCache.set(src, ''); }
+    };
+    im.onerror = function () { cyberHudLobbyFaceCropCache.set(src, ''); };
+    im.src = src;
+    return '';
+  }
+
   /** โปรไฟล์มุมขวาบน — mission mock ใช้หน้า crop สี่เหลี่ยม ไม่ดึง sprite เต็มตัว */
   function setCyberHudProfilePortraitImg(portraitImg) {
     if (!portraitImg) return;
@@ -19328,6 +19357,18 @@
     if (row.isMe) {
       const lobbySrc = playLobbyIdleAvatarSrcForCharacter(cid);
       if (lobbySrc) {
+        if (isMissionMockHudPlay()) {
+          /* mock hud (mg2 ฯลฯ): crop หัวจาก lobby idle → "หน้า" จัตุรัสเหมือนบอท (กัน human โชว์เต็มตัวคนเดียว) */
+          const lobbyFace = cyberHudLobbyIdleHeadFaceDataUrl(lobbySrc);
+          if (lobbyFace) {
+            avImg.src = lobbyFace;
+            cyberHudScoreAvatarUrlCache.set(cacheKey, lobbyFace);
+            return;
+          }
+          /* crop ยังไม่เสร็จ (async) → ตั้งเต็มตัวชั่วคราว ไม่ cache → retry จะได้หน้า crop */
+          avImg.src = lobbySrc;
+          return;
+        }
         avImg.src = lobbySrc;
         cyberHudScoreAvatarUrlCache.set(cacheKey, lobbySrc);
         return;
@@ -19353,8 +19394,11 @@
   function applyCyberHudScoreAvatarImgWithRetry(avImg, row, attempt) {
     attempt = attempt || 0;
     setCyberHudScoreAvatarImg(avImg, row);
-    const ok = cyberHudScoreAvatarImgLooksReady(avImg)
-      && (avImg.src.indexOf('data:image/') === 0 || (row.isMe && avImg.src.indexOf('/img/') >= 0));
+    /* mock hud: ต้องได้ "หน้า" 120×120 (naturalWidth≥100) เท่านั้นถึงหยุด — กันค้างที่ raw frame 64×64 (เต็มตัว)
+       หรือ /img/ sprite เต็มตัว ก่อน composeCyberHudFacePortraitDataUrl จะได้หน้า (ตอน char-layer API ยังโหลด) */
+    const mockFaceOk = !isMissionMockHudPlay() || (avImg.naturalWidth >= 100 && avImg.naturalHeight >= 100);
+    const ok = cyberHudScoreAvatarImgLooksReady(avImg) && mockFaceOk
+      && (avImg.src.indexOf('data:image/') === 0 || (row.isMe && !isMissionMockHudPlay() && avImg.src.indexOf('/img/') >= 0));
     if (ok) return;
     if (attempt >= 16) return;
     const cid = row.characterId ? String(row.characterId) : '';
@@ -19844,7 +19888,7 @@
             rem,
           );
         }
-        metaEl.textContent = 'P1 · ' + esc + ' · TEAM 0 · COMBO x0';
+        metaEl.textContent = 'P1 · ' + esc; /* ตัด 'TEAM 0 · COMBO x0' ปลอม (ค่าไม่เปลี่ยน ไม่ตรง design) */
       } else if (isQuizQuestionMissionHudActivePlay()) {
         statusEl.textContent = 'QUIZ LINK · ประลองความรู้';
       } else if (isStackTowerMissionHudActivePlay()) {

www/html/Game/public/play.html

@@ -3280,6 +3280,12 @@
       gap: 0;
       max-width: none;
     }
+    /* MG5 jumper: design วาง TIME ชิดซ้ายบน (mockup 03 'TIME:25') ไม่ใช่กลาง */
+    #play-cyber-hud.play-cyber-hud--quiz-tf-mock[data-mission-mock-skin="jumper"] .play-cyber-center-stack {
+      left: 40px;
+      top: 23px;
+      transform: none;
+    }
     #play-cyber-hud.play-cyber-hud--quiz-tf-mock .play-cyber-time-head--qm-plaque {
       flex-direction: row;
       align-items: center;
@@ -3682,7 +3688,7 @@
     }
     html #play-cyber-hud.play-cyber-hud.play-cyber-hud--quiz-tf-mock[data-mission-mock-skin="gauntlet_crown"] .play-cyber-profile-frame-overlay {
       display: block !important;
-      z-index: 2 !important;
+      z-index: 0 !important; /* Avartar.png กรอบ (พื้นกลางทึบ) อยู่ "หลัง" หน้า portrait (clip z1) ไม่งั้นกรอบทับหน้า */
     }
     html #play-cyber-hud.play-cyber-hud.play-cyber-hud--quiz-tf-mock[data-mission-mock-skin="gauntlet_crown"].play-cyber-hud--gauntlet-crown-strip {
       display: block;
@@ -3812,7 +3818,7 @@
       border-radius: 3px;
       border: none;
       background: transparent;
-      transform: scale(0.81) translateY(-3px);
+      transform: scale(0.73) translateY(-3px);
       transform-origin: center center;
     }
     #play-cyber-hud.play-cyber-hud--quiz-tf-mock[data-mission-mock-skin="gauntlet_crown"] .play-cyber-mg2-score {
@@ -4740,7 +4746,7 @@
   <script src="/app-base.js?v=2"></script>
   <script src="/Game/socket.io/socket.io.js"></script>
     <script src="js/version.js?v=0.0306"></script>
-    <script src="js/play.js?v=0.00610200004"></script>
+    <script src="js/play.js?v=0.00610200013"></script>
   <div class="version-tag">v —</div>
 </body>
 </html>