/* The map, list and selected complex share one bounded workspace. */
html[data-design] body[data-view=map] { height:100dvh; overflow:hidden; }
html[data-design] body[data-view=map] main { display:flex; flex-direction:column; height:calc(100dvh - var(--header-height)); min-height:0; max-width:none; padding:16px 20px 12px; overflow:hidden; }
body[data-view=map] .heading { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip-path:inset(50%); }
body[data-view=map] footer,body[data-view=map] .method,body[data-view=map] #feedback { display:none; }
body[data-view=map] .load-status { display:none; flex-shrink:0; font-size:12px; }
body[data-view=map] .load-status:has(.load-error),body[data-view=map] .load-status:has(#load-retry:not([hidden])) { display:flex; }
#map-view { flex:1; min-width:0; min-height:0; }
.naver-workspace { display:flex; flex-direction:column; min-width:0; height:100%; background:var(--surface); border:1px solid var(--line); border-radius:10px; overflow:hidden; }
.map-workspace-toolbar { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 12px; border-bottom:1px solid var(--line); }
#map-search-form { display:flex; align-items:center; flex:1; gap:8px; max-width:520px; min-width:0; }
#map-query { flex:1; width:100%; min-width:0; padding:8px 10px; font-size:15px; }
#map-search-form button { flex-shrink:0; }
.map-region-menu { position:relative; flex-shrink:0; z-index:8; }
.map-region-menu summary { cursor:pointer; min-height:44px; padding:10px; border:1px solid var(--line); border-radius:7px; white-space:nowrap; font-size:13px; }
#map-view .map-view-actions { position:absolute; top:calc(100% + 8px); right:0; display:grid; gap:6px; width:180px; padding:8px; background:var(--surface); border:1px solid var(--line); border-radius:8px; box-shadow:0 6px 20px #2332471a; }
#map-view .map-view-actions button { min-height:44px; padding:7px 11px; font-size:13px; }
html[data-design] body[data-view=map] #query-context { flex-direction:row; border:0; border-radius:0; margin:0; padding:8px 12px; background:var(--surface); border-bottom:1px solid var(--line); }
body[data-view=map] #query-context .context-location { display:none; }
html[data-design] body[data-view=map] .quick-filters { flex-wrap:nowrap; width:100%; gap:6px; overflow-x:auto; padding:2px; scrollbar-width:thin; }
body[data-view=map] .quick-filters > * { flex-shrink:0; }
.map-comparison-slot { margin-left:auto; }
.map-comparison-slot:empty { display:none; }
html[data-design] body[data-view=map] #compare-tray { position:static; display:flex; flex-wrap:nowrap; padding:0; margin:0; border:0; background:transparent; box-shadow:none; }
body[data-view=map] #compare-tray-text,body[data-view=map] #compare-tray-toggle,body[data-view=map] #compare-tray-actions { display:none; }
body[data-view=map] #open-comparison { white-space:nowrap; padding:7px 10px; }
html[data-design] body[data-view=map]:has(#compare-tray:not([hidden])) main { padding-bottom:12px; }
.naver-map-layout { position:relative; --map-panel-width:340px; display:grid; grid-template-columns:var(--map-panel-width) minmax(0,1fr); grid-template-rows:minmax(0,1fr); flex:1; min-height:0; }
.naver-map-surface { position:relative; isolation:isolate; grid-column:2; grid-row:1; min-width:0; min-height:0; background:#edf1f4; overflow:hidden; }
#map-chart.naver-map-canvas { position:absolute; inset:0; width:100%; height:100%; min-height:0; margin:0; background:#edf1f4; outline-offset:-4px; }
.naver-map-panel { grid-column:1; grid-row:1; min-width:0; min-height:0; overflow:auto; overscroll-behavior:contain; border-right:1px solid var(--line); background:var(--surface); scrollbar-width:thin; }
.naver-map-layout:has(.map-selected:not([hidden])) .naver-map-panel { visibility:hidden; }
.map-panel-heading { display:flex; justify-content:space-between; gap:10px; align-items:center; padding:18px 18px 14px; }
html[data-design] .map-panel-heading h2 { font-size:17px; }
.map-panel-heading p { margin:6px 0 0; color:var(--muted); font-size:12px; }
html[data-design] .map-sheet-heading .map-sheet-context { display:flex; align-items:center; gap:6px; margin:0 0 6px; font-size:12px; font-weight:600; line-height:1.5; color:var(--muted); }
.map-sheet-context svg { width:15px; height:15px; flex-shrink:0; }
html[data-design] .map-selected .map-sheet-context { color:var(--accent); }
html[data-design] .map-sheet-close { display:grid; place-items:center; flex-shrink:0; width:44px; height:44px; min-height:44px; padding:10px; border:0; border-radius:50%; background:var(--soft); color:var(--ink); }
.map-sheet-close svg { width:20px; height:20px; }
#map-list-close { display:none; }
#map-clear-search { font-size:12px; padding:6px 8px; flex-shrink:0; }
.map-property-row { padding:16px 18px; border-top:1px solid var(--line); }
.map-property-row.is-selected,.map-property-row.is-highlighted { background:var(--selected); box-shadow:inset 3px 0 var(--accent); }
html[data-design] .map-property-name { display:flex; flex-direction:column; align-items:flex-start; text-align:left; gap:4px; width:100%; padding:0; border:0; border-radius:0; background:transparent; min-height:44px; }
.map-property-name strong { color:var(--ink); font-size:15px; font-weight:650; overflow-wrap:anywhere; }
.map-property-name span { color:var(--muted); font-size:12px; line-height:1.6; overflow-wrap:anywhere; }
.map-property-price { display:flex; align-items:baseline; justify-content:space-between; flex-wrap:wrap; gap:4px 12px; margin:12px 0; }
.map-property-price strong { font-size:21px; font-variant-numeric:tabular-nums; letter-spacing:-.03em; }
.map-property-price small { font-size:12px; color:var(--muted); }
.map-property-actions { display:flex; gap:8px; margin-top:12px; }
html[data-design] .map-property-actions button { flex:1; min-height:44px; padding:7px; font-size:12px; }
.map-panel-note { padding:0 18px 16px; margin:16px 0 0; color:var(--muted); font-size:12px; line-height:1.7; }
#show-region,#map-more-list { display:block; width:calc(100% - 36px); margin:12px 18px; font-size:13px; }
.map-empty { padding:24px 18px; color:var(--muted); font-size:13px; line-height:1.7; }
.map-empty strong { color:var(--ink); font-size:14px; }
.map-empty p { margin:8px 0; }
.map-unavailable { position:absolute; inset:0; z-index:2; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; padding:24px; text-align:center; background:var(--soft); }
.map-unavailable svg { width:48px; height:48px; color:var(--muted); }
.map-unavailable strong { font-size:18px; letter-spacing:-.025em; }
.map-unavailable p { max-width:34ch; margin:0; color:var(--muted); font-size:13px; line-height:1.8; }
#map-retry { font-size:13px; }
.map-floating-tools { position:absolute; top:16px; left:16px; right:72px; z-index:2; pointer-events:none; }
.map-floating-tools button { min-height:44px; font-size:13px; box-shadow:0 2px 8px #2332471a; pointer-events:auto; }
.naver-map-tools { position:absolute; top:16px; right:14px; z-index:2; display:flex; flex-direction:column; border:1px solid var(--line); border-radius:7px; overflow:hidden; background:var(--surface); box-shadow:0 2px 8px #2332471a; }
html[data-design] .naver-map-tools button { width:44px; height:44px; min-height:44px; padding:0; border:0; border-radius:0; font-size:23px; }
html[data-design] .naver-map-tools button+button { border-top:1px solid var(--line); }
.naver-map-tools svg { display:block; width:18px; height:18px; margin:auto; fill:none; stroke:currentColor; stroke-width:1.8; }
#map-zoom-label { padding:4px; text-align:center; font-size:10px; color:var(--muted); background:var(--soft); }
.naver-workspace:not([data-map-state=ready]) .map-floating-tools,.naver-workspace:not([data-map-state=ready]) .naver-map-tools { display:none; }
html[data-design] .map-price-marker { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px; min-width:90px; max-width:140px; min-height:52px; padding:5px 9px; border:1px solid #637e99; border-radius:8px; background:var(--surface); color:var(--ink); box-shadow:0 2px 8px #23324726; white-space:nowrap; line-height:1.3; }
.map-price-marker strong { font-size:14px; font-weight:750; letter-spacing:-.025em; font-variant-numeric:tabular-nums; }
.map-price-marker small,.map-price-marker > span { font-size:11px; color:var(--muted); }
.map-marker-name { display:block; max-width:120px; overflow:hidden; text-overflow:ellipsis; }
html[data-design] .map-price-marker[aria-pressed=true] { background:var(--accent); color:white; border-color:var(--accent); }
.map-price-marker[aria-pressed=true] small { color:white; }
html[data-design] .map-price-marker.is-highlighted { outline:3px solid var(--accent); outline-offset:2px; }
html[data-design] .map-price-marker.is-region { background:var(--surface); border-color:var(--accent); }
html[data-design] .map-price-marker.is-cluster { border-radius:24px; background:var(--selected); }
.map-price-marker:focus-visible { outline-offset:3px; }
.map-selected { position:absolute; z-index:6; inset:0 auto 0 0; display:flex; flex-direction:column; width:var(--map-panel-width); max-height:100%; background:var(--surface); border-right:1px solid var(--line); overflow:hidden; }
.map-selected-heading { position:relative; display:flex; justify-content:space-between; align-items:flex-start; gap:8px; flex-shrink:0; padding:16px 18px; background:var(--selected); border-bottom:1px solid var(--line); }
.map-selected-heading > div { flex:1; min-width:0; }
.map-selected-heading p { font-size:12px; color:var(--muted); margin:0 0 5px; }
.map-selected-heading h3 { font-size:18px; letter-spacing:-.03em; margin:0; overflow-wrap:anywhere; }
#map-selection-expand { display:none; flex-shrink:0; font-size:12px; padding:6px 8px; }
.map-selected-content { flex:1; min-height:0; padding:16px 18px; overflow:auto; overscroll-behavior:contain; scrollbar-width:thin; }
.map-selected-address { margin:12px 0; color:var(--muted); font-size:12px; line-height:1.6; }
.map-selected-price { display:flex; flex-direction:column; gap:5px; }
.map-selected-price strong { font-size:29px; font-weight:750; letter-spacing:-.04em; font-variant-numeric:tabular-nums; }
.map-selected-price span { font-size:13px; }
.map-selected-price small { font-size:12px; color:var(--muted); }
.map-preview-area { display:flex; align-items:center; justify-content:space-between; gap:8px; margin:12px 0; font-size:13px; }
.map-preview-area select { min-width:0; max-width:70%; font-size:13px; }
#map-selected-actions { display:flex; gap:8px; flex-shrink:0; margin:0; padding:12px 16px; border-top:1px solid var(--line); background:var(--surface); }
#map-selected-actions:empty { display:none; }
html[data-design] #map-selected-actions button { flex:1; min-height:44px; padding:8px; font-size:13px; }
.map-selected h4 { margin:0; font-size:13px; }
.map-contract { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 0; border-bottom:1px solid var(--line); font-size:12px; }
.map-contract small { display:block; color:var(--muted); margin-top:4px; }
.map-contract strong { white-space:nowrap; font-size:14px; font-variant-numeric:tabular-nums; }
.map-location-note { font-size:13px; color:var(--muted); line-height:1.65; }
.map-workspace-status { flex-shrink:0; padding:6px 12px; border-top:1px solid var(--line); background:var(--surface); color:var(--muted); font-size:12px; line-height:1.5; }
.naver-workspace[data-results=stale] .map-workspace-status { background:var(--selected); color:var(--accent); }
.map-list-toggle { display:none; }
@media(max-width:1200px) and (min-width:901px) {
  .naver-map-layout { --map-panel-width:290px; }
}
@media(max-width:900px) {
  html[data-design] body[data-view=map] main,html[data-design] body[data-view=map]:has(#compare-tray:not([hidden])) main { height:calc(100dvh - var(--content-top)); padding:0; }
  .naver-workspace { border:0; border-radius:0; }
  .map-workspace-toolbar { gap:6px; }
  #map-search-form { gap:6px; }
  #map-query { font-size:16px; }
  #map-search-form button { padding:8px; font-size:13px; }
  .map-region-menu summary { font-size:12px; padding:10px 7px; }
  html[data-design] body[data-view=map] .kind-switch { display:flex; flex:none; }
  html[data-design] body[data-view=map] .kind-switch button { padding:6px 10px; }
  body[data-view=map] #quick-period { min-width:116px; }
  .naver-map-layout { display:block; overflow:hidden; }
  .naver-map-surface { height:100%; }
  .map-sheet { position:absolute; inset:auto 0 0; display:flex; flex-direction:column; width:100%; height:min(76%,560px); max-height:calc(100% - 56px); overflow:hidden; border:1px solid var(--line); border-bottom:0; border-radius:20px 20px 0 0; box-shadow:0 -8px 32px #182b4426; transform:translateY(calc(100% + 32px)); visibility:hidden; pointer-events:none; transition:transform .3s cubic-bezier(.22,1,.36,1),visibility 0s .3s; }
  .naver-map-panel { z-index:4; }
  .naver-workspace[data-panel=list] .naver-map-panel,.map-selected:not([hidden]) { transform:translateY(0); visibility:visible; pointer-events:auto; transition-delay:0s; }
  html[data-design] .map-sheet .map-sheet-heading { position:relative; flex-shrink:0; align-items:center; gap:8px; padding:24px 16px 12px; border-bottom:1px solid var(--line); touch-action:pan-x; }
  .map-sheet-heading::before { content:''; position:absolute; top:8px; left:calc(50% - 18px); width:36px; height:4px; border-radius:4px; background:#bdc9d8; }
  .map-sheet-heading > div { flex:1; min-width:0; }
  html[data-design] .naver-map-panel .map-panel-heading h2 { font-size:16px; line-height:1.45; overflow-wrap:anywhere; }
  .naver-map-panel .map-panel-heading p { margin-top:4px; }
  html[data-design] #map-list-close { display:grid; }
  .map-panel-content { flex:1; min-height:0; overflow:auto; overscroll-behavior:contain; padding-bottom:env(safe-area-inset-bottom,0px); scrollbar-width:thin; }
  html[data-design] .map-list-toggle { display:block; position:absolute; bottom:20px; left:50%; transform:translateX(-50%); z-index:3; min-height:44px; padding:10px 22px; border:1px solid var(--line); border-radius:24px; background:var(--surface); color:var(--ink); box-shadow:0 3px 16px #182b4433; white-space:nowrap; }
  .naver-workspace[data-panel=list] .map-list-toggle { visibility:hidden; }
  .map-selected { height:min(76%,440px); }
  /* Keep the closed sheet rendered for its exit transition; JS makes it inert. */
  .map-selected[hidden] { display:flex!important; }
  .map-selected[data-expanded=true] { height:calc(100% - 24px); max-height:calc(100% - 24px); }
  .naver-workspace:has(.map-selected:not([hidden])) .map-list-toggle { display:none; }
  html[data-design] .map-selected .map-sheet-close { background:var(--surface); }
  .map-selected-heading h3 { font-size:16px; }
  #map-selection-expand { display:block; }
  .map-selected-content { padding:12px 16px; }
  .map-floating-tools { top:12px; left:10px; right:62px; }
  .naver-map-tools { top:12px; right:10px; }
}
@media(max-height:600px) {
  html[data-design] .map-sheet .map-sheet-heading { padding:20px 12px 8px; }
  .naver-map-tools { flex-direction:row; }
  html[data-design] .naver-map-tools button+button { border-top:0; border-left:1px solid var(--line); }
  #map-zoom-label { display:none; }
  #map-selected-actions { padding:8px 12px; }
  .map-selected-content { padding:10px 12px; }
}
@media(max-width:599px) and (min-height:501px) and (max-height:600px) {
  html[data-design]:has(body[data-view=map]) { --header-height:48px; --navigation-height:48px; }
  html[data-design] body[data-view=map] .navigation { padding:2px 8px; }
  html[data-design] body[data-view=map] .navigation button { min-height:40px; }
}
@media(max-height:500px) and (max-width:900px) {
  html[data-design]:has(body[data-view=map]) { --header-height:0px; --navigation-height:48px; }
  body[data-view=map] .topbar { display:none; }
  html[data-design] body[data-view=map] .navigation { top:0; padding:2px 8px; }
  html[data-design] body[data-view=map] .navigation button { min-height:40px; }
  #map-selection-expand { display:none; }
}
@media(max-height:500px) and (min-width:600px) and (max-width:900px) {
  .naver-workspace { display:grid; grid-template-columns:1fr 1fr; grid-template-rows:auto minmax(0,1fr) auto; }
  .map-workspace-toolbar { min-width:0; padding:6px; }
  .map-filter-slot { min-width:0; }
  html[data-design] body[data-view=map] #query-context { height:100%; padding:6px; }
  .naver-map-layout,.map-workspace-status { grid-column:1/-1; }
  .map-sheet { left:auto; width:min(420px,56%); height:calc(100% - 12px); max-height:calc(100% - 12px); }
  .map-selected-price { display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:2px 12px; }
  .map-selected-price strong { grid-row:1/3; }
  .map-selected-price span,.map-selected-price small { grid-column:2; }
}
/* Status changes must never resize the map. */
.map-workspace-status { display:flex; align-items:center; height:44px; min-height:44px; padding:6px 12px; line-height:16px; }
#map-viewport-note { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.detail-region-link { margin:0 0 8px; min-height:44px; font-size:13px; color:var(--accent); }
.map-current-position { display:block; width:16px; height:16px; border:3px solid white; border-radius:50%; background:#246cdb; box-shadow:0 0 0 6px #246cdb33,0 1px 4px #182c4340; }
#map-locate[aria-busy=true] { background:var(--selected); }
@media(prefers-reduced-motion:reduce) {
  .map-sheet { transition:none; }
}
