/* EventMap */
.emap { position: relative; overflow: hidden; background: #0b0b0b; touch-action: manipulation; user-select: none; -webkit-user-select: none; }
.emap.is-full, .emap.no-scroll { touch-action: none; }
.emap-svg { display: block; width: 100%; height: 100%; cursor: grab; }
.emap-svg:active { cursor: grabbing; }
.emap-void { fill: #0b0b0b; }
.emap-grid { fill: #121212; }
.emap-img.f-invert { filter: invert(1) hue-rotate(180deg) brightness(.85) contrast(.9); }
.emap-img.f-dim { filter: grayscale(.4) brightness(.55); }

.emap-shape { fill: #FFDE00; fill-opacity: 0; stroke: #FFDE00; stroke-opacity: 0; stroke-width: 2; vector-effect: non-scaling-stroke; transition: fill-opacity .25s, stroke-opacity .25s; }
.emap-shape.is-sel, .emap-shape.is-hl { fill-opacity: .2; stroke-opacity: 1; stroke-width: 3; animation: emapArea 1.6s ease-in-out infinite; filter: drop-shadow(0 0 6px rgba(255, 222, 0, .7)); }
@keyframes emapArea { 50% { fill-opacity: .42; } }

.emap-edge { stroke: #4ad1ff; stroke-width: 3; stroke-opacity: .75; vector-effect: non-scaling-stroke; }
.emap-node circle { fill: #0b0b0b; stroke: #4ad1ff; stroke-width: 2.5; }
.emap-node.is-active circle { fill: #4ad1ff; r: 8; }

.emap-route-glow { fill: none; stroke: #FFDE00; stroke-opacity: .16; stroke-width: 14; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; filter: blur(3px); }
.emap-route { fill: none; stroke: #FFDE00; stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; filter: drop-shadow(0 0 4px rgba(255, 222, 0, .9)); }
.emap-route-dot { fill: #fff; filter: drop-shadow(0 0 6px #FFDE00) drop-shadow(0 0 2px #FFDE00); }
.emap-draft { fill: rgba(74, 209, 255, .12); stroke: #4ad1ff; stroke-width: 2; stroke-dasharray: 6 4; vector-effect: non-scaling-stroke; }

.mk { pointer-events: none; }
.emap-pin .dot { fill: #0b0b0b; stroke: #FFDE00; stroke-width: 2.5; }
.emap-pin .num { fill: #FFDE00; font: 800 13px/1 'Barlow Condensed', 'Arial Narrow', sans-serif; text-anchor: middle; dominant-baseline: central; }
.emap-pin .halo { fill: none; stroke: #FFDE00; stroke-width: 2; opacity: 0; transform-box: fill-box; transform-origin: center; }
.emap-pin.is-pulse .halo { animation: emapPulse 1.8s ease-out infinite; }
.emap-pin.is-pulse .dot { animation: emapBlink 1.8s ease-in-out infinite; }
.emap-pin.is-sel .dot { fill: #FFDE00; stroke: #0b0b0b; stroke-width: 2; animation: none; }
.emap-pin.is-sel .num { fill: #0b0b0b; font-size: 15px; }
.emap-pin.is-sel .halo { animation: emapPulse 1.2s ease-out infinite; stroke-width: 3; }
.emap-pin.is-dim { opacity: .45; }
.emap-pin.is-dim .halo { animation: none; }
@keyframes emapPulse { 0% { opacity: .9; transform: scale(.75); } 100% { opacity: 0; transform: scale(2.3); } }
@keyframes emapBlink { 50% { fill: #2a2600; } }

.emap-here .core { fill: #FFDE00; stroke: #0b0b0b; stroke-width: 3; }
.emap-here .ring { fill: none; stroke: #FFDE00; stroke-width: 2.5; transform-box: fill-box; transform-origin: center; animation: emapPulse 1.6s ease-out infinite; }
.emap-here.is-other .core { fill: #4ad1ff; }
.emap-here.is-other .ring { stroke: #4ad1ff; }
.emap-here.is-other .aura { display: none; }

.lbl rect { fill: #FFDE00; }
.lbl .tail { fill: #FFDE00; }
.lbl text { fill: #0b0b0b; font: 700 13px/1 'Barlow Condensed', 'Arial Narrow', sans-serif; letter-spacing: .02em; text-anchor: middle; text-transform: uppercase; }
.lbl-here rect, .lbl-here .tail { fill: #fff; }
.emap-here.is-other .lbl-here rect, .emap-here.is-other .lbl-here .tail { fill: #4ad1ff; }
