#leaflet-map {
      height: 100%;
      width: 100%;
      background: #0a0a0a;
      /* Aísla los panes de Leaflet (z-index 400+) en su propio contexto de
         apilamiento para que no tapen el header sticky (z-50) en móvil. */
      isolation: isolate;
    }
    .leaflet-container {
      background: #0a0a0a !important;
      font-family: inherit;
    }
    .custom-popup .leaflet-popup-content-wrapper {
      background: #171717;
      color: #f8fafc;
      border: 1px solid #262626;
      border-radius: 0.75rem;
      box-shadow: 0 10px 25px -5px rgba(0,0,0,0.5);
      padding: 4px;
    }
    .custom-popup .leaflet-popup-tip {
      background: #171717;
    }
    
    ::-webkit-scrollbar {
      width: 6px;
      height: 6px;
    }
    ::-webkit-scrollbar-track {
      background: #090d16;
    }
    ::-webkit-scrollbar-thumb {
      background: #262626;
      border-radius: 3px;
    }
    ::-webkit-scrollbar-thumb:hover {
      background: #262626;
    }

    @keyframes topology-dash {
      to {
        stroke-dashoffset: -32;
      }
    }
    .flow-line-active {
      stroke-dasharray: 6, 10;
      animation: topology-dash 1.2s linear infinite;
    }
    .flow-line-attack {
      stroke-dasharray: 6, 6;
      animation: topology-dash 0.6s linear infinite;
    }

    /* Nodos de topología: feedback al pasar el ratón */
    .topo-node rect {
      transition: filter 0.15s ease, stroke-width 0.15s ease;
    }
    .topo-node:hover rect {
      filter: brightness(1.35);
      stroke-width: 2.5;
    }
    #tenant-topology-view.is-panning {
      cursor: grabbing;
    }

    /* Carga de la topología: nodos y enlaces emergen desde el centro y se expanden.
       El retardo por elemento (animation-delay ∝ distancia al centro) lo fija el JS. */
    @keyframes topo-pop-in {
      from { opacity: 0; transform: scale(0.2); }
      to   { opacity: 1; transform: scale(1); }
    }
    @keyframes topo-fade-in {
      from { opacity: 0; }
      to   { opacity: 1; }
    }
    .topo-pop {
      transform-box: fill-box;
      transform-origin: center;
      animation: topo-pop-in 0.45s cubic-bezier(0.2, 0.8, 0.3, 1.2) backwards;
    }
    .topo-edge {
      animation: topo-fade-in 0.5s ease backwards;
    }
    @media (prefers-reduced-motion: reduce) {
      .topo-pop, .topo-edge { animation: none; }
    }