{"id":24,"date":"2026-02-17T23:40:21","date_gmt":"2026-02-17T23:40:21","guid":{"rendered":"https:\/\/yonggary.synology.me\/?page_id=24"},"modified":"2026-03-11T15:43:09","modified_gmt":"2026-03-11T06:43:09","slug":"elementor-24","status":"publish","type":"page","link":"https:\/\/yonggary.synology.me\/","title":{"rendered":"home"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"24\" class=\"elementor elementor-24\">\n\t\t\t\t<div class=\"elementor-element elementor-element-fe837c9 e-flex e-con-boxed e-con e-parent\" data-id=\"fe837c9\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8b618a0 elementor-widget elementor-widget-html\" data-id=\"8b618a0\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<script type=\"text\/javascript\" src=\"\/\/dapi.kakao.com\/v2\/maps\/sdk.js?appkey=4a151fac52549474cf57c54b35a0b127\"><\/script>\n\n<style>\n    #map-container { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; z-index: 10; }\n\n    .custom-pin { position: relative; width: 70px; height: 70px; cursor: pointer; }\n    .pin-thumb-box { width: 100%; height: 100%; border-radius: 12px; overflow: hidden; background: #fff; box-shadow: 0 2px 10px rgba(0,0,0,0.3); box-sizing: border-box; }\n    .pin-thumb-box img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 6px; }\n    .custom-pin.lost .pin-thumb-box  { border: 6px solid #ff0000; }\n    .custom-pin.found .pin-thumb-box { border: 6px solid #2d8cff; }\n    .custom-pin::after { content: ''; position: absolute; bottom: -10px; left: 50%; transform: translateX(-50%); width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; }\n    .custom-pin.lost::after  { border-top: 12px solid #ff0000; }\n    .custom-pin.found::after { border-top: 12px solid #2d8cff; }\n\n    .map-controls-container { position: fixed; top: 20px; right: 20px; z-index: 10000; display: flex; flex-direction: column; gap: 10px; pointer-events: none; }\n    .map-controls-container .map-btn { width: 45px; height: 45px; background: #fff; border: 1px solid rgba(0,0,0,0.1); border-radius: 8px; cursor: pointer; display: flex; align-items: center; justify-content: center; box-shadow: 0 2px 6px rgba(0,0,0,0.3); transition: all 0.2s; pointer-events: auto; }\n    .map-controls-container .map-btn.active { background-color: #ff4757 !important; }\n    .map-controls-container .map-btn.active svg path { stroke: white; fill: none; }\n    .map-controls-container .map-btn.active svg line,\n    .map-controls-container .map-btn.active svg circle { stroke: white; }\n\n    #center-pin-wrapper { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -100%); z-index: 5000; cursor: pointer; display: none; flex-direction: column; align-items: center; }\n    .pin-main-icon { background: #ff4757; padding: 8px; border-radius: 12px; box-shadow: 0 4px 10px rgba(0,0,0,0.3); display: flex; justify-content: center; align-items: center; position: relative; }\n    .pin-main-icon::after { content: ''; position: absolute; bottom: -10px; left: 50%; transform: translateX(-50%); width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-top: 10px solid #ff4757; }\n\n    .modal-overlay { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: rgba(0,0,0,0.6); z-index: 20000; display: none; justify-content: center; align-items: center; }\n    .modal-content { background: white; width: 90%; max-width: 460px; border-radius: 20px; padding: 20px; position: relative; box-shadow: 0 10px 30px rgba(0,0,0,0.5); max-height: 90vh; overflow-y: auto; box-sizing: border-box; }\n    .close-btn { position: absolute; top: 15px; right: 15px; width: 34px; height: 34px; background: #222; color: white; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 20px; font-weight: bold; cursor: pointer; line-height: 0; z-index: 30000; }\n\n    .multi-upload-grid { display: flex; flex-direction: row; gap: 6px; height: 110px; margin-top: 10px; margin-bottom: 14px; }\n    .upload-cell { background: #f0f2f5; border: 2px dashed #ccc; border-radius: 8px; display: flex; justify-content: center; align-items: center; cursor: pointer; overflow: hidden; position: relative; transition: background 0.2s; flex: 1; }\n    .upload-cell:first-child { flex: 2; }\n    .upload-cell:hover { background: #e8eaf0; }\n    .upload-cell img { width: 100%; height: 100%; object-fit: cover; display: none; }\n    .upload-cell .cell-placeholder { display: flex; flex-direction: column; align-items: center; gap: 3px; color: #888; text-align: center; padding: 4px; }\n    .upload-cell:first-child .cell-placeholder .ph-icon { font-size: 22px; }\n    .upload-cell:first-child .cell-placeholder .ph-label { font-size: 13px; font-weight: 700; color: #555; }\n    .upload-cell:not(:first-child) .cell-placeholder .ph-icon { font-size: 24px; color: #bbb; }\n    .upload-cell:not(:first-child) .cell-placeholder .ph-label { display: none; }\n    .upload-cell.has-image .cell-placeholder { display: none; }\n    .upload-cell.has-image img { display: block; }\n    .upload-cell .remove-btn { display: none; position: absolute; top: 3px; right: 3px; width: 20px; height: 20px; background: rgba(0,0,0,0.55); color: white; border-radius: 50%; font-size: 13px; line-height: 20px; text-align: center; cursor: pointer; z-index: 2; }\n    .upload-cell.has-image .remove-btn { display: block; }\n\n    .field-row { display: flex; align-items: flex-start; gap: 8px; margin-bottom: 9px; width: 100%; box-sizing: border-box; }\n    .field-row .field-label { font-size: 12px; font-weight: 700; color: #555; white-space: nowrap; min-width: 62px; padding-top: 9px; flex-shrink: 0; }\n    .field-row .field-inputs { flex: 1; display: flex; flex-direction: column; gap: 5px; min-width: 0; }\n    .field-row input, .field-row textarea { width: 100%; padding: 8px 10px; border: 1px solid #ddd; border-radius: 7px; box-sizing: border-box; font-size: 14px; }\n    .field-row textarea { resize: vertical; min-height: 60px; }\n    .latlng-row { display: flex; gap: 6px; width: 100%; }\n    .latlng-row input { flex: 1; min-width: 0; }\n\n    .save-row { display: flex; align-items: center; gap: 8px; margin-top: 6px; }\n    .save-row input[type=\"password\"] { flex: 1; padding: 13px 10px; border: 1px solid #ddd; border-radius: 12px; font-size: 14px; box-sizing: border-box; }\n    .save-btn { padding: 13px 20px; background: #2d8cff; color: white; border: none; border-radius: 12px; font-weight: bold; cursor: pointer; font-size: 15px; white-space: nowrap; }\n\n    #info-overlay { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: rgba(0,0,0,0.65); z-index: 50000; display: none; justify-content: center; align-items: center; }\n    #info-overlay.show { display: flex; }\n    .info-card { background: white; width: 92%; max-width: 420px; border-radius: 16px; overflow: hidden; box-shadow: 0 20px 60px rgba(0,0,0,0.5); animation: slideUp 0.22s ease; max-height: 90vh; overflow-y: auto; }\n    @keyframes slideUp { from { transform: translateY(30px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }\n    .info-photo-area { display: flex; flex-direction: row; width: 100%; background: #000; position: relative; }\n    .info-main-photo { flex: 1; min-width: 0; cursor: pointer; overflow: hidden; }\n    .info-main-photo img { width: 100%; height: 220px; object-fit: cover; display: block; }\n    .info-thumb-col { display: flex; flex-direction: column; gap: 2px; width: 72px; flex-shrink: 0; background: #111; }\n    .info-thumb-item { width: 72px; overflow: hidden; cursor: pointer; flex-shrink: 0; }\n    .info-thumb-item img { width: 100%; height: 72px; object-fit: cover; display: block; opacity: 0.65; transition: opacity 0.15s; }\n    .info-thumb-item:hover img, .info-thumb-item.active img { opacity: 1; }\n    .info-thumb-item.active { outline: 2px solid #fff; outline-offset: -2px; }\n    .info-close-float { position: absolute; top: 8px; right: 8px; width: 32px; height: 32px; background: rgba(0,0,0,0.55); border: none; border-radius: 50%; color: white; font-size: 16px; cursor: pointer; display: flex; align-items: center; justify-content: center; z-index: 2; }\n    .info-title-row { display: flex; align-items: center; justify-content: space-between; padding: 12px 14px 6px; }\n    .info-name { font-size: 24px; font-weight: 900; color: #111; flex: 1; }\n    .info-status-badge { font-size: 14px; font-weight: 900; padding: 5px 12px; border-radius: 20px; color: white; white-space: nowrap; margin-left: 8px; }\n    .info-status-badge.lost  { background: #ff0000; }\n    .info-status-badge.found { background: #2d8cff; }\n    .info-body { padding: 0 14px 14px; }\n    .info-detail-row { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 8px; font-size: 16px; color: #222; }\n    .info-detail-row .lbl { font-weight: 800; color: #888; min-width: 60px; font-size: 13px; padding-top: 2px; flex-shrink: 0; }\n    .info-footer { padding: 10px 14px 14px; }\n    .info-delete-btn { background: none; border: 1px solid #aaa; color: #555; font-size: 13px; font-weight: 600; padding: 7px 16px; border-radius: 8px; cursor: pointer; }\n    .info-delete-btn:hover { border-color: #e00; color: #e00; }\n\n    #pw-popup { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: rgba(0,0,0,0.5); z-index: 70000; display: none; justify-content: center; align-items: center; }\n    #pw-popup.show { display: flex; }\n    .pw-box { background: #fff; border-radius: 14px; padding: 24px; width: 85%; max-width: 320px; box-shadow: 0 10px 40px rgba(0,0,0,0.3); }\n    .pw-box h3 { margin: 0 0 14px; font-size: 16px; }\n    .pw-box input { width: 100%; padding: 10px; border: 1px solid #ddd; border-radius: 8px; font-size: 15px; box-sizing: border-box; margin-bottom: 10px; }\n    .pw-box-error { color: #e00; font-size: 13px; min-height: 18px; margin-bottom: 8px; }\n    .pw-box-btns { display: flex; gap: 8px; justify-content: flex-end; }\n    .pw-box-btns button { padding: 8px 18px; border: none; border-radius: 8px; cursor: pointer; font-size: 14px; font-weight: 600; }\n    .pw-cancel  { background: #eee; color: #333; }\n    .pw-confirm { background: #e00; color: #fff; }\n\n    #photo-viewer { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: rgba(0,0,0,0.95); z-index: 60000; display: none; justify-content: center; align-items: center; flex-direction: column; overflow: hidden; }\n    #photo-viewer.show { display: flex; }\n    #photo-viewer img { max-width: 95vw; max-height: 80vh; object-fit: contain; border-radius: 8px; }\n    #photo-viewer-close { position: absolute; top: 20px; right: 20px; width: 44px; height: 44px; background: rgba(255,255,255,0.15); border: none; border-radius: 50%; color: white; font-size: 24px; cursor: pointer; display: flex; align-items: center; justify-content: center; z-index: 2; }\n    #photo-viewer-counter { color: #fff; font-size: 28px; font-weight: 900; margin-top: 20px; letter-spacing: 2px; }\n    .info-title-actions { display: flex; align-items: center; gap: 6px; flex-shrink: 0; margin-left: 8px; }\n    .info-action-btn { background: none; border: none; padding: 4px; cursor: pointer; display: flex; align-items: center; justify-content: center; border-radius: 6px; }\n    .info-action-btn:hover { background: #f0f0f0; }\n\n    #bm-overlay { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: rgba(0,0,0,0.65); z-index: 50000; display: none; justify-content: center; align-items: center; }\n    #bm-overlay.show { display: flex; }\n    .bm-card { background: white; width: 92%; max-width: 420px; min-height: 400px; border-radius: 16px; overflow: hidden; box-shadow: 0 20px 60px rgba(0,0,0,0.5); animation: slideUp 0.22s ease; max-height: 90vh; overflow-y: auto; display: flex; flex-direction: column; }\n    .bm-list { flex: 1; }\n    .bm-empty { padding: 40px 20px; text-align: center; color: #aaa; font-size: 15px; }\n    .bm-item { display: flex; align-items: center; gap: 12px; padding: 10px 16px; cursor: pointer; border-bottom: 1px solid #f5f5f5; transition: background 0.15s; }\n    .bm-item:hover { background: #f9f9f9; }\n    .bm-item:last-child { border-bottom: none; }\n    .bm-item-thumb { display: none; }\n    .bm-item-info { flex: 1; min-width: 0; }\n    .bm-item-name { font-size: 15px; font-weight: 700; color: #111; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n    .bm-item-date { font-size: 12px; color: #aaa; margin-top: 2px; }\n    .bm-item-bm-icon { flex-shrink: 0; display: flex; align-items: center; }\n\n    #share-popup { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: rgba(0,0,0,0.5); z-index: 70000; display: none; justify-content: center; align-items: center; }\n    #share-popup.show { display: flex; }\n    .share-box { background: #fff; border-radius: 16px; padding: 22px 20px 18px; width: 88%; max-width: 360px; box-shadow: 0 10px 40px rgba(0,0,0,0.3); }\n    .share-box-title { font-size: 16px; font-weight: 900; margin: 0 0 14px; }\n    .share-link-row { display: flex; gap: 8px; align-items: center; margin-bottom: 14px; }\n    .share-link-input { flex: 1; padding: 9px 10px; border: 1px solid #ddd; border-radius: 8px; font-size: 12px; color: #555; background: #f8f8f8; outline: none; min-width: 0; }\n    .share-copy-btn { padding: 9px 14px; background: #2d8cff; color: white; border: none; border-radius: 8px; font-size: 13px; font-weight: 700; cursor: pointer; white-space: nowrap; flex-shrink: 0; }\n    .share-copy-btn:active { background: #1a7ae0; }\n    .share-copy-msg { font-size: 13px; color: #2d8cff; font-weight: 700; min-height: 18px; margin-bottom: 10px; text-align: center; }\n    .share-native-btn { width: 100%; padding: 11px; background: #f0f0f0; color: #333; border: none; border-radius: 10px; font-size: 14px; font-weight: 700; cursor: pointer; margin-bottom: 8px; display: flex; align-items: center; justify-content: center; gap: 8px; }\n    .share-native-btn:active { background: #e0e0e0; }\n    .share-cancel-btn { width: 100%; padding: 10px; background: none; color: #aaa; border: none; font-size: 14px; cursor: pointer; }\n    \n    \n<\/style>\n\n<div id=\"map-container\"><\/div>\n\n<div id=\"center-pin-wrapper\" onclick=\"openPopup()\">\n    <div class=\"pin-main-icon\">\n        <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 64 64\" width=\"40\" height=\"40\">\n          <path d=\"M 10,42 Q 8,28 12,20 L 10,8 22,16 Q 26,12 32,12 Q 38,12 42,16 L 54,8 52,20 Q 56,28 54,42 Q 52,56 32,57 Q 12,56 10,42 Z\" fill=\"none\" stroke=\"white\" stroke-width=\"4\" stroke-linejoin=\"round\" stroke-linecap=\"round\"\/>\n          <circle cx=\"23\" cy=\"32\" r=\"4.5\" fill=\"white\"\/><circle cx=\"41\" cy=\"32\" r=\"4.5\" fill=\"white\"\/><circle cx=\"32\" cy=\"40\" r=\"2.5\" fill=\"white\"\/>\n          <line x1=\"2\" y1=\"37\" x2=\"20\" y2=\"39\" stroke=\"white\" stroke-width=\"3\" stroke-linecap=\"round\"\/>\n          <line x1=\"2\" y1=\"43\" x2=\"20\" y2=\"42\" stroke=\"white\" stroke-width=\"3\" stroke-linecap=\"round\"\/>\n          <line x1=\"62\" y1=\"37\" x2=\"44\" y2=\"39\" stroke=\"white\" stroke-width=\"3\" stroke-linecap=\"round\"\/>\n          <line x1=\"62\" y1=\"43\" x2=\"44\" y2=\"42\" stroke=\"white\" stroke-width=\"3\" stroke-linecap=\"round\"\/>\n        <\/svg>\n    <\/div>\n<\/div>\n\n<div id=\"input-popup\" class=\"modal-overlay\">\n    <div class=\"modal-content\">\n        <div class=\"close-btn\" onclick=\"closePopup()\">&times;<\/div>\n        <h3 style=\"margin:0 0 10px 0; font-size:16px;\">\uc815\ubcf4 \ub4f1\ub85d<\/h3>\n        <div class=\"multi-upload-grid\" id=\"upload-grid\"><\/div>\n        <input type=\"file\" id=\"file-input-shared\" accept=\"image\/*\" style=\"display:none;\" onchange=\"handleMultiImage(this)\">\n        <div class=\"field-row\">\n            <span class=\"field-label\">\uc774\ub984<\/span>\n            <div class=\"field-inputs\"><input type=\"text\" id=\"name-field\"><\/div>\n        <\/div>\n        <div class=\"field-row\">\n            <span class=\"field-label\">\uc2e4\uc885 \uc77c\uc2dc<\/span>\n            <div class=\"field-inputs\"><input type=\"text\" id=\"date-field\"><\/div>\n        <\/div>\n        <div class=\"field-row\">\n            <span class=\"field-label\">\uc2e4\uc885 \uc704\uce58<\/span>\n            <div class=\"field-inputs\">\n                <div class=\"latlng-row\">\n                    <input type=\"text\" id=\"lat-field\" placeholder=\"\uc704\ub3c4\">\n                    <input type=\"text\" id=\"lng-field\" placeholder=\"\uacbd\ub3c4\">\n                <\/div>\n            <\/div>\n        <\/div>\n        <div class=\"field-row\">\n            <span class=\"field-label\">\uc5f0\ub77d\ucc98<\/span>\n            <div class=\"field-inputs\">\n                <input type=\"tel\" id=\"pet_tel\" placeholder=\"TEL\">\n                <input type=\"url\" id=\"pet_url\" placeholder=\"URL\">\n            <\/div>\n        <\/div>\n        <div class=\"field-row\">\n            <span class=\"field-label\">\ud2b9\uc774\uc0ac\ud56d<\/span>\n            <div class=\"field-inputs\"><textarea id=\"memo-field\"><\/textarea><\/div>\n        <\/div>\n        <div class=\"save-row\">\n            <input type=\"password\" id=\"pet_password\" placeholder=\"\ud83d\udd12 \uc0ad\uc81c\uc6a9 \ube44\ubc00\ubc88\ud638\">\n            <button id=\"save-btn\" class=\"save-btn\" onclick=\"saveData()\">\ub4f1\ub85d \uc644\ub8cc<\/button>\n        <\/div>\n    <\/div>\n<\/div>\n\n<div class=\"map-controls-container\">\n    <!-- \uc704\uce58 -->\n    <div class=\"map-btn\" onclick=\"getCurrentLocation()\">\n        <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\n            <path d=\"M12 2C8.13 2 5 5.13 5 9C5 14.25 12 22 12 22C12 22 19 14.25 19 9C19 5.13 15.87 2 12 2ZM12 11.5C10.62 11.5 9.5 10.38 9.5 9C9.5 7.62 10.62 6.5 12 6.5C13.38 6.5 14.5 7.62 14.5 9C14.5 10.38 13.38 11.5 12 11.5Z\" fill=\"#333\"\/>\n        <\/svg>\n    <\/div>\n    <!-- \uc2e4\uc885 \ub4f1\ub85d -->\n    <div class=\"map-btn\" id=\"lost-btn\" onclick=\"toggleLostMode()\">\n        <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 64 64\" width=\"30\" height=\"30\">\n          <path d=\"M 10,42 Q 8,28 12,20 L 10,8 22,16 Q 26,12 32,12 Q 38,12 42,16 L 54,8 52,20 Q 56,28 54,42 Q 52,56 32,57 Q 12,56 10,42 Z\" fill=\"none\" stroke=\"black\" stroke-width=\"4\" stroke-linejoin=\"round\" stroke-linecap=\"round\"\/>\n          <circle cx=\"23\" cy=\"32\" r=\"4.5\" fill=\"black\"\/><circle cx=\"41\" cy=\"32\" r=\"4.5\" fill=\"black\"\/><circle cx=\"32\" cy=\"40\" r=\"2.5\" fill=\"black\"\/>\n        <\/svg>\n    <\/div>\n    <!-- \ubd81\ub9c8\ud06c: \ucc44\uc6cc\uc9c4 -->\n    <div class=\"map-btn\" id=\"bookmark-btn\" onclick=\"openBmOverlay()\">\n        <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M17 3H7c-1.1 0-1.99.9-1.99 2L5 21l7-3 7 3V5c0-1.1-.9-2-2-2z\" fill=\"#333\"\/><\/svg>\n    <\/div>\n    <!-- \ubaa9\ub85d -->\n    <div class=\"map-btn\" id=\"list-btn\">\n        <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M3 13h2v-2H3v2zm0 4h2v-2H3v2zm0-8h2V7H3v2zm4 4h14v-2H7v2zm0 4h14v-2H7v2zM7 7v2h14V7H7z\" fill=\"#333\"\/><\/svg>\n    <\/div>\n<\/div>\n\n<div id=\"info-overlay\" onclick=\"closeInfoOverlay(event)\">\n    <div class=\"info-card\" id=\"info-card\"><\/div>\n<\/div>\n\n\n<div id=\"bm-overlay\" onclick=\"closeBmOverlay(event)\">\n    <div class=\"bm-card\" id=\"bm-card\"><\/div>\n<\/div>\n\n<div id=\"share-popup\" onclick=\"closeSharePopup(event)\">\n    <div class=\"share-box\">\n        <p class=\"share-box-title\">\uacf5\uc720<\/p>\n        <div class=\"share-link-row\">\n            <input class=\"share-link-input\" id=\"share-link-input\" readonly>\n            <button class=\"share-copy-btn\" onclick=\"copyShareLink()\">\ubcf5\uc0ac<\/button>\n        <\/div>\n        <div class=\"share-copy-msg\" id=\"share-copy-msg\"><\/div>\n        <button class=\"share-native-btn\" id=\"share-native-btn\" onclick=\"nativeShare()\">\n            <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#333\" stroke-width=\"2.2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"18\" cy=\"5\" r=\"3\"\/><circle cx=\"6\" cy=\"12\" r=\"3\"\/><circle cx=\"18\" cy=\"19\" r=\"3\"\/><line x1=\"8.59\" y1=\"13.51\" x2=\"15.42\" y2=\"17.49\"\/><line x1=\"15.41\" y1=\"6.51\" x2=\"8.59\" y2=\"10.49\"\/><\/svg>\n            \ub2e4\ub978 \uc571\uc73c\ub85c \uacf5\uc720\n        <\/button>\n        <button class=\"share-cancel-btn\" onclick=\"closeSharePopup()\">\ub2eb\uae30<\/button>\n    <\/div>\n<\/div>\n\n<div id=\"pw-popup\">\n    <div class=\"pw-box\">\n        <h3>\ube44\ubc00\ubc88\ud638 \ud655\uc778<\/h3>\n        <input type=\"password\" id=\"pw-input\" placeholder=\"\ube44\ubc00\ubc88\ud638\">\n        <div class=\"pw-box-error\" id=\"pw-error\"><\/div>\n        <div class=\"pw-box-btns\">\n            <button class=\"pw-cancel\" onclick=\"closePwPopup()\">\ucde8\uc18c<\/button>\n            <button class=\"pw-confirm\" onclick=\"confirmDelete()\">\uc0ad\uc81c<\/button>\n        <\/div>\n    <\/div>\n<\/div>\n\n<div id=\"photo-viewer\">\n    <button id=\"photo-viewer-close\" onclick=\"closePhotoViewer()\">\u2715<\/button>\n    <img decoding=\"async\" id=\"photo-viewer-img\" src=\"\" alt=\"\">\n    <div id=\"photo-viewer-counter\"><\/div>\n<\/div>\n\n<script>\n    var map = new kakao.maps.Map(document.getElementById('map-container'), {\n        center: new kakao.maps.LatLng(37.566826, 126.9786567),\n        level: 3\n    });\n    var locMarker;\n    var isSubmitting = false;\n\n    if (navigator.geolocation) {\n        navigator.geolocation.getCurrentPosition(function(pos) {\n            var lp = new kakao.maps.LatLng(pos.coords.latitude, pos.coords.longitude);\n            map.setCenter(lp);\n            locMarker = new kakao.maps.Marker({ map: map, position: lp });\n        }, function() {});\n    }\n\n    var MAX_PHOTOS = 4;\n    var uploadFiles = [null, null, null, null];\n    var currentCellIndex = -1;\n\n    function buildUploadGrid() {\n        var grid = document.getElementById('upload-grid');\n        grid.innerHTML = '';\n        for (var i = 0; i < MAX_PHOTOS; i++) {\n            (function(idx) {\n                var cell = document.createElement('div');\n                cell.className = 'upload-cell';\n                cell.dataset.index = idx;\n                cell.innerHTML =\n                    '<img decoding=\"async\" id=\"cell-img-' + idx + '\" src=\"\">' +\n                    '<div class=\"cell-placeholder\">' +\n                        '<span class=\"ph-icon\">' + (idx === 0 ? '\ud83d\udcf8' : '\uff0b') + '<\/span>' +\n                        '<span class=\"ph-label\">' + (idx === 0 ? '\ub300\ud45c \uc0ac\uc9c4' : '') + '<\/span>' +\n                    '<\/div>' +\n                    '<div class=\"remove-btn\" onclick=\"removePhoto(event,' + idx + ')\">\u2715<\/div>';\n                cell.onclick = function(e) {\n                    if (e.target.classList.contains('remove-btn')) return;\n                    currentCellIndex = idx;\n                    document.getElementById('file-input-shared').click();\n                };\n                grid.appendChild(cell);\n            })(i);\n        }\n    }\n    buildUploadGrid();\n\n    function handleMultiImage(input) {\n        if (!input.files || !input.files[0] || currentCellIndex < 0) return;\n        var file = input.files[0];\n        uploadFiles[currentCellIndex] = file;\n        var reader = new FileReader();\n        reader.onload = function(e) {\n            document.getElementById('cell-img-' + currentCellIndex).src = e.target.result;\n            document.querySelector('.upload-cell[data-index=\"' + currentCellIndex + '\"]').classList.add('has-image');\n        };\n        reader.readAsDataURL(file);\n        input.value = '';\n    }\n\n    function removePhoto(e, index) {\n        e.stopPropagation();\n        uploadFiles[index] = null;\n        document.getElementById('cell-img-' + index).src = '';\n        document.querySelector('.upload-cell[data-index=\"' + index + '\"]').classList.remove('has-image');\n    }\n\n    function toggleLostMode() {\n        var btn = document.getElementById('lost-btn');\n        var pin = document.getElementById('center-pin-wrapper');\n        var active = btn.classList.toggle('active');\n        pin.style.display = active ? 'flex' : 'none';\n    }\n\n    function openPopup() {\n        var center = map.getCenter();\n        document.getElementById('lat-field').value = center.getLat().toFixed(7);\n        document.getElementById('lng-field').value = center.getLng().toFixed(7);\n        var now = new Date();\n        document.getElementById('date-field').value = now.getFullYear() + '\ub144 ' + (now.getMonth()+1) + '\uc6d4 ' + now.getDate() + '\uc77c ' + now.getHours() + '\uc2dc';\n        document.getElementById('input-popup').style.display = 'flex';\n    }\n\n    function resetPopup() {\n        uploadFiles = [null, null, null, null];\n        buildUploadGrid();\n        ['name-field','pet_tel','pet_url','memo-field','pet_password'].forEach(function(id) {\n            var el = document.getElementById(id); if (el) el.value = '';\n        });\n        document.getElementById('save-btn').innerText = '\ub4f1\ub85d \uc644\ub8cc';\n    }\n\n    function closePopup() {\n        document.getElementById('input-popup').style.display = 'none';\n        resetPopup();\n    }\n\n    function getOptimizedImage(file) {\n        return new Promise(function(resolve) {\n            var reader = new FileReader();\n            reader.readAsDataURL(file);\n            reader.onload = function(e) {\n                var img = new Image();\n                img.src = e.target.result;\n                img.onload = function() {\n                    var canvas = document.createElement('canvas');\n                    var maxW = 1000, w = img.width, h = img.height;\n                    if (w > maxW) { h = h * maxW \/ w; w = maxW; }\n                    canvas.width = w; canvas.height = h;\n                    canvas.getContext('2d').drawImage(img, 0, 0, w, h);\n                    canvas.toBlob(function(blob) {\n                        resolve(blob ? new File([blob], 'photo_' + Date.now() + '.webp', { type: 'image\/webp' }) : file);\n                    }, 'image\/webp', 0.8);\n                };\n                img.onerror = function() { resolve(file); };\n            };\n        });\n    }\n\n    async function saveData() {\n        if (isSubmitting) return;\n        var name     = document.getElementById('name-field').value.trim();\n        var date     = document.getElementById('date-field').value;\n        var lat      = document.getElementById('lat-field').value;\n        var lng      = document.getElementById('lng-field').value;\n        var pet_tel  = document.getElementById('pet_tel').value;\n        var pet_url  = document.getElementById('pet_url').value;\n        var memo     = document.getElementById('memo-field').value;\n        var password = document.getElementById('pet_password').value;\n        var validFiles = uploadFiles.filter(function(f) { return f !== null; });\n        if (!name || validFiles.length === 0) { alert('\uc774\ub984\uacfc \uc0ac\uc9c4\uc744 \ucd5c\uc18c 1\uc7a5 \uc774\uc0c1 \uc785\ub825\ud574\uc8fc\uc138\uc694.'); return; }\n        try {\n            isSubmitting = true;\n            document.getElementById('save-btn').innerText = '\uc804\uc1a1 \uc911...';\n            var formData = new FormData();\n            formData.append('name', name);\n            formData.append('date', date);\n            formData.append('lat', lat);\n            formData.append('lng', lng);\n            formData.append('pet_tel', pet_tel);\n            formData.append('pet_url', pet_url);\n            formData.append('pet_memo', memo);\n            formData.append('pet_password', password);\n            for (var i = 0; i < validFiles.length; i++) {\n                var opt = await getOptimizedImage(validFiles[i]);\n                formData.append('file_' + i, opt);\n            }\n            var headers = {};\n            if (typeof isLoggedIn !== 'undefined' && isLoggedIn && wpNonce) {\n                headers['X-WP-Nonce'] = wpNonce;\n            }\n            var res = await fetch('https:\/\/yonggary.synology.me\/index.php?rest_route=\/map\/v1\/save', {\n                method: 'POST',\n                body: formData,\n                headers: headers\n            });\n            if (res.ok) {\n                alert('\uc131\uacf5\uc801\uc73c\ub85c \ub4f1\ub85d\ub418\uc5c8\uc2b5\ub2c8\ub2e4!' + (typeof isLoggedIn !== 'undefined' && isLoggedIn ? ' (\uc989\uc2dc \uc2b9\uc778)' : ' \uad00\ub9ac\uc790 \uc2b9\uc778 \ud6c4 \uc9c0\ub3c4\uc5d0 \ud45c\uc2dc\ub429\ub2c8\ub2e4.'));\n                closePopup();\n                var lostBtn = document.getElementById('lost-btn');\n                if (lostBtn.classList.contains('active')) toggleLostMode();\n            } else {\n                throw new Error(await res.text() || '\uc804\uc1a1 \uc2e4\ud328');\n            }\n        } catch(err) {\n            alert('\uc624\ub958\uac00 \ubc1c\uc0dd\ud588\uc2b5\ub2c8\ub2e4: ' + err.message);\n        } finally {\n            isSubmitting = false;\n            document.getElementById('save-btn').innerText = '\ub4f1\ub85d \uc644\ub8cc';\n        }\n    }\n\n    function getCurrentLocation() {\n        if (!navigator.geolocation) return;\n        navigator.geolocation.getCurrentPosition(function(pos) {\n            var lp = new kakao.maps.LatLng(pos.coords.latitude, pos.coords.longitude);\n            if (locMarker) locMarker.setMap(null);\n            locMarker = new kakao.maps.Marker({ map: map, position: lp });\n            map.panTo(lp);\n        }, function() { alert('\uc704\uce58 \uc815\ubcf4\ub97c \uac00\uc838\uc62c \uc218 \uc5c6\uc2b5\ub2c8\ub2e4.'); });\n    }\n\n    function formatDate(raw) {\n        if (!raw) return '';\n        var s = String(raw).trim();\n        if (s.indexOf('\ub144') !== -1) return s;\n        var ms = s.match(\/^(\\d{1,2})\\\/(\\d{1,2})\\\/(\\d{4})\/);\n        if (ms) {\n            var a = parseInt(ms[1]), b = parseInt(ms[2]), y = ms[3];\n            return y + '\ub144 ' + (a > 12 ? b : a) + '\uc6d4 ' + (a > 12 ? a : b) + '\uc77c';\n        }\n        var my = s.match(\/^(\\d{4})\\\/(\\d{2})\\\/(\\d{2})\/);\n        if (my) return my[1] + '\ub144 ' + parseInt(my[2]) + '\uc6d4 ' + parseInt(my[3]) + '\uc77c';\n        var m8 = s.match(\/^(\\d{4})(\\d{2})(\\d{2})$\/);\n        if (m8) return m8[1] + '\ub144 ' + parseInt(m8[2]) + '\uc6d4 ' + parseInt(m8[3]) + '\uc77c';\n        var m8h = s.match(\/^(\\d{4})(\\d{2})(\\d{2})\\s+(\\d{1,2})$\/);\n        if (m8h) return m8h[1] + '\ub144 ' + parseInt(m8h[2]) + '\uc6d4 ' + parseInt(m8h[3]) + '\uc77c ' + m8h[4] + '\uc2dc';\n        var mi = s.match(\/^(\\d{4})-(\\d{2})-(\\d{2})\/);\n        if (mi) return mi[1] + '\ub144 ' + parseInt(mi[2]) + '\uc6d4 ' + parseInt(mi[3]) + '\uc77c';\n        return s;\n    }\n\n    var currentInfoPhotos = [];\n    var currentPhotoIndex = 0;\n    var currentDeleteId   = null;\n    var allPins = [];\n\n    function openInfoOverlay(pin) {\n        var statusClass = pin.pet_status === 'found' ? 'found' : 'lost';\n        var statusText  = pin.pet_status === 'found' ? '\ubc1c\uacac' : '\uc2e4\uc885';\n\n        var photos = [];\n        if (pin.images && Array.isArray(pin.images) && pin.images.length > 0) {\n            pin.images.forEach(function(src) { if (src) photos.push(src); });\n        } else if (pin.img) { photos.push(pin.img); }\n        currentInfoPhotos = photos;\n        currentPhotoIndex = 0;\n        currentDeleteId   = pin.id;\n\n        var photoAreaHtml = '';\n        if (photos.length > 0) {\n            var thumbsHtml = '';\n            if (photos.length > 1) {\n                thumbsHtml = '<div class=\"info-thumb-col\">';\n                for (var ti = 1; ti < Math.min(photos.length, 4); ti++) {\n                    thumbsHtml += '<div class=\"info-thumb-item\" id=\"thumb-' + ti + '\" onclick=\"selectInfoPhoto(' + ti + ')\"><img decoding=\"async\" src=\"' + photos[ti] + '\"><\/div>';\n                }\n                thumbsHtml += '<\/div>';\n            }\n            photoAreaHtml =\n                '<div class=\"info-photo-area\">' +\n                    '<div class=\"info-main-photo\" onclick=\"openPhotoViewer(currentPhotoIndex)\">' +\n                        '<img decoding=\"async\" id=\"info-main-img\" src=\"' + photos[0] + '\" alt=\"\">' +\n                    '<\/div>' +\n                    thumbsHtml +\n                    '<button class=\"info-close-float\" onclick=\"closeInfoOverlay()\">&#10005;<\/button>' +\n                '<\/div>';\n        } else {\n            photoAreaHtml = '<div style=\"position:relative;height:36px;\"><button class=\"info-close-float\" onclick=\"closeInfoOverlay()\">&#10005;<\/button><\/div>';\n        }\n\n        \/\/ \uc21c\uc11c: \uc2e4\uc885\uc77c\uc2dc \u2192 \uc704\uce58 \u2192 \uc804\ud654 \u2192 \ub9c1\ud06c \u2192 \uba54\ubaa8(\ub9e8 \uc544\ub798)\n        var rowsHtml = '';\n        var dateStr = formatDate(pin.date);\n        if (dateStr)         rowsHtml += '<div class=\"info-detail-row\"><span class=\"lbl\">\uc2e4\uc885\uc77c\uc2dc<\/span><span>' + dateStr + '<\/span><\/div>';\n        if (pin.lat && pin.lng) rowsHtml += '<div class=\"info-detail-row\"><span class=\"lbl\">\uc704\uce58<\/span><span>' + parseFloat(pin.lat).toFixed(5) + ', ' + parseFloat(pin.lng).toFixed(5) + '<\/span><\/div>';\n        if (pin.pet_tel)     rowsHtml += '<div class=\"info-detail-row\"><span class=\"lbl\">\uc804\ud654<\/span><a href=\"tel:' + pin.pet_tel + '\" style=\"color:#2d8cff;text-decoration:none;font-size:16px;\">' + pin.pet_tel + '<\/a><\/div>';\n        if (pin.pet_url)     rowsHtml += '<div class=\"info-detail-row\"><span class=\"lbl\">\ub9c1\ud06c<\/span><a href=\"' + pin.pet_url + '\" target=\"_blank\" rel=\"noopener\" style=\"color:#2d8cff;text-decoration:none;word-break:break-all;font-size:16px;\">' + pin.pet_url + '<\/a><\/div>';\n        if (pin.pet_memo)    rowsHtml += '<div class=\"info-detail-row\"><span class=\"lbl\">\uba54\ubaa8<\/span><span style=\"word-break:break-all;white-space:pre-wrap;\">' + pin.pet_memo + '<\/span><\/div>';\n\n        document.getElementById('info-card').innerHTML =\n            photoAreaHtml +\n            '<div class=\"info-title-row\">' +\n                '<span class=\"info-name\">' + (pin.name || '') + '<\/span>' +\n                '<div class=\"info-title-actions\">' +\n                    '<button class=\"info-action-btn\" title=\"\ubd81\ub9c8\ud06c\">' +\n                        '<svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#555\" stroke-width=\"2.2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M17 3H7c-1.1 0-2 .9-2 2v16l7-3 7 3V5c0-1.1-.9-2-2-2z\"\/><\/svg>' +\n                    '<\/button>' +\n                    '<button class=\"info-action-btn\" title=\"\uacf5\uc720\">' +\n                        '<svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#555\" stroke-width=\"2.2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"18\" cy=\"5\" r=\"3\"\/><circle cx=\"6\" cy=\"12\" r=\"3\"\/><circle cx=\"18\" cy=\"19\" r=\"3\"\/><line x1=\"8.59\" y1=\"13.51\" x2=\"15.42\" y2=\"17.49\"\/><line x1=\"15.41\" y1=\"6.51\" x2=\"8.59\" y2=\"10.49\"\/><\/svg>' +\n                    '<\/button>' +\n                    '<span class=\"info-status-badge ' + statusClass + '\">' + statusText + '<\/span>' +\n                '<\/div>' +\n            '<\/div>' +\n            '<div class=\"info-body\">' + rowsHtml + '<\/div>' +\n            '<div class=\"info-footer\">' +\n                '<button class=\"info-delete-btn\" onclick=\"openPwPopup()\">\uc0ad\uc81c<\/button>' +\n            '<\/div>';\n\n        document.getElementById('info-overlay').classList.add('show');\n    }\n\n    function selectInfoPhoto(idx) {\n        currentPhotoIndex = idx;\n        var mainImg = document.getElementById('info-main-img');\n        if (mainImg) mainImg.src = currentInfoPhotos[idx];\n        document.querySelectorAll('.info-thumb-item').forEach(function(el) {\n            el.classList.toggle('active', parseInt(el.id.replace('thumb-','')) === idx);\n        });\n    }\n\n    function closeInfoOverlay(e) {\n        if (e && e.target !== document.getElementById('info-overlay')) return;\n        document.getElementById('info-overlay').classList.remove('show');\n        if (window._bmReturnPending) {\n            window._bmReturnPending = false;\n            openBmOverlay();\n        }\n    }\n\n    function openPwPopup() {\n        document.getElementById('pw-input').value = '';\n        document.getElementById('pw-error').textContent = '';\n        document.getElementById('pw-popup').classList.add('show');\n        setTimeout(function() { document.getElementById('pw-input').focus(); }, 100);\n    }\n\n    function closePwPopup() {\n        document.getElementById('pw-popup').classList.remove('show');\n    }\n\n    async function confirmDelete() {\n        var pw = document.getElementById('pw-input').value;\n        if (!pw) { document.getElementById('pw-error').textContent = '\ube44\ubc00\ubc88\ud638\ub97c \uc785\ub825\ud574\uc8fc\uc138\uc694.'; return; }\n        try {\n            var res = await fetch('https:\/\/yonggary.synology.me\/index.php?rest_route=\/map\/v1\/delete', {\n                method: 'POST',\n                headers: { 'Content-Type': 'application\/json' },\n                body: JSON.stringify({ post_id: currentDeleteId, password: pw })\n            });\n            if (res.ok) {\n                closePwPopup();\n                document.getElementById('info-overlay').classList.remove('show');\n                alert('\uac8c\uc2dc\ubb3c\uc774 \uc0ad\uc81c\ub418\uc5c8\uc2b5\ub2c8\ub2e4.');\n                location.reload();\n            } else {\n                document.getElementById('pw-error').textContent = '\ube44\ubc00\ubc88\ud638\uac00 \uc77c\uce58\ud558\uc9c0 \uc54a\uc2b5\ub2c8\ub2e4.';\n            }\n        } catch(err) {\n            document.getElementById('pw-error').textContent = '\uc624\ub958\uac00 \ubc1c\uc0dd\ud588\uc2b5\ub2c8\ub2e4.';\n        }\n    }\n\n    var vStartX = 0, vStartY = 0, vDragging = false;\n    var viewer = document.getElementById('photo-viewer');\n    viewer.addEventListener('mousedown',  function(e) { vStartX = e.clientX; vStartY = e.clientY; vDragging = true; });\n    viewer.addEventListener('mouseup',    function(e) { if (!vDragging) return; vDragging = false; onViewerEnd(e.clientX, e.clientY); });\n    viewer.addEventListener('touchstart', function(e) { vStartX = e.touches[0].clientX; vStartY = e.touches[0].clientY; vDragging = true; }, { passive: true });\n    viewer.addEventListener('touchend',   function(e) { if (!vDragging) return; vDragging = false; onViewerEnd(e.changedTouches[0].clientX, e.changedTouches[0].clientY); }, { passive: true });\n\n    function onViewerEnd(x, y) {\n        var dx = x - vStartX, dy = y - vStartY;\n        if (Math.abs(dy) > Math.abs(dx) && Math.abs(dy) > 60) {\n            closePhotoViewer();\n        } else if (Math.abs(dx) > 50) {\n            currentPhotoIndex = dx < 0\n                ? (currentPhotoIndex + 1) % currentInfoPhotos.length\n                : (currentPhotoIndex - 1 + currentInfoPhotos.length) % currentInfoPhotos.length;\n            updatePhotoViewer();\n        }\n    }\n\n    function openPhotoViewer(index) {\n        currentPhotoIndex = index;\n        updatePhotoViewer();\n        document.getElementById('photo-viewer').classList.add('show');\n    }\n\n    function updatePhotoViewer() {\n        document.getElementById('photo-viewer-img').src = currentInfoPhotos[currentPhotoIndex];\n        document.getElementById('photo-viewer-counter').textContent = (currentPhotoIndex + 1) + ' \/ ' + currentInfoPhotos.length;\n    }\n\n    function closePhotoViewer() {\n        document.getElementById('photo-viewer').classList.remove('show');\n    }\n\n    document.addEventListener('keydown', function(e) {\n        if (document.getElementById('photo-viewer').classList.contains('show')) {\n            if (e.key === 'Escape')     { closePhotoViewer(); return; }\n            if (e.key === 'ArrowRight') { currentPhotoIndex = (currentPhotoIndex + 1) % currentInfoPhotos.length; updatePhotoViewer(); return; }\n            if (e.key === 'ArrowLeft')  { currentPhotoIndex = (currentPhotoIndex - 1 + currentInfoPhotos.length) % currentInfoPhotos.length; updatePhotoViewer(); return; }\n        }\n        if (e.key !== 'Escape') return;\n        if (document.getElementById('pw-popup').classList.contains('show')) { closePwPopup(); return; }\n        if (document.getElementById('share-popup').classList.contains('show')) { closeSharePopup(); return; }\n        if (document.getElementById('info-overlay').classList.contains('show')) { closeInfoOverlay(); return; }\n        if (document.getElementById('bm-overlay').classList.contains('show')) { document.getElementById('bm-overlay').classList.remove('show'); return; }\n        if (document.getElementById('input-popup').style.display === 'flex') { closePopup(); return; }\n    });\n\n    async function displayLostPetMarkers() {\n        try {\n            var res  = await fetch('https:\/\/yonggary.synology.me\/index.php?rest_route=\/map\/v1\/get-pins&t=' + Date.now());\n            var pins = await res.json();\n            allPins = pins;\n            pins.forEach(function(pin) {\n                if (!pin.lat || !pin.lng) return;\n                var position    = new kakao.maps.LatLng(parseFloat(pin.lat), parseFloat(pin.lng));\n                var statusClass = pin.pet_status === 'found' ? 'found' : 'lost';\n                var thumbSrc    = (pin.images && pin.images[0]) ? pin.images[0] : pin.img;\n                var node = document.createElement('div');\n                node.className = 'custom-pin ' + statusClass;\n                node.innerHTML = '<div class=\"pin-thumb-box\"><img decoding=\"async\" src=\"' + thumbSrc + '\" alt=\"' + (pin.name || '') + '\"><\/div>';\n                new kakao.maps.CustomOverlay({ position: position, content: node, yAnchor: 1.2 }).setMap(map);\n                node.onclick = function() { openInfoOverlay(pin); };\n            });\n        } catch(err) { console.error(err); }\n        return Promise.resolve();\n    }\n\n    kakao.maps.event.addListener(map, 'tilesloaded', function() {\n        if (!window.markersLoaded) {\n            displayLostPetMarkers().then(function() {\n                var petId = decodeId(new URLSearchParams(window.location.search).get('lp') || '');\n                if (petId) {\n                    var pin = allPins.find(function(p) { return String(p.id) === String(petId); });\n                    if (pin) {\n                        window._sharedViewMode = true;\n                        openInfoOverlay(pin);\n                    }\n                }\n            });\n            window.markersLoaded = true;\n        }\n    });\n<\/script>\n<script>\n    \/\/ ===== \ubd81\ub9c8\ud06c =====\n    \/\/ ===== \uacf5\uc720 \ub9c1\ud06c \uc778\ucf54\ub529 (Base62 + salt XOR) =====\n    var _B62 = '0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ';\n    var _SALT = 0x5A3F; \/\/ \uace0\uc815 salt \u2014 \ubcc0\uacbd \uc2dc \uae30\uc874 \ub9c1\ud06c \ubb34\ud6a8\ud654\ub428\n\n    function encodeId(id) {\n        var n = (parseInt(id, 10) ^ _SALT) >>> 0;\n        if (n === 0) return _B62[0];\n        var s = '';\n        while (n > 0) { s = _B62[n % 62] + s; n = Math.floor(n \/ 62); }\n        return s;\n    }\n\n    function decodeId(str) {\n        if (!str) return null;\n        var n = 0;\n        for (var i = 0; i < str.length; i++) {\n            var c = _B62.indexOf(str[i]);\n            if (c < 0) return null;\n            n = n * 62 + c;\n        }\n        return String((n ^ _SALT) >>> 0);\n    }\n\n    \/\/ ===== \uacf5\uc720 =====\n    var _sharePin = null;\n\n    function openSharePopup(pin) {\n        _sharePin = pin;\n        var url = location.origin + \"\/share.html?lp=\" + encodeId(pin.id);\n        document.getElementById(\"share-link-input\").value = url;\n        document.getElementById(\"share-copy-msg\").textContent = \"\";\n        var nativeBtn = document.getElementById(\"share-native-btn\");\n        nativeBtn.style.display = navigator.share ? \"flex\" : \"none\";\n        document.getElementById(\"share-popup\").classList.add(\"show\");\n    }\n\n    function closeSharePopup(e) {\n        if (e && e.target !== document.getElementById(\"share-popup\")) return;\n        document.getElementById(\"share-popup\").classList.remove(\"show\");\n    }\n\n    function copyShareLink() {\n        var input = document.getElementById(\"share-link-input\");\n        var msg   = document.getElementById(\"share-copy-msg\");\n        input.select(); input.setSelectionRange(0, 9999);\n        if (navigator.clipboard) {\n            navigator.clipboard.writeText(input.value).then(function() {\n                msg.textContent = \"\ub9c1\ud06c \ubcf5\uc0ac \uc644\ub8cc\";\n                setTimeout(function() { msg.textContent = \"\"; }, 2500);\n            });\n        } else {\n            document.execCommand(\"copy\");\n            msg.textContent = \"\ub9c1\ud06c \ubcf5\uc0ac \uc644\ub8cc\";\n            setTimeout(function() { msg.textContent = \"\"; }, 2500);\n        }\n    }\n\n    function nativeShare() {\n        if (!_sharePin || !navigator.share) return;\n        var url = location.origin + \"\/share.html?lp=\" + encodeId(_sharePin.id);\n        navigator.share({ title: (_sharePin.name || \"\") + \" - \uc2e4\uc885 \ubc18\ub824\ub3d9\ubb3c\", url: url })[\"catch\"](function() {});\n    }\n\n    var BM_KEY = 'lostpet_bookmarks';\n\n    function bmLoad() {\n        try { return JSON.parse(localStorage.getItem(BM_KEY) || '[]'); } catch(e) { return []; }\n    }\n\n    function bmSave(list) {\n        localStorage.setItem(BM_KEY, JSON.stringify(list));\n    }\n\n    function bmIsBookmarked(postId) {\n        return bmLoad().some(function(b) { return b.id == postId; });\n    }\n\n    function bmToggle(pin) {\n        var list = bmLoad();\n        var idx  = list.findIndex(function(b) { return b.id == pin.id; });\n        if (idx >= 0) {\n            list.splice(idx, 1);\n        } else {\n            list.unshift({\n                id:        pin.id,\n                name:      pin.name,\n                img:       (pin.images && pin.images[0]) ? pin.images[0] : (pin.img || ''),\n                status:    pin.pet_status || 'lost',\n                date:      pin.date || '',\n                timestamp: Date.now()\n            });\n        }\n        bmSave(list);\n        return idx < 0; \/\/ true = \ubd81\ub9c8\ud06c \ucd94\uac00\ub428\n    }\n\n    function bmGetBookmarkSvg(filled) {\n        if (filled) {\n            return '<svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"#2d8cff\" stroke=\"#2d8cff\" stroke-width=\"2.2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M17 3H7c-1.1 0-2 .9-2 2v16l7-3 7 3V5c0-1.1-.9-2-2-2z\"\/><\/svg>';\n        }\n        return '<svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#555\" stroke-width=\"2.2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M17 3H7c-1.1 0-2 .9-2 2v16l7-3 7 3V5c0-1.1-.9-2-2-2z\"\/><\/svg>';\n    }\n\n    \/\/ \uc815\ubcf4\ucc3d \ubd81\ub9c8\ud06c \ubc84\ud2bc \uc0c1\ud0dc \uac31\uc2e0\n    function bmUpdateInfoBtn(postId) {\n        var btn = document.getElementById('info-bm-btn');\n        if (!btn) return;\n        btn.innerHTML = bmGetBookmarkSvg(bmIsBookmarked(postId));\n    }\n\n    \/\/ \uc815\ubcf4\ucc3d \ubd81\ub9c8\ud06c \ubc84\ud2bc \ud074\ub9ad\n    function bmClickFromInfo(pin) {\n        bmToggle(pin);\n        bmUpdateInfoBtn(pin.id);\n    }\n\n    \/\/ openInfoOverlay\uc5d0\uc11c \ubd81\ub9c8\ud06c \ubc84\ud2bc id \uc9c0\uc815\ud558\uc5ec \uc0c1\ud0dc \ubc18\uc601\n    \/\/ \u2014 info-action-btn \uccab \ubc88\uc9f8\uac00 \ubd81\ub9c8\ud06c\uc784. \uc544\ub798 \ud328\uce58\ub85c id \ubd80\uc5ec\n    var _origOpenInfo = openInfoOverlay;\n    openInfoOverlay = function(pin) {\n        _origOpenInfo(pin);\n        var btns = document.querySelectorAll('.info-action-btn');\n        if (window._sharedViewMode) {\n            \/\/ \ub2e8\ub3c5 \uc5f4\ub78c \ubaa8\ub4dc: \ubd81\ub9c8\ud06c\/\uacf5\uc720 \uc544\uc774\ucf58, \uc0ad\uc81c \ubc84\ud2bc \uc228\uae40\n            btns.forEach(function(b) { b.style.display = 'none'; });\n            var footer = document.querySelector('.info-footer');\n            if (footer) footer.style.display = 'none';\n        } else {\n            if (btns.length > 0) {\n                btns[0].id = 'info-bm-btn';\n                btns[0].innerHTML = bmGetBookmarkSvg(bmIsBookmarked(pin.id));\n                btns[0].onclick = function() { bmClickFromInfo(pin); };\n            }\n            if (btns.length > 1) {\n                btns[1].onclick = function() { openSharePopup(pin); };\n            }\n        }\n    };\n\n    \/\/ \ubd81\ub9c8\ud06c \ubaa9\ub85d\ucc3d \uc5f4\uae30\n    async function openBmOverlay() {\n        var list = bmLoad();\n\n        \/\/ 10\ubc88: \uc874\uc7ac\ud558\uc9c0 \uc54a\ub294 \ud3ec\uc2a4\ud2b8 \uc815\ub9ac\n        \/\/ allPins\uac00 \ub85c\ub4dc\ub41c \uacbd\uc6b0 \uac80\uc99d, \uc544\uc9c1 \uc5c6\uc73c\uba74 \uc11c\ubc84\uc5d0\uc11c \ud655\uc778\n        var validIds;\n        if (allPins.length > 0) {\n            validIds = allPins.map(function(p) { return String(p.id); });\n        } else {\n            try {\n                var res  = await fetch('https:\/\/yonggary.synology.me\/index.php?rest_route=\/map\/v1\/get-pins&t=' + Date.now());\n                var pins = await res.json();\n                allPins  = pins;\n                validIds = pins.map(function(p) { return String(p.id); });\n            } catch(e) {\n                validIds = null; \/\/ \ub124\ud2b8\uc6cc\ud06c \uc624\ub958 \uc2dc \uc815\ub9ac \uac74\ub108\ub700\n            }\n        }\n\n        if (validIds !== null) {\n            var before = list.length;\n            list = list.filter(function(b) { return validIds.indexOf(String(b.id)) >= 0; });\n            if (list.length !== before) bmSave(list);\n        }\n\n        \/\/ \ubaa9\ub85d \ub80c\ub354\ub9c1\n        var bmIcon = '<svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"#2d8cff\" stroke=\"#2d8cff\" stroke-width=\"2.2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M17 3H7c-1.1 0-2 .9-2 2v16l7-3 7 3V5c0-1.1-.9-2-2-2z\"\/><\/svg>';\n        var itemsHtml = list.length === 0\n            ? '<div class=\"bm-empty\">\ubd81\ub9c8\ud06c\ud55c \ud3ec\uc2a4\ud2b8\uac00 \uc5c6\uc2b5\ub2c8\ub2e4.<\/div>'\n            : list.map(function(b) {\n                var dateStr = b.date ? formatDate(b.date) : '';\n                return '<div class=\"bm-item\" onclick=\"bmOpenPost(' + b.id + ')\">' +\n                    '<div class=\"bm-item-info\">' +\n                        '<div class=\"bm-item-name\">' + (b.name || '') + '<\/div>' +\n                        (dateStr ? '<div class=\"bm-item-date\">' + dateStr + '<\/div>' : '') +\n                    '<\/div>' +\n                    '<div class=\"bm-item-bm-icon\">' + bmIcon + '<\/div>' +\n                '<\/div>';\n            }).join('');\n\n        document.getElementById('bm-card').innerHTML = '<div class=\"bm-list\">' + itemsHtml + '<\/div>';\n\n        document.getElementById('bm-overlay').classList.add('show');\n    }\n\n    function closeBmOverlay(e) {\n        if (e && e.target !== document.getElementById('bm-overlay')) return;\n        document.getElementById('bm-overlay').classList.remove('show');\n    }\n\n    \/\/ \ubd81\ub9c8\ud06c \ubaa9\ub85d\uc5d0\uc11c \ud3ec\uc2a4\ud2b8 \ud074\ub9ad \u2192 \uc815\ubcf4\ucc3d \uc5f4\uae30 (\ub2eb\uc73c\uba74 \ubd81\ub9c8\ud06c\ucc3d\uc73c\ub85c \ubcf5\uadc0)\n    function bmOpenPost(postId) {\n        var pin = allPins.find(function(p) { return p.id == postId; });\n        if (!pin) return;\n        \/\/ \ubd81\ub9c8\ud06c\ucc3d\uc740 \uc228\uae30\ub418 \uc81c\uac70\ud558\uc9c0 \uc54a\uc74c \u2014 \uc815\ubcf4\ucc3d \ub2eb\ud790 \ub54c \ubcf5\uadc0\n        document.getElementById('bm-overlay').classList.remove('show');\n        openInfoOverlay(pin);\n        \/\/ \uc815\ubcf4\ucc3d \ub2eb\ud798 \uac10\uc9c0: info-overlay\uc5d0\uc11c show \uc81c\uac70\ub420 \ub54c \ubd81\ub9c8\ud06c\ucc3d \ubcf5\uadc0\n        window._bmReturnPending = true;\n    }\n\n\n<\/script>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>&times; \uc815\ubcf4 \ub4f1\ub85d \uc774\ub984 \uc2e4\uc885 \uc77c\uc2dc \uc2e4\uc885 \uc704\uce58 \uc5f0\ub77d\ucc98 \ud2b9\uc774\uc0ac\ud56d \ub4f1\ub85d \uc644\ub8cc \uacf5\uc720 \ubcf5\uc0ac \ub2e4\ub978 \uc571\uc73c\ub85c \uacf5\uc720 \ub2eb\uae30 \ube44\ubc00\ubc88\ud638 \ud655\uc778 \ucde8\uc18c \uc0ad\uc81c \u2715<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-24","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/yonggary.synology.me\/index.php?rest_route=\/wp\/v2\/pages\/24","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/yonggary.synology.me\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/yonggary.synology.me\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/yonggary.synology.me\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/yonggary.synology.me\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=24"}],"version-history":[{"count":321,"href":"https:\/\/yonggary.synology.me\/index.php?rest_route=\/wp\/v2\/pages\/24\/revisions"}],"predecessor-version":[{"id":411,"href":"https:\/\/yonggary.synology.me\/index.php?rest_route=\/wp\/v2\/pages\/24\/revisions\/411"}],"wp:attachment":[{"href":"https:\/\/yonggary.synology.me\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=24"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}