From ab2ff0badc7cf30f4707d0ac9d5f1717657ab006 Mon Sep 17 00:00:00 2001
From: giteaadmin <giteaadmin@localhost>
Date: Tue, 9 Jun 2026 09:10:26 +0000
Subject: [PATCH] minigame 2 design update

---
 www/html/Game/public/play.html | 49 ++++++++++++++++++++++++++++------
 1 file changed, 41 insertions(+), 8 deletions(-)

diff --git a/www/html/Game/public/play.html b/www/html/Game/public/play.html
index b517701..77c1534 100644
--- a/www/html/Game/public/play.html
+++ b/www/html/Game/public/play.html
@@ -2794,9 +2794,7 @@
       height: 34px;
       object-fit: contain;
       image-rendering: pixelated;
-      border: 1px solid rgba(0, 255, 240, 0.35);
       border-radius: 2px;
-      background: rgba(0, 20, 30, 0.9);
     }
     .play-cyber-score-mid {
       display: flex;
@@ -3648,6 +3646,40 @@
       align-self: unset !important;
       margin: 0 !important;
     }
+    html #play-cyber-hud.play-cyber-hud.play-cyber-hud--quiz-tf-mock[data-mission-mock-skin="gauntlet_crown"] .play-cyber-profile-frame {
+      background: none !important;
+      background-image: none !important;
+      overflow: visible !important;
+    }
+    html #play-cyber-hud.play-cyber-hud.play-cyber-hud--quiz-tf-mock[data-mission-mock-skin="gauntlet_crown"] .play-cyber-portrait-clip {
+      display: block !important;
+      position: absolute !important;
+      left: 49px !important;
+      top: 49px !important;
+      width: 104px !important;
+      height: 104px !important;
+      overflow: hidden !important;
+      border-radius: 8px !important;
+      background: transparent !important;
+      border: none !important;
+      z-index: 1 !important;
+      pointer-events: none !important;
+    }
+    html #play-cyber-hud.play-cyber-hud.play-cyber-hud--quiz-tf-mock[data-mission-mock-skin="gauntlet_crown"] .play-cyber-profile-frame .play-cyber-portrait-img {
+      position: absolute !important;
+      inset: 0 !important;
+      width: 100% !important;
+      height: 100% !important;
+      max-width: 100% !important;
+      max-height: 100% !important;
+      object-fit: cover !important;
+      object-position: center 40% !important;
+      transform: scale(0.92) translateY(-3px) !important;
+      transform-origin: center center !important;
+      border-radius: 8px !important;
+      background: transparent !important;
+      z-index: 1 !important;
+    }
     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;
@@ -3774,12 +3806,13 @@
       position: absolute;
       inset: 0;
       width: 100%;
-      height: 100%;
-      object-fit: cover;
-      object-position: 50% 32%;
-      border-radius: 6px;
-      /* portrait 120×120 หัวอยู่บน → ดันหัวให้อยู่กลางกรอบ ตรงกับ avatar ในกล่อง summary (gcm-av) ที่หัวกลางสวย */
-      transform: scale(0.9) translateY(-3px);
+      height: auto;
+      object-fit: contain;
+      object-position: center center;
+      border-radius: 3px;
+      border: none;
+      background: transparent;
+      transform: scale(0.81) 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 {