@charset "utf-8";
        #mapDiv { width: 100%; height: 100vh; }
        
        /* 自定义信息窗口样式 */
        .custom-info-window {
            background-color: #ffffff; border-radius: 8px; padding: 15px;
            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2); font-family: Arial, sans-serif; min-width: 150px;
        }
        .custom-info-window h3 { margin: 0 0 8px 0; font-size: 16px; color: #333; }
        .custom-info-window p { margin: 0; font-size: 14px; color: #666; }

        /* 绘图工具按钮面板样式 */
        .tool-panel {
            position: absolute; top: 10px; left: 10px; z-index: 999;
            background: white; padding: 10px; border-radius: 8px; 
            box-shadow: 0 2px 6px rgba(0,0,0,0.3); display: flex; gap: 8px;
        }
        .tool-btn {
            padding: 8px 12px; border: none; border-radius: 4px; cursor: pointer;
            background-color: #f0f0f0; font-size: 14px; transition: 0.3s;
        }
        .tool-btn:hover { background-color: #e0e0e0; }
        .tool-btn.active { background-color: #1890ff; color: white; }

        /* 【新增】右上角搜索框面板样式 */
        .search-panel {
            position: absolute; top: 10px; right: 10px; z-index: 999;
            background: white; padding: 10px; border-radius: 8px; 
            box-shadow: 0 2px 6px rgba(0,0,0,0.3); display: flex; gap: 8px; align-items: center;
        }
        .search-panel input {
            width: 200px; padding: 8px; border: 1px solid #ddd; border-radius: 4px; font-size: 14px; outline: none;
        }
        .search-panel button {
            padding: 8px 15px; border: none; border-radius: 4px; cursor: pointer;
            background-color: #1890ff; color: white; font-size: 14px; transition: 0.3s;
        }
        .search-panel button:hover { background-color: #40a9ff; }

        /* 底部拾取坐标面板样式 */
        .pick-panel {
            position: absolute; bottom: 20px; left: 10px; z-index: 999;
            background: white; padding: 10px; border-radius: 8px; 
            box-shadow: 0 2px 6px rgba(0,0,0,0.3); display: flex; gap: 8px; align-items: center;
        }
        .pick-panel input {
            width: 110px; padding: 6px; border: 1px solid #ddd; border-radius: 4px; font-size: 14px;
        }


/* 导航链接基础样式 */
.float-nav a {
    text-decoration: none;
    color: #333;
    font-size: 14px;
    font-weight: 500;
    padding: 8px 12px;
    border-radius: 20px;

    white-space: nowrap;                  /* 防止文字换行 */
    text-align: center;
}

/* 鼠标悬停与当前激活状态的高亮效果 */
.float-nav a:hover, .float-nav a.active {
    background-color: #1890ff;            /* 与你的地图主题色保持一致 */
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    color: #ffffff;
    box-shadow: 0 2px 8px rgba(24, 144, 255, 0.4);
}
/* 悬浮导航链接基础样式 */
.float-nav a {
    text-decoration: none;
    color: #333;
    font-size: 14px;
    font-weight: 500;
    padding: 8px 12px;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    margin: 5px 0px;
    white-space: nowrap;
    text-align: left;
    display: block; /* 确保整个区块可点击 */
}

/* 【新增】带坐标的导航项显示小手图标 */
.float-nav a[data-lng] {
    cursor: pointer; 
}

/* 鼠标悬停与当前激活状态的高亮效果 */
.float-nav a:hover, .float-nav a.active {
    background-color: #1890ff;
    color: #ffffff;
    box-shadow: 0 2px 8px rgba(24, 144, 255, 0.4);
}


    /* 2. 添加新的 CSS 样式 */
    .float-nav {
        /* 保持原有的样式不变 */
        width:300px;
        position: fixed;
        right: 20px;
        top: 50%;
        transform: translateY(-45%);
        z-index: 998;
        background: rgba(255, 255, 255, 0.9);
        backdrop-filter: blur(5px);
        padding: 10px;
        border-radius: 25px;
        box-shadow: 0 4px 12px rgba(0,0,0,0.15);
        
        /* 修改这里：使用 flex 布局并允许纵向排列 */

        flex-direction: column; 
        max-height: 600px;
        overflow-y: auto;
    }

    /* 2.1 定义每一行的布局 */
    .nav-item {
        display: flex; /* 启用弹性布局 */
        width: 100%;   /* 占满父容器宽度 */
        border-radius: 20px; /* 保持和 a 标签一致的圆角 */
        overflow: hidden;    /* 确保内容不溢出圆角 */
        box-shadow: 0 2px 8px rgba(0,0,0,0.1); /* 可选：给每一行加点阴影 */
    }

    /* 2.2 第一个 a 标签：占 10% 宽度，居中显示 */
    .nav-icon {
        width: 0%; /* 设置宽度为 10% */
        background-color:none; /* 蓝色背景，与主题色一致 */
        color: white;
        display: flex;
        justify-content: center;
        align-items: center;
        text-decoration: none;
        font-weight: bold;
        font-size: 14px;
    }

    /* 2.3 第二个 a 标签：占 90% 宽度，自动填充 */
    .nav-link {
        flex: 1; /* 自动填充剩余空间 (约 90%) */
        color: #333;
        text-decoration: none;
        padding: 8px 12px;
        font-size: 14px;
        font-weight: 500;

        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis; /* 文字过长显示省略号 */
    }

    /* 2.4 鼠标悬停效果：悬停在任意部分，整行高亮 */
    .nav-item:hover .nav-icon {
        background-color: #40a9ff;
    }
    .nav-item:hover .nav-link {
        background-color: #40a9ff;
        color: white;
        padding-left: 5px; /* 悬停时文字稍微向右移动，增加动感 */
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
        border-top-right-radius: 20px;
        border-bottom-right-radius: 20px;
    }
    
/*序号*/    
   .num1,.num7,.num13,.num19,.num25,.num31 {
  display: inline-flex;       /* 转为 flex 方便居中 */
  justify-content: center;
  align-items: center;
  
  width: 20px;
  height: 20px;
  border-radius: 50%;         /* 画圆 */
  background-color: RED;     /* 实心背景 */
  color: #fff;                /* 数字颜色 */
  font-size: 12px;
  
  margin-right: 3px;          /* 和右边文字拉开距离 */
  vertical-align: middle;     /* 行内元素垂直居中（如果不用 flex 布局的话） */
} 
   .num2,.num8,.num14,.num20,.num26,.num32 {
  display: inline-flex;       /* 转为 flex 方便居中 */
  justify-content: center;
  align-items: center;
  
  width: 20px;
  height: 20px;
  border-radius: 50%;         /* 画圆 */
  background-color:#ff5c00;     /* 实心背景 */
  color: #fff;                /* 数字颜色 */
  font-size: 12px;
  
  margin-right: 3px;          /* 和右边文字拉开距离 */
  vertical-align: middle;     /* 行内元素垂直居中（如果不用 flex 布局的话） */
} 
   .num3,.num9,.num15,.num21,.num27,.num33 {
  display: inline-flex;       /* 转为 flex 方便居中 */
  justify-content: center;
  align-items: center;
  
  width: 20px;
  height: 20px;
  border-radius: 50%;         /* 画圆 */
  background-color: #2b9c00;     /* 实心背景 */
  color: #fff;                /* 数字颜色 */
  font-size: 12px;
  
  margin-right: 3px;          /* 和右边文字拉开距离 */
  vertical-align: middle;     /* 行内元素垂直居中（如果不用 flex 布局的话） */
} 
   .num4,.num10,.num16,.num22,.num28,.num34 {
  display: inline-flex;       /* 转为 flex 方便居中 */
  justify-content: center;
  align-items: center;
  
  width: 20px;
  height: 20px;
  border-radius: 50%;         /* 画圆 */
  background-color: #00549c;     /* 实心背景 */
  color: #fff;                /* 数字颜色 */
  font-size: 12px;
  
  margin-right: 3px;          /* 和右边文字拉开距离 */
  vertical-align: middle;     /* 行内元素垂直居中（如果不用 flex 布局的话） */
} 
   .num5,.num11,.num17,.num23,.num29,.num35 {
  display: inline-flex;       /* 转为 flex 方便居中 */
  justify-content: center;
  align-items: center;
  
  width: 20px;
  height: 20px;
  border-radius: 50%;         /* 画圆 */
  background-color:#ff00e9;     /* 实心背景 */
  color: #fff;                /* 数字颜色 */
  font-size: 12px;
  
  margin-right: 3px;          /* 和右边文字拉开距离 */
  vertical-align: middle;     /* 行内元素垂直居中（如果不用 flex 布局的话） */
} 
   .num6,.num12,.num18,.num24,.num30,.num36 {
  display: inline-flex;       /* 转为 flex 方便居中 */
  justify-content: center;
  align-items: center;
  
  width: 20px;
  height: 20px;
  border-radius: 50%;         /* 画圆 */
  background-color: #6b48a4;     /* 实心背景 */
  color: #fff;                /* 数字颜色 */
  font-size: 12px;
  
  margin-right: 3px;          /* 和右边文字拉开距离 */
  vertical-align: middle;     /* 行内元素垂直居中（如果不用 flex 布局的话） */
} 
/*  序号结束*/


    /* --- 新增：90% 自适应模态框样式 --- */
    /* 遮罩层：覆盖全屏 */
    .modal {
        display: none; /* 默认隐藏 */
        position: fixed;
        top: 0;
        left: 18%;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.6); /* 半透明黑色背景 */
        z-index: 1000;
        justify-content: center;
        align-items: center;
    }

    /* 弹窗内容框：占屏幕 90% */
    .modal-content {
        width: 60vw;  /* 视口宽度的 90% */
        height: 90vh; /* 视口高度的 90% */
        background: #fff;
        border-radius: 15px;
        box-shadow: 0 10px 30px rgba(0,0,0,0.3);
        overflow: hidden; /* 内容超出则滚动 */
        position: relative;
        display: flex;
        flex-direction: column;
    }

    /* 弹窗头部 */
    .modal-header {
        padding: 15px 20px;
        background: #1890ff;
        color: white;
        font-size: 18px;
        font-weight: bold;
        border-bottom: 1px solid #eee;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    /* 关闭按钮 */
    .modal-close {
        font-size: 24px;
        font-weight: bold;
        cursor: pointer;
        color: #fff;
        transition: 0.3s;
    }
    .modal-close:hover { color: #ccc; }

    /* 弹窗主体：预留内容区域 */
    .modal-body {
        padding: 20px;
        font-size: 14px;
        color: #333;
        line-height: 1.8;
        flex: 1;
        overflow-y: auto; /* 允许内容滚动 */
    }