/* Keep labels readable and anchored to the original map proportions. */
.hl-map-panel--labels { padding:24px 18px 18px; margin-top:28px !important; }
.hl-map-scroll { position:relative; z-index:1; overflow-x:auto; overscroll-behavior-x:contain; scrollbar-width:thin; scrollbar-color:#65559a #12131b; border-radius:12px; }
.hl-map-scroll:focus-visible { outline:2px solid #aa95ff; outline-offset:3px; }
.hl-map-canvas { position:relative; width:100%; min-width:900px; aspect-ratio:1920/791; }
.hl-map-panel--labels .map-image { display:block; width:100%; height:100%; max-height:none; object-fit:fill; opacity:.62; }
.hl-map-connectors { position:absolute; inset:0; z-index:2; width:100%; height:100%; pointer-events:none; }
.hl-map-connectors line { stroke:#9b85ed; stroke-width:1; vector-effect:non-scaling-stroke; opacity:.65; }
.hl-map-markers { position:absolute; inset:0; z-index:3; margin:0; padding:0; list-style:none; }
.hl-map-marker { list-style:none; }
.hl-map-pin { position:absolute; left:var(--pin-x); top:var(--pin-y); width:8px; height:8px; transform:translate(-50%,-50%); border-radius:50%; background:#c3b2ff; box-shadow:0 0 0 5px rgba(135,102,241,.17),0 0 16px rgba(135,102,241,.65); }
.hl-map-label { position:absolute; left:var(--label-x); top:var(--label-y); transform:translate(-50%,-50%); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; width:142px; min-height:62px; padding:9px 10px; border:1px solid rgba(167,144,246,.28); border-radius:11px; background:rgba(15,17,26,.96); box-shadow:0 5px 18px rgba(0,0,0,.2); text-align:center; }
.hl-map-country { display:flex; align-items:center; justify-content:center; gap:6px; color:#e6e9f1; font-size:12px; font-weight:600; line-height:1.3; }
.hl-map-country img { width:17px; height:12px; object-fit:cover; border-radius:2px; flex-shrink:0; }
.hl-map-label strong { color:#d5caff; font-size:15px; font-weight:700; line-height:1.2; }
.hl-map-marker--greece .hl-map-label { border-color:rgba(174,144,255,.65); background:#211a37; }
.hl-map-swipe { display:none; margin:14px 0 0; color:#bcc4d2; font-size:12px; line-height:1.5; text-align:center; }
.hl-map-swipe span { color:#baa7ff; margin-right:5px; }
@media(max-width:1100px) { .hl-map-swipe { display:block; } .hl-map-panel--labels { padding:18px 10px; } }
@media(prefers-reduced-motion:reduce) { .hl-map-scroll { scroll-behavior:auto; } }