
		#main-content {
			/* flex-grow: 1;
			display: flex;
			flex-direction: column;
			position: relative;  */
			min-width: 70%;
			flex: 1;
		}
		
		
		/*pdf canvas外层容器*/
		#pdf-viewer {
			flex-grow: 1;
			position: relative;
			/* 容器固定宽度 */
			height: 100%; /* 初始高度设置为视口高度的100% */
			/* 容器固定高度 */
			/* 边框，便于看出容器边界 */
			overflow: scroll;
			/* 防止canvas超出容器时可见 */
		}
		

		#pdf-annotations {
			flex: 0 0 200px;
			/* 根据需要调整注释列表的高度 */
			border: 1px solid #ccc;
		}

		/* 隐藏目录栏和详情块时的样式 */
		.hidden {
			width: 0;
		}

		/* 按钮样式 */

		#annotation-layer {
			background-color: blue;
		}
		#the-canvas-div{
			flex-grow: 1;
			position: relative;
			/* 连续滚动：这里原来写死 height:100%，
			   会把第 2 页之后的页挤出滚动范围（滚不到底），
			   改成 min-height 让整本手册的页数把容器自然撑开 */
			min-height: 100%;
			/* 边框，便于看出容器边界 */
			/* 防止canvas超出容器时可见 */
			background-color: white;
		}
		.the-canvas {
			/* 绝对定位，以便可以在容器内自由移动 */
			position: absolute;
			top: 0;
			left: 0;
			/* 防止触摸时的默认行为，如滚动等 */
			touch-action: none;
			/* border: 1px solid #ccc; */
			image-rendering: crisp-edges; /* 提高图像渲染质量 */
		}


		#search-input {
			padding: 5px;
			/* 内边距 */
		}

		#search-btn {
			padding: 5px 10px;
			/* 内边距 */
			cursor: pointer;
			/* 鼠标样式 */
		}

		/* ===== 虚拟滚动：每页一个占位容器 =====
		   .pdf-page 撑住该页高度（没渲染时也不塌陷，滚动条长度一次到位），
		   canvas / 零件圆点 / 文本层都挂在本页容器内，坐标相对本页，
		   所以滚动时它们自动跟着页面走 —— 原来注释层挂在外层
		   #annotation-layer 上、坐标相对 viewport，一旦连续滚动就全错位。 */
		.pdf-page {
			position: relative;
			margin: 0 auto 8px auto;
			background-color: #fff;
			overflow: hidden;
		}

		.pdf-page-canvas {
			display: block;
			width: 100%;
			height: 100%;
			image-rendering: crisp-edges;
		}

		.page-annotations {
			position: absolute;
			left: 0;
			top: 0;
			right: 0;
			bottom: 0;
			pointer-events: none;
		}

		.page-annotations > * {
			pointer-events: auto;
		}

		/* PDF 文本层：平时透明不可见，只在需要时开 text-visible。
		   作用是让画面上的目录页条目可以被双击取词跳转。 */
		.pdf-text-layer {
			position: absolute;
			left: 0;
			top: 0;
			right: 0;
			bottom: 0;
			overflow: hidden;
			line-height: 1;
			opacity: 0;
			/* 只作为双击取词的数据载体，不能挡点击：
			   它在 DOM 里盖在 .page-annotations 之上，
			   不穿透的话零件圆点（红框）就点不到了 */
			pointer-events: none;
		}

		.pdf-text-layer.text-visible {
			opacity: 1;
		}

		.pdf-text-layer span {
			position: absolute;
			white-space: pre;
			transform-origin: 0% 100%;
			color: transparent;
			font-family: sans-serif;
		}

		.pdf-text-layer.text-visible span {
			color: #222;
		}

		/* PDF 内部链接热区（目录页上带链接的条目） */
		.pdf-link-hotspot {
			position: absolute;
			cursor: pointer;
		}

		/* 滚动时自动高亮左侧目录里当前所在的段 */
		#bookmarkNav a.current-section {
			background-color: #28596a;
			color: #fff;
		}