/* Marchas no mapa mundial — apresentação compacta inspirada em jogos de estratégia clássicos. */
.map-march-route {
  position:absolute;
  z-index:4;
  height:4px;
  transform-origin:0 50%;
  pointer-events:none;
  opacity:.88;
  border-radius:999px;
  background:
    repeating-linear-gradient(90deg,
      rgba(255,232,153,.96) 0 8px,
      rgba(93,48,20,.92) 8px 11px,
      transparent 11px 17px);
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.72));
}

.map-march-route::before {
  content:"";
  position:absolute;
  left:-4px;
  top:50%;
  width:8px;
  height:8px;
  border-radius:50%;
  transform:translateY(-50%);
  background:#f5d77b;
  border:2px solid #5e3519;
  box-shadow:0 1px 3px rgba(0,0,0,.72);
}

.map-march-route::after {
  content:"";
  position:absolute;
  right:-5px;
  top:50%;
  width:0;
  height:0;
  transform:translateY(-50%);
  border-top:6px solid transparent;
  border-bottom:6px solid transparent;
  border-left:9px solid #f5d77b;
  filter:drop-shadow(1px 1px 0 #5e3519) drop-shadow(0 1px 2px rgba(0,0,0,.6));
}

.map-march-route.returning {
  background:
    repeating-linear-gradient(90deg,
      rgba(164,219,255,.96) 0 8px,
      rgba(28,68,99,.92) 8px 11px,
      transparent 11px 17px);
}

.map-march-route.returning::before { background:#a8dcff; border-color:#244d6a; }
.map-march-route.returning::after { border-left-color:#a8dcff; filter:drop-shadow(1px 1px 0 #244d6a) drop-shadow(0 1px 2px rgba(0,0,0,.6)); }
.map-march-route.cancelled-return { opacity:.64; }

.map-march-node {
  position:absolute;
  z-index:18;
  transform:translate(-50%, -50%);
  width:32px;
  height:32px;
  pointer-events:none;
  user-select:none;
  filter:drop-shadow(0 4px 3px rgba(0,0,0,.48));
}

.map-march-marker {
  position:relative;
  width:30px;
  height:30px;
  padding:0;
  display:grid;
  place-items:center;
  border-radius:50%;
  pointer-events:auto;
  cursor:pointer;
  color:#fff4ca;
  background:radial-gradient(circle at 35% 28%,#b34b36 0,#7e211c 47%,#32100e 100%);
  border:2px solid #ebcf7a;
  box-shadow:
    inset 0 0 0 1px rgba(0,0,0,.34),
    0 0 0 1px rgba(72,37,15,.85),
    0 3px 5px rgba(0,0,0,.52);
  transition:transform .14s ease, filter .14s ease;
  animation:march-step .9s ease-in-out infinite;
}

.map-march-marker:hover,
.map-march-marker:focus-visible {
  transform:scale(1.13);
  filter:brightness(1.12);
  outline:none;
}

.map-march-node.returning .map-march-marker {
  color:#edf8ff;
  background:radial-gradient(circle at 35% 28%,#4288b3 0,#245a7b 47%,#102b3e 100%);
  border-color:#b8e2ff;
}

.map-march-node.cancelled-return .map-march-marker { filter:saturate(.72); }

.map-march-symbol {
  font-size:15px;
  line-height:1;
  font-family:Georgia,"Times New Roman",serif;
  font-weight:900;
  text-shadow:0 1px 1px rgba(0,0,0,.78);
}

.map-march-direction {
  position:absolute;
  right:-7px;
  top:-7px;
  width:15px;
  height:15px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#3b260d;
  background:#f4d477;
  border:1px solid #5f3b16;
  font-size:9px;
  font-weight:1000;
  line-height:1;
  box-shadow:0 1px 3px rgba(0,0,0,.56);
}

.map-march-node.returning .map-march-direction {
  color:#15364d;
  background:#b9e3ff;
  border-color:#2d617f;
}

.map-march-tooltip {
  position:absolute;
  left:50%;
  top:36px;
  z-index:30;
  width:max-content;
  min-width:132px;
  max-width:190px;
  padding:6px 8px;
  transform:translate(-50%,-3px) scale(.96);
  transform-origin:top center;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  text-align:center;
  color:#f7e9b9;
  background:linear-gradient(rgba(54,40,20,.97),rgba(34,25,13,.97));
  border:1px solid #a27a35;
  border-radius:6px;
  box-shadow:0 5px 12px rgba(0,0,0,.58);
  transition:opacity .12s ease,transform .12s ease,visibility .12s;
  white-space:nowrap;
}

.map-march-tooltip::before {
  content:"";
  position:absolute;
  left:50%;
  bottom:100%;
  transform:translateX(-50%);
  border-left:5px solid transparent;
  border-right:5px solid transparent;
  border-bottom:6px solid #a27a35;
}

.map-march-tooltip strong,
.map-march-tooltip span,
.map-march-tooltip small { display:block; }
.map-march-tooltip strong { color:#fff2b4; font-size:11px; line-height:1.15; }
.map-march-tooltip span { margin-top:2px; color:#f0db9d; font-size:10px; overflow:hidden; text-overflow:ellipsis; }
.map-march-tooltip small { margin-top:3px; color:#d8c692; font-size:9px; font-weight:600; }
.map-march-tooltip small b { color:#fff0b5; }

.map-march-node:hover .map-march-tooltip,
.map-march-node:focus-within .map-march-tooltip {
  opacity:1;
  visibility:visible;
  transform:translate(-50%,0) scale(1);
}

@keyframes march-step {
  0%,100% { margin-top:0; }
  50% { margin-top:-3px; }
}

@media (prefers-reduced-motion: reduce) {
  .map-march-marker { animation:none; }
}
