/* Full-width map and compact directory, matching the Bali map's workspace. */
.gj-hmap { width: 100%; margin: 0; color: #302937; position: relative; }
.gj-hmap [hidden] { display: none !important; }
.gj-hmap__workspace { display: grid; grid-template-columns: minmax(0, 1fr) 340px; height: min(88vh, 940px); min-height: 560px; border-block: 1px solid #e3dce8; background: #fbfafc; }
.gj-hmap__mapwrap { position: relative; min-width: 0; isolation: isolate; background: #dfe9ed; }
.gj-hmap__canvas, .gj-hmap__terrain { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; font-family: inherit; }
.gj-hmap__float { position: absolute; left: 20px; top: 20px; z-index: 2; width: min(245px, 65%); pointer-events: none; }
.gj-hmap h1 { font-family: var(--f-display); font-size: clamp(23px, 2.2vw, 30px); line-height: 1.3; margin: 0 0 14px; color: #402450; text-shadow: 0 1px 3px #fff, 0 0 12px #fff; }
.gj-hmap__filters { display: grid; gap: 8px; pointer-events: auto; }
.gj-hmap__filters label { display: grid; gap: 3px; font-size: 11px; color: #402450; font-weight: 700; }
.gj-hmap__filters select { width: 100%; height: 42px; border: 1px solid #d8cddf; border-radius: 9px; padding: 0 10px; background: #fffffff5; color: #302937; font: inherit; font-size: 14px; box-shadow: 0 2px 10px #30293720; }
.gj-hmap button { cursor: pointer; font: inherit; }
.gj-hmap__filters button { justify-self: start; background: #fffffff0; color: #674378; border: 1px solid #d8cddf; border-radius: 6px; font-size: 12px; padding: 6px 10px; }
.gj-hmap :is(a, button, select, input):focus-visible { outline: 3px solid #ac71bf; outline-offset: 3px; }
.gj-hmap__controls { position: absolute; top: 20px; right: 16px; z-index: 3; display: flex; flex-direction: column; gap: 6px; }
.gj-hmap__controls button { width: 42px; height: 42px; border: 1px solid #d6cbdc; border-radius: 8px; background: #fffffff5; color: #493057; font-weight: 700; font-size: 22px; box-shadow: 0 2px 9px #30293720; line-height: 1; }
.gj-hmap__controls [data-map-action="mode"] { font-size: 15px; }
.gj-hmap__controls button[aria-pressed="true"] { background: #674378; color: #fff; }
.gj-hmap__controls button:disabled { opacity: .55; cursor: wait; }
.gj-hmap__hint { position: absolute; bottom: 26px; left: 12px; max-width: calc(100% - 24px); z-index: 2; background: #ffffffe6; color: #51455a; padding: 5px 9px; border-radius: 6px; font-size: 11px; pointer-events: none; }
.gj-hmap__mapstatus { position: absolute; bottom: 65px; left: 20px; right: 66px; z-index: 2; background: #fff; color: #51455a; padding: 12px; border-radius: 8px; font-size: 13px; box-shadow: 0 2px 10px #30293720; }
.gj-hmap__sidebar { display: flex; flex-direction: column; min-width: 0; min-height: 0; border-left: 1px solid #e3dce8; background: #fff; }
.gj-hmap__listhead { padding: 16px; border-bottom: 1px solid #eee7f0; flex-shrink: 0; }
.gj-hmap__search input { width: 100%; min-width: 0; height: 42px; border: 1px solid #d8cddf; border-radius: 8px; padding: 0 10px; font: inherit; font-size: 16px; background: #fff; }
.gj-hmap__count { margin: 12px 0 3px; font-size: 13px; font-weight: 700; color: #56366a; }
.gj-hmap__listhead > a { font-size: 12px; color: #674378; }
.gj-hmap__results { overflow-y: auto; overscroll-behavior-y: contain; min-width: 0; min-height: 0; position: relative; flex: 1; }
.gj-hmap__card { padding: 14px 16px; border-bottom: 1px solid #eee7f0; transition: background .15s; }
.gj-hmap__card.is-selected { background: #f2eaf6; box-shadow: inset 4px 0 #674378; }
.gj-hmap__photo { display: none; }
.gj-hmap__details { min-width: 0; overflow-wrap: anywhere; }
.gj-hmap__details p { margin: 0 0 4px; }
.gj-hmap__location { font-size: 11px; font-weight: 700; color: #79568d; }
.gj-hmap__details h2 { font-size: 15px; line-height: 1.5; margin: 0 0 3px; padding: 0; border: 0; }
.gj-hmap__details h2 a { color: #302937; text-decoration: none; }
.gj-hmap__en { color: #77707c; font-size: 11px; line-height: 1.4; }
.gj-hmap__brand { display: inline-block; font-size: 11px; color: #674378; padding-block: 3px; }
.gj-hmap__note { font-size: 11px; line-height: 1.5; color: #685e6d; }
.gj-hmap__actions { display: flex; align-items: center; flex-wrap: wrap; gap: 16px; font-size: 12px; margin-top: 5px; }
.gj-hmap__actions a { font-weight: 700; color: #674378; }
.gj-hmap__actions button { border: 0; background: transparent; color: #4c6468; padding: 5px 0; }
.gj-hmap__empty { padding: 22px; color: #685e6d; }
.gj-hmap__cluster { background: #ffffffb8; border-radius: 50%; padding: 5px; box-shadow: 0 2px 12px #30293730; }
.gj-hmap__cluster span { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: #674378; color: white; font-size: 14px; font-weight: 700; }
.gj-hmap__pin span { display: block; width: 22px; height: 22px; border: 3px solid white; border-radius: 50%; box-shadow: 0 2px 6px #0005; margin: 3px; }
.gj-hmap__popup { font-family: var(--f-body); font-size: 12px; line-height: 1.6; }
.gj-hmap__popup img { width: 100%; height: 130px; object-fit: cover; border-radius: 6px; }
.gj-hmap__popup > a { color: #674378; font-weight: 700; display: block; }
.gj-hmap__popup p { margin: 8px 0; }
.gj-hmap .leaflet-control-attribution, .gj-hmap .maplibregl-ctrl-attrib { font-size: 10px; }
.gj-hmap__3d-pin { border-radius: 50%; border: 3px solid white; background: #674378; color: white; width: 27px; height: 27px; box-shadow: 0 2px 6px #0005; font-size: 10px !important; line-height: 1; }
.gj-hmap.is-fullscreen { position: fixed; inset: 0; width: 100%; height: 100vh; height: 100dvh; z-index: 100000; background: #fff; margin: 0 !important; }
.gj-hmap.is-fullscreen .gj-hmap__workspace { height: 100%; min-height: 0; border: 0; }
body.gj-hmap-fullscreen { overflow: hidden; }
body.gj-hmap-fullscreen #fcp-root { display: none !important; }
@media (max-width: 1024px) {
 .gj-hmap__workspace { grid-template-columns: minmax(0,1fr); grid-template-rows: minmax(440px,65svh) auto; height: auto; min-height: 0; }
 .gj-hmap__sidebar { border-left: 0; border-top: 1px solid #e3dce8; }
 .gj-hmap__results { max-height: 520px; }
 .gj-hmap__float { left: 12px; top: 14px; width: min(225px,65%); }
 .gj-hmap__controls { top: 14px; right: 12px; }
 .gj-hmap.is-fullscreen .gj-hmap__workspace { grid-template-rows: minmax(0,1fr) minmax(130px,28%); }
 .gj-hmap.is-fullscreen .gj-hmap__sidebar { display: grid; grid-template-columns: minmax(130px,32%) minmax(0,1fr); }
 .gj-hmap.is-fullscreen .gj-hmap__listhead { padding: 10px; border-right: 1px solid #e3dce8; overflow: auto; }
 .gj-hmap.is-fullscreen .gj-hmap__results { max-height: none; }
 .gj-hmap.is-fullscreen .gj-hmap__search input { font-size: 16px; }
}
@media (max-height: 550px) and (orientation: landscape) {
 .gj-hmap.is-fullscreen .gj-hmap__workspace { grid-template-columns: minmax(0,1fr) 260px; grid-template-rows: minmax(0,1fr); }
 .gj-hmap.is-fullscreen .gj-hmap__sidebar { display: flex; }
 .gj-hmap.is-fullscreen .gj-hmap__float { width: 180px; }
 .gj-hmap.is-fullscreen h1 { font-size: 22px; }
}
@media (prefers-reduced-motion: reduce) { .gj-hmap__card { transition: none; } }

.gj-hmap__credits { font-size: 11px; background: #f8f5fa; padding: 5px 16px; color: #685e6d; }
.gj-hmap__credits summary { cursor: pointer; }
.gj-hmap__credits p { max-width: 1100px; margin: 8px 0; }
.gj-hmap.is-fullscreen { display: flex; flex-direction: column; }
.gj-hmap.is-fullscreen .gj-hmap__workspace { flex: 1; height: auto; min-height: 0; }
.gj-hmap.is-fullscreen .gj-hmap__credits { flex-shrink: 0; max-height: 25vh; overflow: auto; }

.gj-hmap__region-label { pointer-events: none; user-select: none; font: 600 13px var(--f-body); letter-spacing: .08em; color: #274d43; text-shadow: 0 1px 3px #fff, 0 0 5px #fff, 0 0 9px #fff; }

/* Three.js terrain and sparse DOM annotations. */
.gj-hmap__terrain > canvas { display:block; width:100%; height:100%; touch-action:none; outline-offset:-4px; }
.gj-hmap__three-labels { position:absolute; inset:0; pointer-events:none; overflow:hidden; }
.gj-hmap__three-pin { position:absolute; left:0; top:0; border:0; background:transparent; color:#b32c37; padding:0; pointer-events:auto; cursor:pointer; line-height:1; text-shadow:0 1px 2px #fff,0 -1px 2px #fff; }
.gj-hmap__three-pin > span:first-child { display:block; padding:8px; margin:-12px; font-size:17px; }
.gj-hmap__three-name { display:none; position:absolute; left:10px; top:-10px; padding:5px 7px; max-width:150px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#193d36; background:#fffffff0; border-radius:4px; font:600 11px/1.25 sans-serif; text-shadow:none; box-shadow:0 1px 4px #183c3926; }
.gj-hmap__three-pin.has-name .gj-hmap__three-name,.gj-hmap__three-pin:focus-visible .gj-hmap__three-name { display:block; }
.gj-hmap__three-notice { position:absolute; bottom:65px; left:50%; transform:translateX(-50%); padding:8px 14px; border-radius:20px; background:#fffef0; color:#314941; font-size:12px; pointer-events:none; }
.gj-hmap__three-popup { position:absolute; top:110px; right:65px; width:min(270px,calc(100% - 85px)); max-height:calc(100% - 165px); overflow:auto; padding:18px; border-radius:12px; background:#fff; box-shadow:0 8px 35px #183c3940; z-index:4; }
.gj-hmap__three-close { position:absolute; top:0; right:0; width:30px; height:30px; border:0; background:#fff; font-size:23px; cursor:pointer; }
.gj-hmap__three-pin[hidden],.gj-hmap__three-notice[hidden],.gj-hmap__three-popup[hidden] { display:none; }

/* Optional attractions remain distinct from hotel pins in both modes. */
.gj-hmap__landmark-toggle { pointer-events:auto; background:#fffffff0; padding:6px 9px; border-radius:6px; display:flex; align-items:center; gap:6px; width:fit-content; margin-top:9px; color:#80521c; font-size:12px; cursor:pointer; }
.gj-hmap__landmark-toggle input { width:15px; height:15px; margin:0; accent-color:#a16925; }
.gj-hmap__landmark-toggle small { color:#68756e; font-size:10px; margin-left:5px; }
.gj-hmap__landmark-pin { border:0; background:transparent; }
.gj-hmap__landmark-content { display:flex; align-items:center; gap:5px; width:max-content; height:24px; font:600 12px/1.2 sans-serif; color:#704518; white-space:nowrap; }
.gj-hmap__landmark-content i { width:9px; height:9px; border:2px solid white; background:#a16925; border-radius:50%; box-shadow:0 1px 4px #31494155; }
.gj-hmap__landmark-content > span { background:#fffffff0; padding:3px 5px; border-radius:4px; box-shadow:0 1px 3px #31494120; }
.gj-hmap__landmark-labels { position:absolute; inset:0; pointer-events:none; overflow:hidden; }
.gj-hmap .gj-hmap__landmark-3d { position:absolute; transform:translate(-50%,-100%); border:1px solid #b99a6480; padding:4px 7px; border-radius:5px; background:#fffffff0; color:#704518; font:600 12px/1.2 sans-serif; white-space:nowrap; cursor:pointer; pointer-events:auto; box-shadow:0 1px 5px #31494130; }
.gj-hmap__landmark-3d::after { content:''; position:absolute; left:50%; top:100%; width:36px; height:36px; transform:translateX(-50%); }
.gj-hmap__landmark-3d[hidden],.gj-hmap__landmark-labels[hidden] { display:none; }

/* Fade raster place labels while keeping our Chinese labels and pins opaque. */
.gj-hmap__canvas.leaflet-container { background:#f0f3ee; }
.gj-hmap__landmark-3d.is-natural::after { display:none; }