/* Small overview panel - bottom-right corner */
#minimap {
  position: fixed;
  z-index: 10;
  right: 20px;
  bottom: 20px;
  width: 190px;
  height: 130px;
  border: 1px solid transparent;
  border-radius: 14px;
  background-image: linear-gradient(var(--node-bg), var(--node-bg)), var(--border-grad);
  background-origin: border-box;
  background-clip: padding-box, border-box;
  box-shadow: 0 4px 18px rgba(0,0,0,0.08), 0 1px 2px rgba(0,0,0,0.04);
  backdrop-filter: blur(6px);
  overflow: hidden;
  cursor: pointer;
}

#minimap-svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
#minimap-svg line {
  stroke: var(--line);
  stroke-width: 1;
}
#minimap-svg circle {
  fill: var(--muted);
}
#minimap-svg circle.active {
  fill: var(--gold-3);
  stroke: var(--gold-1);
  stroke-width: 1.5;
}
html[data-theme="dark"] #minimap-svg circle.active {
  fill: var(--gold-2);
}

#minimap-viewport {
  position: absolute;
  border: 1.5px solid var(--gold-3);
  background: rgba(var(--gold-glow-rgb),0.10);
  border-radius: 3px;
  pointer-events: none;
  transition: left 0.1s linear, top 0.1s linear, width 0.1s linear, height 0.1s linear;
}

@media (max-width: 600px) {
  #minimap {
    width: 130px;
    height: 90px;
    right: 12px;
    bottom: 12px;
  }
}