/* About page globe (10 Oct 2026): MapLibre globe + 'STOP'-style pill markers after 11moissanstoit.com. Loaded by tpl/_globe.php only.
   Palette = logo (ttwt-about.css --lg-*): blue #2796c3, sky #9ce1ff, grey #535353; band near-black like the header. */
.ttwt-globe{--g-ink:#0b0e14;--g-blue:#2796c3;--g-sky:#9ce1ff;position:relative;margin:22px 0 36px;background:var(--g-ink);color:#fff;text-align:left;overflow:hidden}
.ttwt-globe-map{width:100%;height:min(calc(100svh - 82px),900px);min-height:520px;background:var(--g-ink)}
.ttwt-globe .maplibregl-canvas{outline:0}
.ttwt-globe .maplibregl-ctrl-top-right{top:14px;right:14px}
.ttwt-globe .maplibregl-ctrl-attrib{font:11px/1.4 var(--bs-body-font-family,Lato,sans-serif)}
.ttwt-globe .maplibregl-cooperative-gesture-screen{font:600 15px/1.4 var(--bs-body-font-family,Lato,sans-serif);background:rgba(11,14,20,.62)}

/* pill: top band + name box with an arrow foot, on a 2px stem (the reference's STOP / 01 pin). MapLibre positions the outer
   element with transform, so hover / selected scale lives on the inner .ttwt-pin */
.ttwt-pin-w{z-index:1}
.ttwt-pin-w.is-hid{visibility:hidden}
.ttwt-pin-w:hover,.ttwt-pin-w.is-on{z-index:3}
.ttwt-pin{--pin-top:#111;--pin-ink:#111;display:flex;flex-direction:column;align-items:center;cursor:pointer;font-family:var(--bs-body-font-family,Lato,sans-serif);filter:drop-shadow(0 1px 2px rgba(0,0,0,.45));transform-origin:50% 100%;transition:transform .18s}
.ttwt-pin:hover,.ttwt-pin.is-on{transform:scale(1.2)}
.ttwt-pin:focus-visible{outline:2px solid var(--g-sky);outline-offset:2px}
.ttwt-pin-b{background:#fff;padding:1.5px 1.5px 0;clip-path:polygon(0 0,100% 0,100% calc(100% - 5px),50% 100%,0 calc(100% - 5px))}
.ttwt-pin-t{background:var(--pin-top);color:#fff;font-size:8px;line-height:1;font-weight:700;letter-spacing:.08em;text-transform:uppercase;text-align:center;padding:3px 6px 2px;border-radius:2px 2px 0 0;white-space:nowrap}
.ttwt-pin-n{color:var(--pin-ink);font-size:12px;line-height:1;font-weight:700;letter-spacing:.03em;text-transform:uppercase;text-align:center;padding:4px 6px 8px;white-space:nowrap}
.ttwt-pin-s{width:2px;height:7px;background:linear-gradient(to top,#8a9199,#3b444b)}
.ttwt-pin.is-region{--pin-top:var(--g-blue)}
.ttwt-pin.is-region .ttwt-pin-n{white-space:normal;max-width:150px;line-height:1.15}
.ttwt-pin.is-home{--pin-ink:var(--g-blue)}
.ttwt-pin.is-on{--pin-top:var(--g-blue)}

/* region chips over the map foot: the atlas index (count + name) as the map's navigation */
.ttwt-globe-nav{position:absolute;left:16px;right:16px;bottom:16px;z-index:2;display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:4px 0;pointer-events:none}
.ttwt-globe-nav::-webkit-scrollbar{display:none}
.ttwt-globe-chip{pointer-events:auto;flex:0 0 auto;margin:0;border:1px solid rgba(255,255,255,.3);background:rgba(11,14,20,.72);color:#fff;font:600 12px/1 var(--bs-body-font-family,Lato,sans-serif);letter-spacing:.05em;text-transform:uppercase;padding:10px 13px;border-radius:999px;cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:background .18s,border-color .18s,color .18s}
.ttwt-globe-chip b{color:var(--g-sky);font-weight:700;margin-right:5px}
.ttwt-globe-chip:hover{border-color:#fff}
.ttwt-globe-chip:focus-visible{outline:2px solid var(--g-sky);outline-offset:2px}
.ttwt-globe-chip.is-on{background:#fff;color:#111;border-color:#fff}
.ttwt-globe-chip.is-on b{color:var(--g-blue)}

@media (max-width:767px){
  .ttwt-globe{margin:16px 0 24px}
  .ttwt-globe-map{height:min(calc(100svh - 70px),600px);min-height:460px}
  .ttwt-globe-nav{left:12px;right:12px;bottom:12px}
  .ttwt-globe-chip{padding:9px 11px;font-size:11px}
  .ttwt-pin-n{font-size:11px}
  .ttwt-pin.is-region .ttwt-pin-n{max-width:104px}
}
@media (prefers-reduced-motion:reduce){.ttwt-pin,.ttwt-globe-chip{transition:none}}