.surf-map{margin:0 0 16px;border:1px solid #303034;border-radius:16px;background:#121214;overflow:hidden}
.surf-map button{font:inherit;color:inherit;cursor:pointer}
.surf-map__entry{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;padding:16px;border:0;background:none;text-align:left;font-weight:650!important}
.surf-map__entry span+span{font-size:12px;color:#9c9ca4;font-weight:400}
.surf-map__controls{display:flex;gap:6px;padding:8px 12px;flex-wrap:wrap}
.surf-map__controls button,.surf-map__clear{border:1px solid #38383d;background:transparent;border-radius:20px;padding:8px 12px;font-size:12px}
.surf-map__controls button[aria-pressed=true]{background:#23313b;border-color:#5ec6f0;color:#80d9fa}
.surf-map__note,.surf-map__help{font-size:11px;color:#93939d;line-height:1.65;margin:8px 14px 12px}
.surf-map__stage{position:relative;background:#171717;overflow:hidden}
.surf-map__stage svg{width:100%;height:auto;display:block;touch-action:none;user-select:none;aspect-ratio:360/350}
.surf-map__stage text{font-size:11px;font-family:inherit;pointer-events:none;transition:opacity .18s}
.surf-map__stage g[role=button]{cursor:pointer;transition:opacity .18s}
.surf-map__stage g[role=button]:focus{outline:none}.surf-map__stage g[role=button]:focus-visible circle:nth-child(2){stroke:#a7c4c7;stroke-width:1}
.surf-map__zoom{position:absolute;right:10px;bottom:10px;display:flex;gap:4px}
.surf-map__zoom button{min-width:36px;height:36px;border:1px solid #3b3b42;border-radius:9px;background:#202025e8;font-size:13px;padding:0 8px}
.surf-map__status{margin:14px 14px 4px;font-size:13px;color:#dbdbe1}
.surf-map__results{max-height:420px;overflow:auto;padding:0 12px;overscroll-behavior:contain}
.surf-map__clear{margin:8px 0;color:#a9a9b2!important}
.surf-map__result{display:flex;flex-direction:column;gap:7px;width:100%;padding:14px 0;border:0;border-top:1px solid #2d2d33;background:none;text-align:left}
.surf-map__source{font-size:11px;color:#80cbe8}.surf-map__result strong{font-size:13px}.surf-map__excerpt{font-size:12px;color:#a8a8b0;line-height:1.6;overflow-wrap:anywhere}
.surf-map button:focus-visible{outline:2px solid #5ec6f0;outline-offset:-2px}
@media(prefers-reduced-motion:reduce){.surf-map *{transition:none!important}}

/* ── 홈 그래프(2026-10-06) — 대시보드에서 검정 공간으로 이어지고 그 안에 그래프가 자리 잡음. 점·선·색은 위 승인 규칙 그대로 ── */
/* 층: 바탕(고정, z 0) < 대시보드(문서 흐름, z 1) < 그래프(고정, 배경 없음, z 2) < 헤더(30)·슬라이더(45)·하단 탭(50) */
/* 바탕 — 움직이지 않는 한 장. 앱 배경에서 --dark만큼 검정으로 짙어짐(검정 막 한 겹, 그 밖의 반투명 검정 층 없음) */
.home-map__void{position:fixed;left:0;right:0;margin:0 auto;max-width:var(--app-max-width);top:0;bottom:0;z-index:0;pointer-events:none;background:var(--app-bg)}
.home-map__void::after{content:"";position:absolute;inset:0;background:#000;opacity:var(--dark,0)}
/* 탭 전환 중에만(tab-swipe.js가 data-swipe-edge로 표시) — 검정 바탕과 희미한 대시보드 흔적이 옆 탭과 맞닿는 쪽 16px만 옆 탭 배경색으로 부드럽게 이음.
   그래프 점·선·글자는 덮지 않고(카드 가장자리는 최대 6px), 바탕이 아직 앱 색일 때(--dark 0)는 효과 없음. 터치·포커스 없음, 전환이 끝나면 표시가 지워져 사라짐 */
.page[data-swipe-edge] > .home-map__void::before,.page[data-swipe-edge] > .home__body::before,.page[data-swipe-edge] > .home-map__dock::before{content:"";position:absolute;top:0;bottom:0;width:16px;z-index:2;pointer-events:none;opacity:var(--dark,0)}
.page[data-swipe-edge=right] > .home-map__void::before,.page[data-swipe-edge=right] > .home__body::before,.page[data-swipe-edge=right] > .home-map__dock::before{right:0;background:linear-gradient(to left,var(--app-bg),rgba(28,28,30,0))}
.page[data-swipe-edge=left] > .home-map__void::before,.page[data-swipe-edge=left] > .home__body::before,.page[data-swipe-edge=left] > .home-map__dock::before{left:0;background:linear-gradient(to right,var(--app-bg),rgba(28,28,30,0))}
/* 대시보드 — 아래에서 위로 차오르는 검정 그라데이션(아래 끝 농도 = 바탕과 같은 --dark → 경계 없음). 맨 위에서는 아래 여백에만 */
.page:has(> .home-map) > .home__body{position:relative;z-index:1;background:var(--app-bg)}
.page:has(> .home-map) > .home__body::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(to top,rgba(0,0,0,var(--dark,0)) 0,rgba(0,0,0,var(--dark-top,0)) var(--ramp,2px))}
/* At the scroll end the dashboard bottom clears the header completely. */
/* 그래프 화면만큼의 빈 자리 — 터치를 받되 세로 스크롤만 허용(touch-action: pan-y). 예전에는 터치를 통과시켜 손가락이
   페이지에 닿았고, 그래프가 다 보이지만 아직 안착 전(스크롤 끝 몇 px 전)일 때 두 손가락이 브라우저 자체 확대로
   이어졌습니다(visualViewport.scale 1→5, 2026-10-08 재현). 가로 끌기는 그대로 탭 스와이프로 갑니다. */
.home-map__space{touch-action:pan-y;
  height:calc(100vh - var(--topbar-h) - env(safe-area-inset-top) - var(--tabbar-reach) - env(safe-area-inset-bottom));
  height:calc(100dvh - var(--topbar-h) - env(safe-area-inset-top) - var(--tabbar-reach) - env(safe-area-inset-bottom))}
/* 그래프 층 — 배경 없이 점·선·글자만(검정은 바탕 한 장). 자리 잡기 전에는 터치를 받지 않음(카드·페이지 스크롤 우선),
   자리 잡은 뒤에는 모든 방향 끌기를 그래프가 받음 */
.home-map{position:fixed;left:0;right:0;margin:0 auto;max-width:var(--app-max-width);z-index:2;
  top:calc(var(--topbar-h) + env(safe-area-inset-top));bottom:0;border:0;border-radius:0;background:transparent;overflow:hidden;pointer-events:none}
.home-map.is-settled{pointer-events:auto}
.home-map .surf-map__stage{position:absolute;inset:0;background:transparent;will-change:transform,opacity}   /* 등장 위치·크기·밝기는 home-map.js */
.home-map .surf-map__stage svg{height:100%;aspect-ratio:auto;touch-action:none}
/* Brighten the network only, preserving each dot/edge's relative emphasis. */
.home-map .surf-map__stage > svg > g{filter:brightness(1.21)}
/* 자리 잡은 동안 헤더·하단 탭에서 끌어도 페이지가 내려오지 않게(돌아가기는 상단 띠·홈 버튼) */
html.home-map-settled .topbar,html.home-map-settled .tabbar{touch-action:none}
/* 안착 직전(p ≥ 0.9) — 화면 위쪽에 남은 희미한 대시보드 흔적에서도 두 손가락이 페이지 확대로 가지 않게(세로 스크롤은 그대로).
   위쪽 대시보드 상태에서는 기존처럼 브라우저 기본 동작 */
html.home-map-near .page:has(> .home-map) > .home__body{touch-action:pan-y}
/* 상단 띠 — 헤더 바로 아래 64px, 아래로 끌면 대시보드로. 작은 손잡이(시안)만 보임 */
.home-map__pull{position:absolute;left:calc(50% - 66px);right:0;top:0;height:64px;z-index:3;touch-action:none;box-sizing:border-box}
.home-map__grip{position:absolute;left:49px;top:13px;width:34px;height:4px;border-radius:2px;background:#3a3a3e;opacity:0;transition:opacity .25s}
/* Keep the visible Fit button reachable when the right-hand pull area is expanded. */
.home-map.is-settled .home-map__grip{opacity:1}
/* 고른 점 — 슬라이더 바로 위 한 줄, 눌러야 관련 기록이 펼쳐짐 */
.home-map__picked{display:none;position:absolute;left:10px;right:10px;z-index:2;
  bottom:calc(var(--tabbar-reach) + env(safe-area-inset-bottom) + 108px + 2px);border-radius:12px;background:rgba(18,18,20,.92)}
.home-map.is-picked .home-map__picked{display:block}
.home-map__pickhead{display:flex;align-items:center;min-height:42px;padding:0 12px;touch-action:none}
.home-map__pickhead .surf-map__status{margin:0}
/* 선택점 카드 — 작은 문서 목록 카드. 선택색(--accent-report) 계열의 은은한 반투명 바탕, 짧은 이동과 페이드로 등장.
   위치(left/top)는 home-map.js가 점을 따라 정합니다. 확대율과 상관없이 같은 크기 */
.home-map__tag{position:absolute;left:0;top:0;z-index:3;display:flex;flex-direction:column;align-items:flex-start;gap:2px;max-width:200px;
  padding:7px 11px 8px;border-radius:12px;border:1px solid rgba(165,255,0,.28);background:rgba(165,255,0,.055);
  -webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);color:#eef3e6;text-align:left;touch-action:none;
  opacity:0;visibility:hidden;transform:translateY(4px);transition:opacity .18s ease,transform .18s ease,visibility 0s linear .18s;pointer-events:none}
.home-map__tag.is-shown{opacity:1;visibility:visible;transform:none;transition:opacity .18s ease,transform .18s ease,visibility 0s;pointer-events:auto}
.home-map__tag-title{font-size:13px;font-weight:650;line-height:1.3;color:var(--accent-report)}
.home-map__tag-meta{font-size:11.5px;color:#c9cfbf;font-variant-numeric:tabular-nums;white-space:nowrap}
.home-map__tag:focus-visible{outline:2px solid var(--accent-report);outline-offset:2px}
/* 가운데 목록창 — 헤더·하단 탭 사이를 덮는 바탕(그래프가 은은하게 비침, 흐림 미지원이어도 읽히는 농도)과 가운데 창.
   바탕을 눌러도 닫히지 않음. 하단 탭은 그대로 쓸 수 있음 */
.home-map__modal{display:none;position:fixed;left:0;right:0;margin:0 auto;max-width:var(--app-max-width);z-index:48;
  top:calc(var(--topbar-h) + env(safe-area-inset-top));bottom:calc(var(--tabbar-reach) + env(safe-area-inset-bottom));touch-action:none}
.home-map__modal.is-open{display:flex;align-items:center;justify-content:center}
.home-map__scrim{position:absolute;inset:0;background:rgba(0,0,0,.28)}
.home-map__sheet{position:relative;display:flex;flex-direction:column;width:min(92%,420px);max-height:78%;border-radius:16px;
  background:rgba(30,31,28,.96);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(165,255,0,.16);box-shadow:0 18px 50px rgba(0,0,0,.55);overflow:hidden;transform-origin:center}
.home-map__sheet-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:16px 12px 10px 18px;border-bottom:1px solid rgba(255,255,255,.07)}
.home-map__sheet-title{margin:0;font-size:17px;font-weight:700;color:var(--accent-report)}
.home-map__sheet-meta{margin:3px 0 0;font-size:12.5px;color:#a9ad9f;font-variant-numeric:tabular-nums}
.home-map__sheet-close{flex:none;width:36px;height:36px;margin:-4px -2px 0 0;border:0;border-radius:10px;background:rgba(255,255,255,.06);color:#d8d8dc;font-size:22px;line-height:1;cursor:pointer}
.home-map__sheet-close:focus-visible{outline:2px solid var(--accent-report);outline-offset:1px}
.home-map__sheet-body{overflow:auto;overscroll-behavior:contain;touch-action:pan-y;padding:4px 14px 14px}
.home-map__sheet-body .surf-map__controls{padding:8px 0}
.home-map__sheet-body .surf-map__controls[hidden]{display:none}
.home-map__sheet-body .surf-map__results{max-height:none;overflow:visible;padding:0}
@media(prefers-reduced-motion:reduce){.home-map__tag,.home-map__tag.is-shown{transition:none;transform:none}}
/* 기간 슬라이더 — 하단 탭 바로 위(가운데 원·기기 안전 여백 밖). 지도 화면이 충분히 보일 때만 나타남 */
.home-map__dock{position:fixed;left:0;right:0;margin:0 auto;max-width:var(--app-max-width);z-index:45;
  bottom:calc(var(--tabbar-reach) + env(safe-area-inset-bottom));box-sizing:border-box;padding:5px 18px 3px;
  background:linear-gradient(transparent 28px,var(--app-bg) 52px);opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .32s ease,visibility 0s linear .32s;touch-action:none;color:#c7c7c9}
/* 나타날 때·사라질 때 모두 서서히 — 빠르게 스크롤해도 최소 0.32초에 걸쳐 흐려지고, 다 흐려진 뒤에 숨김 */
.home-map__dock.is-visible{visibility:visible;transition:opacity .32s ease,visibility 0s}
.home-map__dock.is-usable{pointer-events:auto}
.home-map__period{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.home-map__period-title{font-size:13px;font-weight:650;color:#eee}
.home-map__period-range{font-size:12px;color:#9c9ca4;font-variant-numeric:tabular-nums}
.home-map__range{--fill:100%;-webkit-appearance:none;appearance:none;display:block;width:100%;height:24px;margin:0;background:transparent;touch-action:none;cursor:pointer}
.home-map__range::-webkit-slider-runnable-track{height:3px;border-radius:2px;background:linear-gradient(90deg,#8e8e90 var(--fill),#38383d var(--fill))}
.home-map__range::-moz-range-track{height:3px;border-radius:2px;background:linear-gradient(90deg,#8e8e90 var(--fill),#38383d var(--fill))}
.home-map__range::-webkit-slider-thumb{-webkit-appearance:none;width:18.7px;height:18.7px;margin-top:-7.85px;border-radius:50%;border:0;background:#dedede}
.home-map__range::-moz-range-thumb{width:18.7px;height:18.7px;border-radius:50%;border:0;background:#dedede}
.home-map__range:focus-visible{outline:2px solid #5ec6f0;outline-offset:2px;border-radius:4px}
.home-map__ticks{display:flex;justify-content:space-between;margin:0 -6px}
.home-map__ticks button{border:0;background:none;padding:2px 6px;font-size:11px;color:#93939d;min-width:34px}
.home-map__ticks button:first-child{text-align:left}.home-map__ticks button:last-child{text-align:right}
.home-map__scope{margin:2px 0 0;font-size:11px;color:#7c7c84;line-height:1.4}
@media(prefers-reduced-motion:reduce){.home-map__dock,.home-map__dock.is-visible{transition:none}}


/* Extend the slider surface behind the tab cutout without moving its controls. */
.home-map__dock::after{content:"";position:absolute;left:0;right:0;top:calc(100% - 1px);height:calc(var(--tabbar-reach) + env(safe-area-inset-bottom) + 2px);background:var(--app-bg);pointer-events:none}

/* Period ticks → slider → one compact summary. Keep text legible; wrap only for unusually long values. */
.home-map__period{display:grid;grid-template-columns:minmax(0,1fr) 0 minmax(0,1fr) 0 minmax(0,1fr);align-items:center;gap:0;margin-top:1px;text-align:center;font-variant-numeric:tabular-nums}
.home-map__period-title{font-size:12px;font-weight:650;color:#dedee2;white-space:nowrap;text-align:center}
.home-map__period-range{font-size:11px;color:#9c9ca4;white-space:nowrap}
.home-map__period-divider{color:#616166;font-size:11px;justify-self:center}
.home-map__period .home-map__scope{margin:0;font-size:11px;color:#9c9ca4;white-space:nowrap;text-align:center}


/* Related-record sheet text, without enlarging graph labels. */
.home-map__sheet-body .surf-map__source{font-size:12px}
.home-map__sheet-body .surf-map__result strong{font-size:14px}
.home-map__sheet-body .surf-map__excerpt{font-size:14px;line-height:1.65}
.surf-map__expand-hint{font-size:12px;color:var(--accent-report)}
.surf-map__record.is-open .surf-map__excerpt{display:none}
.surf-map__record-detail{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .28s ease,opacity .28s ease}
.surf-map__record.is-open .surf-map__record-detail{grid-template-rows:1fr;opacity:1}
.surf-map__record-content{min-height:0;overflow:hidden}
.surf-map__document{padding:0 0 18px;user-select:text;-webkit-user-select:text}
.surf-map__document section+section{margin-top:18px}
.surf-map__document h4{font-size:14px;color:#d6d9d0;margin:0 0 6px}
.surf-map__document p{font-size:14px;line-height:1.75;color:#c5c6c9;margin:6px 0;white-space:pre-wrap;overflow-wrap:anywhere}
.surf-map__document p strong{font-weight:700}
@media(prefers-reduced-motion:reduce){.surf-map__record-detail{transition:none}}

/* Ownership covers empty space and overlays, not just the SVG. */
.home-map{touch-action:pan-y}
.home-map.is-settled{touch-action:none}
.surf-map__kind{display:inline-block;padding:2px 6px;margin-right:5px;border-radius:5px;font-size:11px;font-weight:700;line-height:1.4}
.surf-map__kind--log{color:var(--accent-forecast);background:rgba(94,198,240,.1)}
.surf-map__kind--report{color:var(--accent-star);background:rgba(184,155,219,.12)}