vote and bot on lobby

www/html/Game/public/js/room-lobby.js

@@ -3664,25 +3664,33 @@
     if (document.getElementById('trial-style')) return;
     var st = document.createElement('style');
     st.id = 'trial-style';
+    var RV = '/Main-Lobby/IMAGE/RoomVote/';
     st.textContent =
+      '.suspect-pick--trial{background:linear-gradient(rgba(4,8,18,.35),rgba(4,8,18,.55)),url(' + RV + 'roomvote-bg.png) center/cover no-repeat,#04081a !important}' +
       '.suspect-pick--trial .suspect-pick-actions{display:none!important}' +
       '.suspect-pick--trial #suspect-btn-accuse{display:none!important}' +   /* #1 ปุ่มชี้ตัวต้องหายตอนหน้าโหวต */
       '#trial-vote-counter{position:absolute;right:22px;top:14px;color:#7fe9ff;font:800 24px/1 Kanit,system-ui,sans-serif;display:none;z-index:62;text-shadow:0 0 12px rgba(34,211,238,.7)}' +
       '#trial-vote-counter b{color:#fff}' +
       '.suspect-pick--trial #trial-vote-counter{display:block}' +
       '.suspect-pick--trial .suspect-pick-title-img{display:none!important}' +
-      '#trial-title{display:none;text-align:center;color:#7fe9ff;font:800 40px/1.1 Kanit,system-ui,sans-serif;text-shadow:0 0 18px rgba(34,211,238,.7);margin:0 0 2px}' +
-      '#trial-title small{display:block;color:#cfe9ff;font:600 18px/1.3 Kanit,system-ui,sans-serif;text-shadow:none;margin-top:6px}' +
+      '#trial-title{display:none;text-align:center;margin:0 0 4px}' +
+      '#trial-title img{display:block;margin:0 auto;max-width:90vw}' +
+      '#trial-title-main{height:92px;width:auto}' +
+      '#trial-title-sub{height:46px;width:auto;margin-top:6px}' +
       '.suspect-pick--trial #trial-title{display:block}' +
       '.suspect-pick--trial .suspect-card{cursor:pointer;position:relative}' +
-      // badge อยู่กลางล่างการ์ด (เลียนแบบปุ่ม "เลือกแล้ว" ใน mockup)
-      '.suspect-card .trial-vote-badge{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);color:#06121f;font:700 15px/1 Kanit,system-ui,sans-serif;padding:7px 16px;border-radius:999px;display:none;z-index:6;white-space:nowrap;box-shadow:0 2px 10px rgba(0,0,0,.45)}' +
-      // ตอนโหวต: โชว์เฉพาะใบที่เราเลือก = "เลือกแล้ว" (เขียว)
-      '.suspect-pick--trial .suspect-card--myvote .trial-vote-badge{display:block;background:rgba(34,197,94,.97)}' +
-      // ตอนเปิดเผยผล: โชว์คะแนนโหวตทุกใบ (ฟ้า)
-      '.suspect-pick--trial.trial-revealed .trial-vote-badge{display:block;background:rgba(34,211,238,.97)}' +
+      // ตอนโหวต: ใบที่เราเลือก = ปุ่มภาพ "เลือกแล้ว" (btn-selected.png)
+      '.suspect-card .trial-vote-badge{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);display:none;z-index:7;white-space:nowrap}' +
+      '.suspect-pick--trial .suspect-card--myvote .trial-vote-badge{display:block;width:204px;height:83px;max-width:80%;background:url(' + RV + 'btn-selected.png) center/contain no-repeat;color:transparent;font-size:0;padding:0;box-shadow:none}' +
+      // ตอนเปิดเผยผล: โชว์คะแนนโหวตทุกใบ (ป้ายฟ้า)
+      '.suspect-pick--trial.trial-revealed .trial-vote-badge{display:block;background:rgba(34,211,238,.97);color:#06121f;font:700 15px/1 Kanit;padding:7px 16px;border-radius:999px;box-shadow:0 2px 10px rgba(0,0,0,.45)}' +
       '.suspect-card--myvote{outline:3px solid #22c55e;outline-offset:-3px;border-radius:16px}' +
       '.suspect-card--culprit{outline:4px solid #f7768e;outline-offset:-4px;border-radius:16px;box-shadow:0 0 34px rgba(247,118,142,.85)}' +
+      // แสตมป์ "ผู้บริสุทธิ์" ทับใบที่โหวตผิด + เทาใบนั้น
+      '.suspect-card .trial-stamp{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%) rotate(-8deg);width:78%;max-width:300px;height:auto;z-index:9;display:none;pointer-events:none}' +
+      '.suspect-card--innocent .trial-stamp{display:block}' +
+      '.suspect-card--innocent{filter:grayscale(1) brightness(.8)}' +
+      '#trial-lose-txt{position:absolute;left:50%;top:4%;transform:translateX(-50%);width:712px;max-width:88vw;height:auto;z-index:61;display:none}' +
       '#trial-result-banner{position:absolute;left:50%;top:5%;transform:translateX(-50%);background:rgba(6,12,24,.96);border:2px solid #22d3ee;border-radius:16px;padding:14px 26px;color:#e7ecff;font:600 20px/1.5 Kanit,system-ui,sans-serif;text-align:center;z-index:60;max-width:82%;box-shadow:0 8px 40px rgba(0,0,0,.6)}' +
       '#trial-reveal-btn{position:absolute;left:50%;bottom:5%;transform:translateX(-50%);background:linear-gradient(180deg,#22d3ee,#0e7490);color:#06121f;border:none;border-radius:14px;padding:14px 30px;font:700 20px/1 Kanit,system-ui,sans-serif;cursor:pointer;z-index:60;box-shadow:0 6px 22px rgba(34,211,238,.5)}';
     document.head.appendChild(st);
@@ -3758,22 +3766,24 @@
 
   /** หัวข้อ "พิจารณาคดี" (แทนรูป title เลือกผู้ต้องสงสัยตอนอยู่โหมดโหวต) */
   function ensureTrialTitle() {
+    var RV = '/Main-Lobby/IMAGE/RoomVote/';
     var row = document.getElementById('suspect-cards-row');
     var t = document.getElementById('trial-title');
     if (!t && row && row.parentNode) {
       t = document.createElement('div');
       t.id = 'trial-title';
-      t.innerHTML = 'พิจารณาคดี<small>เลือกผู้ร้ายตัวจริง และส่งตัวไปดำเนินคดี เพื่อทำภารกิจให้สำเร็จ</small>';
+      t.innerHTML = '<img id="trial-title-main" src="' + RV + 'roomvote-txt.png" alt="พิจารณาคดี">' +
+        '<img id="trial-title-sub" src="' + RV + 'roomvote-txt-2.png" alt="เลือกผู้ร้ายตัวจริง">';
       row.parentNode.insertBefore(t, row);
     }
     return t;
   }
 
-  function setTrialSubtitle(txt) {
-    var t = document.getElementById('trial-title');
-    if (!t) return;
-    var s = t.querySelector('small');
-    if (s) s.textContent = txt;
+  // mode: 'vote' = roomvote-txt-2, 'result' = roomvote-txt-3
+  function setTrialSubtitle(mode) {
+    var RV = '/Main-Lobby/IMAGE/RoomVote/';
+    var sub = document.getElementById('trial-title-sub');
+    if (sub) sub.src = (mode === 'result') ? (RV + 'roomvote-txt-3.png') : (RV + 'roomvote-txt-2.png');
   }
 
   function castTrialVote(idx) {
@@ -3806,10 +3816,13 @@
     ov.classList.add('suspect-pick--trial');
     ov.setAttribute('aria-hidden', 'false');
     document.querySelectorAll('.suspect-card').forEach(function (c) {
-      c.classList.remove('suspect-card--myvote', 'suspect-card--culprit', 'suspect-card--selected');
+      c.classList.remove('suspect-card--myvote', 'suspect-card--culprit', 'suspect-card--selected', 'suspect-card--innocent');
     });
+    var loseEl = document.getElementById('trial-lose-txt'); if (loseEl) loseEl.style.display = 'none';
     applySuspectProgressVisual();
     ensureTrialTitle();
+    var ttl = document.getElementById('trial-title'); if (ttl) ttl.style.display = 'block';
+    setTrialSubtitle('vote');
     ensureTrialBadges();
     document.querySelectorAll('.trial-vote-badge').forEach(function (b) { b.textContent = ''; });
     setTrialCounter(0, (data && data.totalPlayers) || (peers ? peers.size : 0) || 1);
@@ -3827,25 +3840,57 @@
     scheduleSuspectPickScale();
   }
 
+  function ensureTrialLoseTxt() {
+    var ov = document.getElementById('suspect-pick-overlay');
+    var el = document.getElementById('trial-lose-txt');
+    if (!el && ov) {
+      el = document.createElement('img');
+      el.id = 'trial-lose-txt';
+      el.src = '/Main-Lobby/IMAGE/RoomVote/txt-lose.png';
+      el.alt = 'ไม่นะ..คุณจับแพะ!!';
+      ov.appendChild(el);
+    }
+    return el;
+  }
+
   function showTrialResult(data) {
     trialMode = 'revealed';
     var culprit = (data && typeof data.culpritIndex === 'number') ? data.culpritIndex : 0;
     if (data && Array.isArray(data.counts)) trialVoteCounts = data.counts;
+    var counts = trialVoteCounts || [0, 0, 0];
     var ov = document.getElementById('suspect-pick-overlay');
     if (ov) ov.classList.add('trial-revealed');
-    // โชว์คะแนนโหวตทุกใบ + ไฮไลต์คนร้าย
+    setTrialSubtitle('result');
+    // หาผู้ต้องสงสัยที่ถูกโหวตมากสุด
+    var mostVoted = 0; for (var k = 1; k <= 2; k++) { if ((counts[k] || 0) > (counts[mostVoted] || 0)) mostVoted = k; }
+    var anyVotes = ((counts[0] || 0) + (counts[1] || 0) + (counts[2] || 0)) > 0;
+    var correct = anyVotes && (mostVoted === culprit);
     document.querySelectorAll('.suspect-card').forEach(function (c) {
       var ci = parseInt(c.getAttribute('data-index'), 10);
-      c.classList.remove('suspect-card--myvote');
+      c.classList.remove('suspect-card--myvote', 'suspect-card--innocent');
       c.classList.toggle('suspect-card--culprit', ci === culprit);
       var b = c.querySelector('.trial-vote-badge');
-      if (b) b.textContent = 'โหวต ' + ((trialVoteCounts && trialVoteCounts[ci]) || 0);
+      if (b) b.textContent = 'โหวต ' + (counts[ci] || 0);
+      var stamp = c.querySelector('.trial-stamp');
+      if (!stamp) { stamp = document.createElement('img'); stamp.className = 'trial-stamp'; stamp.src = '/Main-Lobby/IMAGE/RoomVote/stamp-innocent.png'; stamp.alt = 'ผู้บริสุทธิ์'; c.appendChild(stamp); }
+      // โหวตผิด: ตีตรา "ผู้บริสุทธิ์" บนใบที่ถูกโหวตมากสุด (ไม่ใช่คนร้าย)
+      if (!correct && anyVotes && ci === mostVoted && ci !== culprit) c.classList.add('suspect-card--innocent');
     });
-    setTrialSubtitle('ผลการพิจารณาคดี');
+    // โหวตผิด → โชว์ "ไม่นะ..คุณจับแพะ!!" + ซ่อนหัวข้อปกติ
+    var lose = ensureTrialLoseTxt();
+    var titleEl = document.getElementById('trial-title');
+    if (!correct && anyVotes) {
+      if (lose) lose.style.display = 'block';
+      if (titleEl) titleEl.style.display = 'none';
+    } else {
+      if (lose) lose.style.display = 'none';
+      if (titleEl) titleEl.style.display = 'block';
+    }
     var names = (data && data.winnerNames && data.winnerNames.length) ? data.winnerNames.join(', ') : 'ไม่มีใครตอบถูก';
     var iWon = !!(data && Array.isArray(data.winners) && data.winners.indexOf(socket.id) >= 0);
     var banner = ensureTrialBanner();
     if (banner) {
+      banner.style.top = (!correct && anyVotes) ? '17%' : '5%';
       banner.innerHTML = 'คนร้ายตัวจริงคือ <b>ผู้ต้องสงสัยหมายเลข ' + (culprit + 1) + '</b><br>' +
         'ผู้ตอบถูก: ' + names + (iWon ? '<br>🎉 คุณตอบถูก! +100' : '');
       banner.style.display = 'block';
@@ -3853,8 +3898,58 @@
     var rb = document.getElementById('trial-reveal-btn');
     if (rb) rb.style.display = 'none';
     var hint = document.getElementById('suspect-pick-hint');
-    if (hint) hint.textContent = 'ปิดหน้าต่างเพื่อกลับโถง';
+    if (hint) hint.textContent = 'กำลังสรุปผล...';
     appendLobbySystemChat('— เปิดเผยผล: คนร้ายคือผู้ต้องสงสัยหมายเลข ' + (culprit + 1) + ' · ผู้ตอบถูก: ' + names);
+    // โชว์คะแนนโหวตสักครู่ แล้วไปหน้าผลเต็ม (ถูก = เรือนจำไซเบอร์ / ผิด = ภารกิจล้มเหลว)
+    if (anyVotes) {
+      if (trialFinalTimer) clearTimeout(trialFinalTimer);
+      trialFinalTimer = setTimeout(function () { showFinalResult(correct, culprit); }, 2800);
+    }
+  }
+
+  var trialFinalTimer = null;
+  function injectFinalResultStyle() {
+    if (document.getElementById('trial-final-style')) return;
+    var R = '/Main-Lobby/IMAGE/Result/';
+    var st = document.createElement('style');
+    st.id = 'trial-final-style';
+    st.textContent =
+      '#trial-final{position:fixed;inset:0;z-index:9500;background:#04060c center/cover no-repeat}' +
+      '#trial-final.is-hidden{display:none}' +
+      // ตัวคนร้ายในช่องคุก (ตอนตอบถูก)
+      '#trial-final-culprit{position:absolute;left:50%;top:55%;transform:translate(-50%,-50%);height:52%;width:auto;z-index:2;display:none;filter:drop-shadow(0 0 20px rgba(255,200,80,.55))}' +
+      // หัวข้อ "ภารกิจล้มเหลว" (ตอนตอบผิด) วางทับ lose-bg
+      '#trial-final-txt{position:absolute;left:50%;top:7%;transform:translateX(-50%);width:780px;max-width:90vw;height:auto;z-index:2;display:none}' +
+      '#trial-final-home{position:absolute;left:50%;bottom:5%;transform:translateX(-50%);width:300px;height:104px;max-width:70vw;background:url(' + R + 'btn-gohome.png) center/contain no-repeat;border:none;cursor:pointer;font-size:0;color:transparent;z-index:3;filter:drop-shadow(0 4px 14px rgba(0,0,0,.6))}';
+    document.head.appendChild(st);
+  }
+  function showFinalResult(correct, culprit) {
+    injectFinalResultStyle();
+    var R = '/Main-Lobby/IMAGE/Result/';
+    var CS = '/Main-Lobby/IMAGE/Choose%20a%20suspect/';
+    var ov = document.getElementById('trial-final');
+    if (!ov) {
+      ov = document.createElement('div');
+      ov.id = 'trial-final';
+      ov.className = 'is-hidden';
+      ov.innerHTML = '<img id="trial-final-culprit" alt="คนร้าย"><img id="trial-final-txt" alt="ภารกิจล้มเหลว">' +
+        '<button type="button" id="trial-final-home" aria-label="กลับหน้าหลัก">กลับหน้าหลัก</button>';
+      document.body.appendChild(ov);
+      ov.querySelector('#trial-final-home').addEventListener('click', function () { window.location.href = '/Main-Lobby/'; });
+    }
+    var culpEl = ov.querySelector('#trial-final-culprit');
+    var txtEl = ov.querySelector('#trial-final-txt');
+    if (correct) {
+      ov.style.backgroundImage = 'url(' + R + 'cyber-prison.png)';
+      if (culpEl) { culpEl.src = CS + 'suspect-' + (((typeof culprit === 'number' ? culprit : 0)) + 1) + '.png'; culpEl.style.display = 'block'; }
+      if (txtEl) txtEl.style.display = 'none';
+    } else {
+      ov.style.backgroundImage = 'url(' + R + 'lose-bg.png)';
+      if (txtEl) { txtEl.src = R + 'txt-your-lose.png'; txtEl.style.display = 'block'; }
+      if (culpEl) culpEl.style.display = 'none';
+    }
+    ov.classList.remove('is-hidden');
+    try { closeSuspectOverlay(); } catch (e) { /* ignore */ }
   }
 
   /* ===== ห้องสรุปหลักฐาน — การไต่สวน (เลือกหลักฐาน 2 ใบ/ปากคำ ก่อนโหวต) ===== */
@@ -3865,28 +3960,32 @@
     if (document.getElementById('testimony-style')) return;
     var st = document.createElement('style');
     st.id = 'testimony-style';
+    var SC = '/Main-Lobby/IMAGE/Showcard/';
     st.textContent =
-      '#testimony-overlay{position:fixed;inset:0;z-index:9000;background:rgba(4,8,18,.92);display:flex;flex-direction:column;align-items:center;gap:14px;padding:24px 16px;overflow:auto;font-family:Kanit,system-ui,sans-serif;color:#e7ecff}' +
+      '#testimony-overlay{position:fixed;inset:0;z-index:9000;background:linear-gradient(rgba(4,8,18,.55),rgba(4,8,18,.7)),url(' + SC + 'bg-showcard.png) center/cover no-repeat,#04081a;display:flex;flex-direction:column;align-items:center;gap:14px;padding:22px 16px;overflow:auto;font-family:Kanit,system-ui,sans-serif;color:#e7ecff}' +
       '#testimony-overlay.is-hidden{display:none}' +
-      '.tm-head{text-align:center}.tm-head h2{margin:0;color:#fff;font:800 30px/1.2 Kanit;text-shadow:0 0 16px rgba(34,211,238,.6)}.tm-head .tm-sub{margin:4px 0 0;color:#9fe7ff;font:600 16px/1.3 Kanit}' +
-      '.tm-members{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;max-width:1100px}' +
-      '.tm-member{min-width:120px;border:2px solid #1e6f8c;border-radius:12px;padding:8px 10px;text-align:center;background:rgba(10,22,40,.7)}' +
-      '.tm-member .tm-mname{font:700 14px/1 Kanit;color:#bfe9ff;margin-bottom:6px;white-space:nowrap}' +
-      '.tm-member .tm-mstat{font:600 13px/1.2 Kanit;color:#8aa0c0}' +
-      '.tm-member.tm-ready{border-color:#22c55e;box-shadow:0 0 14px rgba(34,197,94,.5)}.tm-member.tm-ready .tm-mstat{color:#22c55e}' +
+      '.tm-head{text-align:center}.tm-head h2{margin:0;color:#fff;font:800 32px/1.2 Kanit;text-shadow:0 0 16px rgba(34,211,238,.6)}.tm-head .tm-sub{margin:4px 0 0;color:#9fe7ff;font:600 16px/1.3 Kanit}' +
+      '.tm-members{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;max-width:1200px}' +
+      '.tm-member{min-width:130px;border:2px solid #1e6f8c;border-radius:14px;padding:10px 12px;text-align:center;background:rgba(8,20,38,.78)}' +
+      '.tm-member .tm-mname{font:700 14px/1 Kanit;color:#bfe9ff;margin-bottom:8px;white-space:nowrap;display:flex;align-items:center;justify-content:center;gap:5px}' +
+      '.tm-member .tm-mstat{font:600 13px/1.2 Kanit;color:#8aa0c0;display:flex;align-items:center;justify-content:center;gap:6px;min-height:26px}' +
+      '.tm-member .tm-mstat img{height:22px;width:auto}' +
+      '.tm-member.tm-ready{border-color:#22c55e;box-shadow:0 0 16px rgba(34,197,94,.55)}.tm-member.tm-ready .tm-mstat{color:#22c55e}' +
       '.tm-member.tm-me{outline:2px solid #22d3ee;outline-offset:2px}' +
-      '.tm-crown{color:#ffd54a}' +
+      '.tm-crown img{height:18px;width:auto;vertical-align:middle}' +
       '.tm-count{color:#ffd54a;font:700 18px/1 Kanit}' +
       '.tm-cards{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;max-width:1100px}' +
       '.tm-cards .lobby-evidence-card{cursor:pointer;transition:transform .12s,box-shadow .12s}' +
       '.tm-cards .lobby-evidence-card.tm-sel{outline:3px solid #22d3ee;outline-offset:2px;transform:translateY(-4px);box-shadow:0 8px 26px rgba(34,211,238,.5)}' +
-      '.tm-actions{display:flex;gap:14px;align-items:center}' +
-      '.tm-btn{background:linear-gradient(180deg,#22d3ee,#0e7490);color:#06121f;border:none;border-radius:14px;padding:13px 30px;font:700 19px/1 Kanit;cursor:pointer;box-shadow:0 6px 20px rgba(34,211,238,.45)}' +
-      '.tm-btn:disabled{opacity:.45;cursor:not-allowed;filter:grayscale(.5)}' +
-      '.tm-btn--ghost{background:transparent;color:#7fe9ff;border:2px solid #2a7e9c;box-shadow:none}' +
+      '.tm-actions{display:flex;gap:18px;align-items:center}' +
+      '.tm-imgbtn{background:center/contain no-repeat;border:none;cursor:pointer;font-size:0;color:transparent;padding:0;display:inline-block}' +
+      '.tm-imgbtn:disabled{filter:grayscale(.65) opacity(.45);cursor:not-allowed}' +
+      '#tm-submit{width:351px;height:151px;background-image:url(' + SC + 'btn-send.png)}' +
+      '#tm-force-reveal{width:421px;height:126px;background-image:url(' + SC + 'btn-open-card.png)}' +
+      '#tm-ready{width:321px;height:126px;background-image:url(' + SC + 'btn-ready.png)}' +
       '.tm-reveal-grid{display:flex;gap:16px;flex-wrap:wrap;justify-content:center;max-width:1200px}' +
       '.tm-rev-col{display:flex;flex-direction:column;align-items:center;gap:8px}' +
-      '.tm-rev-col .tm-rev-name{font:700 15px/1 Kanit;color:#bfe9ff}' +
+      '.tm-rev-col .tm-rev-name{font:700 15px/1 Kanit;color:#bfe9ff;display:flex;align-items:center;gap:5px}' +
       '.tm-rev-col .lobby-evidence-card{transform:scale(.82);margin:-14px 0}' +
       '.tm-status{color:#ffd54a;font:600 15px/1.3 Kanit;text-align:center}';
     document.head.appendChild(st);
@@ -3936,11 +4035,11 @@
         '<div style="display:flex;gap:18px;align-items:center;flex-wrap:wrap;justify-content:center"><span class="tm-sub">[เลือกพยานหลักฐาน 2 ชิ้น เพื่อประกอบสำนวนคดีนี้]</span><span class="tm-count" id="tm-count">เลือกหลักฐาน 0/2</span></div>' +
         '<div class="tm-cards" id="tm-cards"></div>' +
         '<div class="tm-status" id="tm-status"></div>' +
-        '<div class="tm-actions"><button type="button" class="tm-btn" id="tm-submit" disabled>ส่งหลักฐาน</button><button type="button" class="tm-btn tm-btn--ghost" id="tm-force-reveal" style="display:none">เปิดหลักฐานทั้งหมด</button></div>' +
+        '<div class="tm-actions"><button type="button" class="tm-imgbtn" id="tm-submit" disabled aria-label="ส่งหลักฐาน">ส่งหลักฐาน</button><button type="button" class="tm-imgbtn" id="tm-force-reveal" style="display:none" aria-label="เปิดหลักฐานทั้งหมด">เปิดหลักฐานทั้งหมด</button></div>' +
       '</div>' +
       '<div id="tm-reveal-wrap" style="display:none;flex-direction:column;align-items:center;gap:14px;width:100%">' +
         '<div class="tm-reveal-grid" id="tm-reveal-grid"></div>' +
-        '<button type="button" class="tm-btn" id="tm-ready">READY</button>' +
+        '<button type="button" class="tm-imgbtn" id="tm-ready" aria-label="READY">READY</button>' +
       '</div>';
     document.body.appendChild(ov);
     ov.querySelector('#tm-cards').addEventListener('click', function (e) {
@@ -3983,7 +4082,12 @@
       d.className = 'tm-member' + (m.id === socket.id ? ' tm-me' : '');
       var done = revealMode ? (readyIds && readyIds.indexOf(m.id) >= 0) : (submittedIds && submittedIds.indexOf(m.id) >= 0);
       if (done) d.classList.add('tm-ready');
-      d.innerHTML = '<div class="tm-mname">' + (m.isHost ? '<span class="tm-crown">♔</span> ' : '') + (m.nickname || '') + '</div><div class="tm-mstat">' + (done ? (revealMode ? 'พร้อม' : 'พร้อม ✓') : (revealMode ? 'กำลังดู..' : 'กำลังเลือก..')) + '</div>';
+      var SC = '/Main-Lobby/IMAGE/Showcard/';
+      var crown = m.isHost ? '<span class="tm-crown"><img src="' + SC + 'host-icon.png" alt=""></span>' : '';
+      var stat = done
+        ? '<img src="' + SC + 'ready-icon.png" alt=""> พร้อม'
+        : '<img src="' + SC + 'loading.png" alt=""> ' + (revealMode ? 'กำลังดู..' : 'กำลังเลือก..');
+      d.innerHTML = '<div class="tm-mname">' + crown + (m.nickname || '') + '</div><div class="tm-mstat">' + stat + '</div>';
       root.appendChild(d);
     });
   }
@@ -4237,10 +4341,11 @@
     if (trialMode) {
       trialMode = null; myTrialVote = null; trialVoteCounts = [0, 0, 0];
       if (ov) ov.classList.remove('suspect-pick--trial', 'trial-revealed');
-      document.querySelectorAll('.suspect-card').forEach(function (c) { c.classList.remove('suspect-card--myvote', 'suspect-card--culprit'); });
+      document.querySelectorAll('.suspect-card').forEach(function (c) { c.classList.remove('suspect-card--myvote', 'suspect-card--culprit', 'suspect-card--innocent'); });
       document.querySelectorAll('.trial-vote-badge').forEach(function (b) { b.textContent = ''; });
       var banner = document.getElementById('trial-result-banner'); if (banner) banner.style.display = 'none';
       var rb = document.getElementById('trial-reveal-btn'); if (rb) rb.style.display = 'none';
+      var loseEl = document.getElementById('trial-lose-txt'); if (loseEl) loseEl.style.display = 'none';
     }
     const wrap = document.getElementById('suspect-pick-scale-wrap');
     const inner = wrap && wrap.querySelector('.suspect-pick-inner');