/* ══ Windrose Park Antwerp site map ════════════════════════════════════
   The one map of the site and what is around it: the aerial pyramid from
   120 km down to the parcel, every turbine within 15 km, the hall and the
   parcel boundary, and the heat customers next door.

   Markup lives in wr-sitemap.html, behaviour in wr-sitemap.js, pan and zoom
   in the shared wr-map.js. Include all three; the map carries its own dark
   palette so it drops onto a light or a dark page unchanged.

   🔴 Sizes here are USER UNITS. The home viewBox is 11.6 units wide and the
   map renders ~1052 px, so 1 unit = 90.69 px and a plain "font-size:9.5px"
   would draw an 862 px glyph. Every label size is the intended screen size
   divided by 90.69; the .pk* rules divide by 2.198 instead because they sit
   inside <g class="parkzoom" ... scale(0.0242327)>.
   ═══════════════════════════════════════════════════════════════════════ */
.wrmap{position:relative}
.wrmap svg{touch-action:pan-y}
.wrmap svg.wr-zoom.on{cursor:grab;touch-action:none}
.wrmap svg.wr-zoom.drag{cursor:grabbing}
.wrmap:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.zctl{position:absolute;top:14px;right:14px;z-index:2;display:flex;flex-direction:column;gap:4px}
.zctl button{width:28px;height:28px;padding:0;display:grid;place-items:center;cursor:pointer;
  font:600 15px/1 -apple-system,"Segoe UI",Roboto,sans-serif;color:#eaf2ff;
  background:rgba(6,16,31,.72);border:1px solid rgba(74,158,255,.34);border-radius:6px;
  backdrop-filter:blur(6px)}
.zctl button:hover{background:rgba(11,32,60,.94);border-color:rgba(74,158,255,.62)}
.zctl button:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.zctl button[disabled]{opacity:.35;cursor:default}
.mapstack{position:relative;margin:12px 0}
.parkzoom{opacity:0}
.wrmap .wland,.wrmap .wwater{display:none}      /* the photo is the base now */
.portscrim{fill:#0b1220;opacity:.34}            /* so the blue annotations still read */
/* strokes and dashes held at screen weight by the renderer, not by script */
.annolayer *:not(text){vector-effect:non-scaling-stroke}
.mapstack .wrmap{margin:0;padding-top:48px}
.mapstack .zctl{top:52px}
.wrmap .wc-in{fill:#4a9eff;fill-opacity:.10;stroke:#4a9eff;stroke-width:2}
.wrmap .wc-key-in{fill:#4a9eff;fill-opacity:.20;stroke:#4a9eff;stroke-width:2}
.wrmap .wc-key-out{fill:#4a9eff;fill-opacity:.08;stroke:#4a9eff;stroke-width:1.6;stroke-dasharray:4 3}
.wrmap .wc-out{fill:#4a9eff;fill-opacity:.045;stroke:#4a9eff;stroke-width:1.6;stroke-dasharray:8 5}
.wrmap .wcl{stroke:#4a9eff;stroke-width:1;opacity:.75}
/* 🔴 Label sizes here are USER UNITS, not screen px. This map's viewBox is
   11.6 units wide and renders ~1052 px, so 1 unit = 90.69 px: a plain
   "font-size:9.5px" drew an 862 px glyph. Every value below is the intended
   screen size divided by 90.69. The .pk* rules are exempt — they live inside
   <g class="parkzoom" ... scale(0.0242327)> and size themselves. */
.wrmap .wct-in{font-size:0.1268px;font-weight:700;fill:#4a9eff;paint-order:stroke fill;stroke:#0d1f38;stroke-width:0.0386;stroke-linejoin:round}
.wrmap .wct-out{font-size:0.1213px;font-weight:700;fill:#4a9eff;opacity:.9;paint-order:stroke fill;stroke:#0d1f38;stroke-width:0.0386;stroke-linejoin:round}
.wrmap .wland{fill:#0d1f38}
.wrmap .wlead{stroke:#c9dcf5;stroke-width:.8;opacity:.5}
.wrmap .wlgt{font-size:0.1103px;fill:#c9dcf5}
.wrmap .wmt{font-size:0.1323px;font-weight:700;fill:#7a9abf}
.wrmap .wnt{font-size:0.1103px;font-weight:600;fill:#4a9eff;paint-order:stroke fill;stroke:#0d1f38;stroke-width:0.0386;stroke-linejoin:round}
.wrmap .wpanel{fill:none;stroke:rgba(74,158,255,.22);stroke-width:1}
.wrmap .wplace{font-size:0.1213px;font-weight:600;fill:#7a9abf;opacity:.75;paint-order:stroke fill;stroke:#0d1f38;stroke-width:0.0331;stroke-linejoin:round}
.wrmap .wringt{font-size:0.0992px;fill:#c9dcf5;opacity:.5}
.wrmap .wroad{fill:none;stroke:rgba(74,158,255,.22);stroke-width:3.2;stroke-linecap:round}
.wrmap .wscale{fill:none;stroke:#c9dcf5;stroke-width:1.3;opacity:.7}
.turblayer circle{vector-effect:non-scaling-stroke}
.wrmap .wt-near{stroke:#f0f4ff;stroke-width:1.3}
.wrmap .wt-o{fill:#7a9abf;fill-opacity:.55;stroke:#7a9abf;stroke-width:.8}
.wrmap .wt-u{fill:none;stroke:#7a9abf;stroke-width:1;opacity:.6}
.wrmap .wt-v{fill:#4a9eff;fill-opacity:.85;stroke:#4a9eff;stroke-width:.8}
/* A HUD sizes itself (see the wrhud script): the panel and the legend keep one
   screen size at every zoom, so their type goes back to plain screen px and has
   to win against the inline font-size the map engine writes each frame. */
.wrmap .wrhud .wtt{font-size:10.5px!important}.wrmap .wrhud .wtc{font-size:11px!important}
.wrmap .wrhud .wtl2{font-size:9.5px!important}.wrmap .wrhud .wtv{font-size:10.5px!important}
.wrmap .wrhud .wtv2{font-size:14px!important}.wrmap .wrhud .wlgt{font-size:10px!important}
.wrmap .wtally{fill:#0d1f38;stroke:rgba(74,158,255,.22);stroke-width:1;opacity:.96}
.wrmap .wtc{font-size:0.1213px;font-weight:700;fill:#c9dcf5}
.wrmap .wtl2{font-size:0.1048px;fill:#c9dcf5;opacity:.65}
.wrmap .wtt{font-size:0.1158px;font-weight:700;fill:#7a9abf}
.wrmap .wtv{font-size:0.1158px;font-weight:700;fill:#4a9eff;font-variant-numeric:tabular-nums}
.wrmap .wtv2{font-size:0.1544px;font-weight:700;fill:#c9dcf5;font-variant-numeric:tabular-nums}
.wrmap .wus{fill:#f0a04a;stroke:#0d1f38;stroke-width:1.6}
.wrmap .hcp{fill:#f5a623;stroke:#0d1f38;stroke-width:1.4}
.wrmap .hcpt{font-size:0.1048px;font-weight:700;fill:#f5a623;paint-order:stroke fill;stroke:#0d1f38;stroke-width:0.0353;stroke-linejoin:round}
.wrmap .hcpl{stroke:#f5a623;stroke-width:.9;opacity:.65}
.wrmap .wwater{fill:#08182e;fill-opacity:.7;stroke:none}
.zhint{position:absolute;left:14px;bottom:14px;z-index:2;pointer-events:none;
  font-size:10.5px;letter-spacing:.03em;color:#eaf2ff;
  background:rgba(6,16,31,.66);border:1px solid rgba(74,158,255,.22);border-radius:999px;
  padding:4px 8px;backdrop-filter:blur(6px);transition:opacity .25s}
.zhint.gone{opacity:0}
@media print{.zctl,.zhint{display:none}}
.wrmap{--line:rgba(74,158,255,.22);--acc:#4a9eff;background:#0d1f38;border:1px solid var(--line);border-radius:8px;padding:12px;margin:12px 0;overflow-x:auto}
.wrmap svg{min-width:0;width:100%;height:auto;display:block}
.wrmap .pkarr{fill:none;stroke:#fff;stroke-width:1.6;opacity:.9}
.wrmap .pkdim{fill:#0b1220;opacity:.14}
.wrmap .pkhall{fill:#fff;fill-opacity:.10;stroke:#fff;stroke-width:2.2}
/* Inside <g class="parkzoom" ... scale(0.0242327)> one unit is ~2.2 screen px, so
   these are the intended screen sizes divided by 2.198. The geometry below is in
   metres and is already right; only the type was authored as if 1 unit = 1 px. */
.wrmap .pkhallt,.wrmap .pknote{paint-order:stroke fill;stroke:#0b1220;stroke-width:1.183;stroke-linejoin:round;fill:#fff}
.wrmap .pkhallt{font-size:5.005px;font-weight:700}
.wrmap .pkmt2{font-size:5.46px;font-weight:700;fill:#fff;paint-order:stroke fill;stroke:#0b1220;stroke-width:1.365;stroke-linejoin:round}
.wrmap .pknote{font-size:4.55px;font-weight:600}
.wrmap .pkpanel{fill:none;stroke:var(--line);stroke-width:1}
.wrmap .pkparcel{fill:none;stroke:#fbbf24;stroke-width:2.2;stroke-dasharray:9 5}
.wrmap .pkpin{fill:#0b1220;fill-opacity:.72;stroke:#fff;stroke-width:1.4}
.wrmap .pkpint{font-size:4.55px;font-weight:700;fill:#fff}