From 24d0eaea1327b26c94be1a845545b7d5a6e4a0af Mon Sep 17 00:00:00 2001
From: seo <seo@chaegeon.com>
Date: Sun, 12 Jul 2026 14:58:22 +0900
Subject: [PATCH] =?UTF-8?q?=EC=B2=B4=EB=A5=98=EC=A4=91=20=EB=B0=B0?=
 =?UTF-8?q?=EC=A7=80=20=EC=B4=88=EC=83=81=ED=99=94=20=EC=9C=84=20=EB=B0=B0?=
 =?UTF-8?q?=EC=B9=98=20=EB=B3=B4=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 js/main.js | 19 +++++++++----------
 1 file changed, 9 insertions(+), 10 deletions(-)

diff --git a/js/main.js b/js/main.js
index dd32ea0..76ef9f0 100644
--- a/js/main.js
+++ b/js/main.js
@@ -483,6 +483,10 @@ const PLAYBACK_MIN_VISIBLE_STEPS = 80;
 const PLAYBACK_TICK_MS = 160;
 const STAY_MIN_SECONDS = 10 * 60;
 const STAY_GROUP_RADIUS_M = 100;
+const FACE_MARKER_SIZE = 60;
+const CURRENT_STAY_BADGE_WIDTH = 140;
+const CURRENT_STAY_BADGE_HEIGHT = 28;
+const CURRENT_STAY_BADGE_GAP = 8;
 
 const FALLBACK_BACK_TARGET = 'https://chaegeon.com/';
 const BACK_HISTORY_KEY = 'chaegeon.backHistory.v1';
@@ -2228,7 +2232,7 @@ function moveSelectedHistoryPoint(index, pan = false, syncSlider = true) {
     }
 }
 
-function createFaceMarkerIcon(size = 60) {
+function createFaceMarkerIcon(size = FACE_MARKER_SIZE) {
     const half = size / 2;
     return {
         content: `<div style="width:${size}px; height:${size}px; background:url('https://chaegeon.com/custom/findmydevice/img/30c0fc9d9.png') no-repeat center/contain;"></div>`,
@@ -2237,16 +2241,11 @@ function createFaceMarkerIcon(size = 60) {
 }
 
 function createCurrentStayIcon(text) {
-    const wrapStyle = [
-        'position:relative',
-        'width:0',
-        'height:0',
-        'pointer-events:none',
-        'transform:translate(-50%,-82px)'
-    ].join(';');
+    const anchorX = CURRENT_STAY_BADGE_WIDTH / 2;
+    const anchorY = (FACE_MARKER_SIZE / 2) + CURRENT_STAY_BADGE_GAP + CURRENT_STAY_BADGE_HEIGHT;
     return {
-        content: `<div class="current-stay-badge-wrap" style="${wrapStyle}"><div class="history-marker history-marker-stay current-stay-badge">${text}</div></div>`,
-        anchor: new naver.maps.Point(0, 0)
+        content: `<div class="history-marker history-marker-stay current-stay-badge">${text}</div>`,
+        anchor: new naver.maps.Point(anchorX, anchorY)
     };
 }