/* 3D neighborhood map — Layout: full-bleed site model; title card top-left, place list top-right (bottom sheet on phones), view controls bottom-left */
html,body{margin:0}
/* Layout: full-bleed 3D site model; title card top-left, place list top-right (bottom sheet on phones), view controls bottom-left */
:root{
  --ink:#24292c; --muted:#646b6f; --card:rgba(252,251,248,.94); --line:#dcd8cf;
  --accent:#9a4e33; --sky:#cfdbe5;
  --display:"Fraunces",Georgia,"Times New Roman",serif;
  --ui:"Figtree",system-ui,-apple-system,"Segoe UI",sans-serif;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--ink:#eef0ec;--muted:#a9b0b2;--card:rgba(32,37,40,.92);--line:#3c4447;--accent:#e0957a;color-scheme:dark}}
:root[data-theme="dark"]{--ink:#eef0ec;--muted:#a9b0b2;--card:rgba(32,37,40,.92);--line:#3c4447;--accent:#e0957a;color-scheme:dark}
html,body{height:100%}
body{background:var(--sky);color:var(--ink);font-family:var(--ui);overflow:hidden;position:relative}
#stage{position:absolute;inset:0;background:linear-gradient(#a9c1d8 0%,#cfdbe5 55%,#dfe3dc 100%)}
#stage canvas{display:block;width:100%;height:100%;outline:none;cursor:grab}
#stage canvas:active{cursor:grabbing}
#labels{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.poi{position:absolute;transform:translate(-50%,-100%);pointer-events:auto;cursor:pointer;display:flex;align-items:center;gap:8px;
  background:#fff;color:#24292c;border-radius:999px;padding:5px 12px 5px 6px;font:600 13px var(--ui);white-space:nowrap;
  box-shadow:0 2px 10px rgba(0,0,0,.22);transition:transform .15s}
.poi:hover{transform:translate(-50%,-100%) scale(1.05)}
.poi i{width:18px;height:18px;border-radius:50%;flex:none;border:2px solid #fff;box-shadow:0 0 0 1px rgba(0,0,0,.15)}
.poi small{font-weight:500;color:#646b6f;margin-left:2px}
.poi::after{content:"";position:absolute;left:50%;bottom:-5px;width:10px;height:10px;background:#fff;transform:translateX(-50%) rotate(45deg);z-index:-1}
#lm{position:absolute;transform:translate(-50%,-100%);pointer-events:none;display:flex;flex-direction:column;align-items:center}
#lm .tag{background:#9a4e33;color:#fff;border-radius:10px;padding:6px 14px 7px;text-align:center;box-shadow:0 4px 14px rgba(0,0,0,.28)}
#lm b{display:block;font:600 20px/1.1 var(--display);letter-spacing:.01em}
#lm span{font:500 11.5px var(--ui);opacity:.9}
#lm .stem{width:2px;height:42px;background:linear-gradient(#9a4e33,rgba(154,78,51,.2))}
.card{position:absolute;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:0 6px 24px rgba(0,0,0,.14);backdrop-filter:blur(6px)}
#title{top:calc(16px + env(safe-area-inset-top,0px));left:max(16px,env(safe-area-inset-left,0px));padding:14px 18px;max-width:330px}
#title .eyebrow{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:700}
#title h1{margin:4px 0 0;font:600 30px/1.05 var(--display);text-wrap:balance}
#title p{margin:8px 0 0;font-size:13px;color:var(--muted);line-height:1.45}
#title dl{display:grid;grid-template-columns:repeat(3,auto);gap:2px 16px;margin:10px 0 0}
#title dt{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:700;grid-row:2}
#title dd{margin:0;font:600 18px var(--display);font-variant-numeric:tabular-nums;grid-row:1}
#places{top:calc(16px + env(safe-area-inset-top,0px));right:max(16px,env(safe-area-inset-right,0px));width:276px;padding:12px}
#places h2{margin:0 6px 8px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:700}
#places ul{list-style:none;margin:0;padding:0;display:grid;gap:2px}
#places button{all:unset;box-sizing:border-box;width:100%;display:grid;grid-template-columns:12px 1fr auto;align-items:center;gap:10px;padding:8px;border-radius:9px;cursor:pointer;font-size:14px;font-weight:600}
#places button:hover,#places button:focus-visible{background:color-mix(in srgb,var(--accent) 12%,transparent)}
#places button:focus-visible{outline:2px solid var(--accent)}
#places .chip{width:12px;height:12px;border-radius:50%}
#places .dist{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums;font-weight:600}
#places .note{margin:8px 6px 2px;font-size:11.5px;color:var(--muted);line-height:1.4}
#tools{bottom:calc(16px + env(safe-area-inset-bottom,0px));left:max(16px,env(safe-area-inset-left,0px));display:flex;flex-wrap:wrap;gap:6px;padding:6px;max-width:calc(100% - 32px)}
#tools button{font:600 13px var(--ui);color:var(--ink);background:transparent;border:1px solid var(--line);border-radius:9px;padding:7px 12px;cursor:pointer}
#tools button:hover{border-color:var(--accent)}
#tools button[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:#fff}
#tools button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
#full{display:none;font:600 13px var(--ui);color:var(--ink);border:1px solid var(--line);border-radius:9px;padding:7px 12px;text-decoration:none}
#full:hover{border-color:var(--accent)}
html.embed #full{display:inline-block}
#loading{position:absolute;inset:0;display:grid;place-items:center;font:500 22px var(--display);color:#4b5559}
@media (max-width:900px){
  #title{max-width:calc(100% - 32px);padding:10px 14px}
  #title h1{font-size:23px}
  #title p,#title dl{display:none}
  #places{top:auto;bottom:calc(66px + env(safe-area-inset-bottom,0px));left:max(16px,env(safe-area-inset-left,0px));right:max(16px,env(safe-area-inset-right,0px));width:auto;padding:6px}
  #places h2,#places .note{display:none}
  #places ul{grid-template-columns:1fr 1fr}
  #places button{font-size:12.5px;padding:6px;gap:7px;grid-template-columns:10px 1fr}
  #places .dist{display:none}
  #tools button,#full{padding:6px 9px;font-size:12px}
  .poi{font-size:11.5px}.poi small{display:none}
  #lm b{font-size:16px}#lm span{display:none}
}
[hidden]{display:none!important}