/* maps.css - Charter-A house map look (skill: charter-maps) for the Ericraft maps. Everything scoped under .bhd. */
.bhd{--mono:ui-monospace,"Cascadia Mono",Consolas,"Courier New",monospace;position:relative;border:1px solid rgba(201,165,90,.5);border-radius:7px;overflow:hidden;background:#0a1220;box-shadow:0 14px 34px rgba(16,29,48,.2);color:#cdd8e8;text-align:left;break-inside:avoid}
.bhd *{box-sizing:border-box}
.bhd p{margin:0}
.bhdTop{display:flex;justify-content:space-between;align-items:center;gap:6px 14px;flex-wrap:wrap;padding:9px 14px;background:linear-gradient(90deg,#101d30,#173057);border-bottom:1px solid rgba(201,165,90,.45);font:600 11.5px/1.4 var(--mono);letter-spacing:.09em;text-transform:uppercase;color:#aebbd0}
.bhdTop b{color:#fff;letter-spacing:.12em;font-size:12.5px;font-weight:700}
.bhdTag{background:#c9a55a;color:#101d30;padding:2px 8px;border-radius:2px;font-weight:700;margin-right:10px}
.bhd .bhdMap{height:460px;background:#0a1220;position:relative}
.bhd-pins .bhdMap{height:clamp(420px,50vw,560px)}
.bhd-route .bhdMap{height:340px}
.bhd-mini .bhdMap{height:340px}
.bhd .bhdMap .leaflet-tile-pane{filter:saturate(.72) contrast(1.1) brightness(.86) sepia(.12) hue-rotate(-6deg)}
.bhd .bhdMap.leaflet-container{background:#0a1220;font-family:inherit;font-size:12px;line-height:1.4}
.bhd .bhdMap img.leaflet-tile{max-width:none!important}
.bhd .bhdMap:after{content:"";position:absolute;inset:0;z-index:450;pointer-events:none;background:linear-gradient(90deg,rgba(201,165,90,.11) 1px,transparent 1px) 0 0/72px 72px,linear-gradient(0deg,rgba(201,165,90,.11) 1px,transparent 1px) 0 0/72px 72px,radial-gradient(ellipse at center,transparent 55%,rgba(5,10,20,.55) 100%)}
.bhd .bhdMap .leaflet-control-attribution{background:rgba(10,18,32,.78);color:#8fa0b8;font-size:10px}
.bhd .bhdMap .leaflet-control-attribution a{color:#c9a55a}
.bhd .bhdMap .leaflet-bar{border:1px solid rgba(201,165,90,.5);box-shadow:none}
.bhd .bhdMap .leaflet-bar a{background:#101d30;color:#e8c777;border-color:rgba(201,165,90,.5);text-decoration:none}
.bhd .bhdMap .leaflet-bar a:hover{background:#1b2f4d;color:#fff}
@media(pointer:coarse){.bhd .bhdMap .leaflet-bar a{width:40px;height:40px;line-height:40px}}
.bhdN{position:absolute;right:10px;top:10px;z-index:600;width:34px;height:34px;border:1px solid rgba(201,165,90,.6);border-radius:50%;background:rgba(16,29,48,.78);color:#f0d28a;font:700 12px/34px var(--mono);text-align:center}
.bhdN:before{content:"";position:absolute;left:15px;top:-9px;border:5px solid transparent;border-bottom:8px solid #f0d28a;border-top:0}
/* drawn picture (build-time SVG): shown until the live map is ready, and whenever tiles cannot load (offline preview) */
.bhd .bhdFb{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:1}
.bhd.bhd-ready .bhdFb{display:none}
.bhd .bhdFbNote{position:absolute;left:10px;bottom:8px;z-index:2;font:500 11px/1.3 var(--mono);color:#8fa1b8;background:rgba(10,18,32,.8);padding:3px 7px;border-radius:3px}
.bhd.bhd-ready .bhdFbNote{display:none}
.bhd-fail .bhdMap:after{display:none}
.bhd .bhdRing{background:none;border:0}
.bhd .bhdRing span{display:block;text-align:center;font:600 10px/14px var(--mono);letter-spacing:.1em;color:#f0d28a;text-shadow:0 0 3px #000,0 0 6px #000;white-space:nowrap}
.bhd .bhdMkW{background:none;border:0}
.bhdMk{position:relative;width:38px;height:38px}
.bhdMk i{position:absolute;inset:0;border:2px solid #f0d28a;border-radius:50%;animation:bhdPing 2.4s ease-out infinite}
.bhdMk i.d{inset:14px;background:#f0d28a;animation:none;box-shadow:0 0 12px #f0d28a}
.bhdMk .x{position:absolute;inset:0}
.bhdMk .x:before,.bhdMk .x:after{content:"";position:absolute;background:#f0d28a;opacity:.95}
.bhdMk .x:before{left:18px;top:-6px;width:2px;height:50px}
.bhdMk .x:after{top:18px;left:-6px;height:2px;width:50px}
.bhdMk .bhdE{position:absolute;left:50%;top:50%;width:24px;height:24px;margin:-12px 0 0 -12px;border-radius:50%;background:#101d30;border:2px solid #f0d28a;color:#f4f1ea;font:400 14px/20px Georgia,serif;text-align:center;box-shadow:0 0 4px rgba(0,0,0,.6)}
.bhdMkL{position:absolute;left:50px;top:-2px;white-space:nowrap;padding:4px 9px;background:rgba(16,29,48,.94);border:1px solid #c9a55a;border-radius:3px;line-height:1.25;text-align:left}
.bhdMkL b{display:block;font:700 11.5px/1.2 var(--mono);letter-spacing:.1em;color:#fff}
.bhdMkL span{display:block;font:500 10.5px/1.25 var(--mono);color:#f0d28a}
.bhdMkL-b{left:50%;top:44px;transform:translateX(-50%);text-align:center}
@keyframes bhdPing{0%{transform:scale(.55);opacity:.95}80%,100%{transform:scale(1.5);opacity:0}}
.bhd .bhdPinW{background:none;border:0}
.bhdPin{position:relative;display:block;width:28px;height:28px;cursor:pointer}
.bhdPin:before{content:"";position:absolute;inset:-5px}
.bhdPin i{position:absolute;left:50%;top:50%;width:11px;height:11px;margin:-5.5px 0 0 -5.5px;border-radius:50%;background:#f4f1ea;border:2px solid #101d30;box-shadow:0 0 0 1px rgba(240,210,138,.75),0 1px 4px rgba(0,0,0,.6);transition:transform .15s,background .15s}
.bhdPin.t-air i{background:#f0d28a}
.bhdPin b{position:absolute;white-space:nowrap;pointer-events:none;font:600 11px/1 "Manrope",system-ui;letter-spacing:.02em;color:#f4f1ea;background:rgba(16,29,48,.86);border:1px solid rgba(201,165,90,.45);border-radius:3px;padding:4px 7px;transition:opacity .12s}
.bhdPin.pl-r b,.bhdPin.pl-h b{left:calc(50% + 10px);top:50%;transform:translateY(-50%)}
.bhdPin.pl-l b{right:calc(50% + 10px);top:50%;transform:translateY(-50%)}
.bhdPin.pl-t b{left:50%;bottom:calc(50% + 11px);transform:translateX(-50%)}
.bhdPin.pl-b b{left:50%;top:calc(50% + 11px);transform:translateX(-50%)}
.bhdPin.pl-h b{opacity:0}
.bhdPin:hover i,.bhdPin.on i{background:#f0d28a;transform:scale(1.55)}
.bhdPin:hover b,.bhdPin.on b,.bhdPinW:focus .bhdPin b{opacity:1;color:#fff;border-color:#f0d28a;background:#101d30}
.bhdPinW:focus{outline:none}.bhdPinW:focus .bhdPin i{background:#f0d28a;transform:scale(1.55);box-shadow:0 0 0 2px #f0d28a}
.bhd .bhdRead{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 16px;padding:11px 14px;min-height:68px;background:#0d1828;border-top:1px solid rgba(201,165,90,.3)}
.bhdRead .mi-k{flex:0 0 100%;font:700 10.5px/1.3 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:#f0d28a}
.bhdRead .mi-t{font:400 21px/1.2 Georgia,serif;color:#fff}
.bhdRead .mi-s{font:500 12.5px/1.4 var(--mono);color:#aebbd0}
.bhdRead a{margin-left:auto;align-self:center;color:#f0d28a;text-decoration:none;border:1px solid rgba(201,165,90,.55);padding:9px 12px;border-radius:4px;font:600 11.5px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase}
.bhdRead a:hover{background:#c9a55a;color:#101d30}
.bhdFoot{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;justify-content:space-between;padding:10px 14px;background:#101d30;border-top:1px solid rgba(201,165,90,.35);font:500 11.5px/1.4 var(--mono);color:#8fa1b8}
.bhdFoot>a{color:#f0d28a;text-decoration:none;border:1px solid rgba(201,165,90,.55);padding:8px 12px;border-radius:4px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.bhdFoot>a:hover{background:#c9a55a;color:#101d30}
.bhdFoot .bhdBtns{display:flex;gap:8px;flex-wrap:wrap}
.bhdFoot .bhdBtns a{color:#f0d28a;text-decoration:none;border:1px solid rgba(201,165,90,.55);padding:8px 12px;border-radius:4px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.bhdFoot .bhdBtns a:hover{background:#c9a55a;color:#101d30}
@media(max-width:900px){.bhd .bhdMap{height:380px}.bhd-pins .bhdMap{height:460px}.bhd-route .bhdMap{height:340px}}
@media(max-width:520px){
  .bhd .bhdMap{height:340px}.bhd-pins .bhdMap{height:440px}.bhd-route .bhdMap{height:360px}
  .bhd .bhdMkL{left:-52px;top:44px;text-align:center}.bhd-route .bhdMkL{max-width:170px}
  .bhdFoot{justify-content:flex-start}
  .bhdRead .mi-t{font-size:19px}.bhdRead a{margin-left:0}
  .bhdTop{font-size:10.5px;letter-spacing:.06em}.bhdTop b{font-size:11.5px}
}
@media(prefers-reduced-motion:reduce){.bhdMk i{animation:none}}
@media print{.bhd .bhdMap{display:none}}
.bhd .bhdFoot a,.bhd .bhdRead a{color:#f0d28a!important;text-decoration:none!important}
.bhd .bhdFoot a:hover,.bhd .bhdRead a:hover{background:#c9a55a!important;color:#101d30!important}
.bhd .bhdTop b,.bhd .bhdMkL b{color:#fff!important}
.bhd .bhdMkL span{color:#f0d28a!important}
@media(max-width:520px){.bhd-pins .bhdMkL{display:none}}
