.family-map{overflow:auto;max-height:65vh;min-height:300px;border:1px solid #d6dfd7;border-radius:22px;background-color:#f5f7f1;background-image:radial-gradient(#cdd9cc .8px,transparent .8px);background-size:18px 18px;overscroll-behavior:contain}.family-map-canvas{position:relative}.family-map svg{position:absolute;inset:0;overflow:visible}.family-map path{fill:none;stroke:#9ab4a1;stroke-width:2.5}.family-map path.relative{stroke:#b1a58a}.family-map path.uncertain{stroke-dasharray:7 6;stroke:#b59456}.map-person{position:absolute;width:210px;height:112px;text-align:left;border-radius:16px;padding:12px 14px;background:#fff;border:1px solid #bed1c2;box-shadow:0 5px 15px #2544310c;display:flex;flex-direction:column;gap:4px;line-height:1.2}.map-person strong{font-size:14px;max-height:36px;overflow:hidden}.map-person small{font-size:11px;opacity:.8}.map-avatar{position:absolute;right:10px;top:-12px;border:3px solid #f5f7f1;background:#dce9d9;border-radius:50%;height:28px;width:28px;font-size:13px;display:grid;place-items:center}.map-focus{background:#285b46;color:white;border:2px solid #aeb86b;box-shadow:0 7px 20px #25443125}.map-focus .map-avatar{color:#285b46}.family-map-head h2{margin-top:0}.family-map-head{margin-bottom:20px}.family-map-head button{margin-top:6px}.map-panel{padding:20px!important}@media(max-width:600px){.map-panel{padding:12px!important}.family-map-head{padding:8px}.family-map{max-height:60vh}}
.map-eyebrow{font-size:11px;font-weight:800;letter-spacing:.14em;color:#567960}.family-map-head h2{font-size:clamp(26px,5vw,38px);margin:8px 0}.map-tools{display:flex;align-items:center;flex-wrap:wrap;gap:8px}.map-tools button{min-height:44px;margin:0!important}.map-tools output{min-width:48px;text-align:center;font-size:13px}.map-search{display:block;margin:16px 0 10px;font-weight:600}.map-search input{display:block;width:100%;max-width:400px;margin-top:6px}.map-legend{display:flex;gap:16px;flex-wrap:wrap;font-size:12px;color:#65756c}.family-map{height:60vh;max-height:720px;cursor:grab;background-image:radial-gradient(#bdcec4 .8px,transparent .8px),radial-gradient(ellipse at 30% 20%,#e0eee2,transparent 65%);background-size:22px 22px,100% 100%;box-shadow:inset 0 0 70px #dbe8dd50}.map-dragging{cursor:grabbing;user-select:none}.family-map-canvas{transform-origin:0 0}.map-person{cursor:pointer;transition:box-shadow .2s,border-color .2s,opacity .2s;background:linear-gradient(145deg,#fff,#f8fbf7);box-shadow:0 8px 22px #183d2910;animation:map-appear .35s ease-out}.map-person:hover,.map-person:focus-visible{border-color:#39785c;box-shadow:0 12px 28px #183d292b;outline:3px solid #91bda280;outline-offset:3px;z-index:2}.map-person small{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;max-width:100%}.map-focus{background:linear-gradient(135deg,#285b46,#163d30);color:white;box-shadow:0 10px 28px #25443135}.map-avatar{background:linear-gradient(135deg,#e9dcb9,#ccdfce);width:34px;height:34px;top:-16px}.family-map path{stroke:#b4c9ba;stroke-width:2}.family-map path.map-edge-focus{stroke:#4c8868;stroke-width:3}.family-map path.uncertain{stroke:#b59456;stroke-dasharray:7 6}.map-muted{opacity:.22}.map-match{outline:3px solid #bda665;outline-offset:2px}.map-size{position:relative}@keyframes map-appear{from{opacity:0}to{opacity:1}}@media(prefers-reduced-motion:reduce){.map-person{animation:none;transition:none}.family-map{scroll-behavior:auto}}@media(max-width:600px){.map-tools{gap:5px}.map-tools button{padding:9px 12px;font-size:13px}.map-legend{gap:8px}.family-map{height:58vh;min-height:320px}.map-search input{max-width:100%}}