/**
 * Travel Map Nav - Phase 1 样式（直接嵌入页面模式）
 */

/* ---------- 地图容器 ---------- */
.travel-map-nav-wrap {
	position: relative;
	width: 100%;
}

.travel-map-nav {
	width: 100%;
	height: 70vh;
	min-height: 400px;
	border: 1px solid #e5e5e5;
	border-radius: 8px;
	overflow: hidden;
	background: #f4f4f4;
}

/* v0.16.11：去掉 Leaflet 1.9 交互图层的键盘焦点框——点击路段后沿该路径 bbox 出现
   的橙/深色圆角方框（安卓 X5 橙色、桌面 Chrome 深色），即用户所见"路段范围方框"。
   本图为触摸/鼠标驱动，没有键盘操作路径，移除不影响使用。 */
.leaflet-container .leaflet-interactive:focus,
.leaflet-container .leaflet-interactive:focus-visible,
.leaflet-container .leaflet-marker-icon:focus {
	outline: none;
}

/* ---------- 0.15.0 一键导航（高德） ---------- */
/* 景点详情页顶部 chip（与「此点同为口岸档案 →」同款胶囊） */
.tm-guide-chip {
	display: inline-block;
	margin: 0 8px 8px 0;
	padding: 4px 12px;
	border-radius: 999px;
	background: #ECFDF5;
	border: 1px solid #A7F3D0;
	color: #047857;
	font-size: 13px;
	line-height: 1.6;
	text-decoration: none;
}

.tm-guide-chip:hover,
.tm-guide-chip:focus {
	background: #D1FAE5;
	color: #065F46;
}

/* 地图景点弹窗动作区内的「导航 →」 */
.attraction-popup .popup-actions .guide-nav {
	display: inline-block;
	margin-right: 8px;
	padding: 2px 8px;
	border-radius: 4px;
	background: #ECFDF5;
	color: #047857;
	font-size: 12px;
	text-decoration: none;
	white-space: nowrap;
}

.attraction-popup .popup-actions .guide-nav:hover {
	background: #D1FAE5;
	color: #065F46;
}

/* ---------- 线路切换按钮栏（Phase 6） ---------- */
.travel-nav-route-toggles {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	padding: 10px 12px;
	background: #fff;
	border: 1px solid #e5e5e5;
	border-bottom: 0;
	border-radius: 8px 8px 0 0;
}

.travel-nav-route-toggle {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 14px;
	font-size: 13px;
	line-height: 1.4;
	color: #555;
	background: #fff;
	border: 1px solid #ddd;
	border-radius: 999px;
	cursor: pointer;
	white-space: nowrap;
	flex: none;
	transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.travel-nav-route-toggle .dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	flex: none;
	box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.12);
}

.travel-nav-route-toggle:hover {
	border-color: #999;
	color: #333;
}

.travel-nav-route-toggle.active {
	color: #fff;
	border-color: transparent;
}

.travel-nav-route-toggle.active .dot {
	background: rgba(255, 255, 255, 0.92) !important;
	box-shadow: none;
}

/* ---------- 返回全国按钮 ---------- */
.travel-nav-back-btn {
	display: none;
	padding: 6px 12px;
	background: #fff;
	color: #333;
	font-size: 13px;
	text-decoration: none;
	border: 1px solid #ccc;
	border-radius: 4px;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
	cursor: pointer;
	z-index: 1000;
}

.travel-nav-back-btn:hover {
	background: #f0f0f0;
}

/* ---------- 一键生成行程计划按钮（0.8.1 / 0.9.2：缩短文案+防止截断） ---------- */
.travel-nav-plan-btn {
	display: none;
	padding: 6px 10px;
	background: #2563eb;
	color: #fff;
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
	border-radius: 4px;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
	cursor: pointer;
	z-index: 1000;
	box-sizing: border-box;
	min-width: max-content;
	overflow: visible;
}

.travel-nav-plan-btn:hover {
	background: #1d4ed8;
	color: #fff;
}

/* 2026-09-05：主题/Leaflet 链接样式可能把按钮白字覆盖成蓝字（蓝底蓝字看不清），
   这里用 leaflet 容器前缀 + !important 强制兜底 */
.leaflet-container .travel-nav-plan-btn,
.leaflet-container .travel-nav-plan-btn:hover {
	color: #fff !important;
}

/* v0.17.4：空骨架线路（无景点）按钮置灰 */
.travel-nav-plan-btn.travel-nav-plan-btn-off,
.travel-nav-plan-btn.travel-nav-plan-btn-off:hover {
	background: #9aa4b2;
	cursor: not-allowed;
}

.travel-nav-plan-btn.busy {
	opacity: 0.7;
	cursor: wait;
}

/* ---------- 0.9.0 A-2/A-3 线路信息条（右下角：打卡进度 + 沿途口岸） ---------- */
.travel-nav-routeinfo {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 6px;
}
/* v0.16.5 手机端折叠圆钮：v0.16.12 圆钮已移除 */
.nav-routeinfo-toggle {
	display: none;
}
/* v0.16.12：「本线已打卡」进度与「沿途口岸」仅手机端隐藏（桌面端保留；
   JS 在手机端也会直接置 none，此处 !important 为双保险），规则移至手机媒体查询。 */
.nav-routeinfo-chip {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 6px 12px;
	font-size: 13px;
	font-weight: 600;
	color: #374151;
	background: #fff;
	border: 1px solid #d1d5db;
	border-radius: 999px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.14);
	white-space: nowrap;
	cursor: default;
}
.nav-ports-btn {
	cursor: pointer;
	color: #1D4ED8;
	border-color: #1D4ED8;
}
.nav-ports-btn:hover {
	background: #EFF6FF;
}
/* 0.16.0 段级纪律：本段怎么走（与沿途口岸面板同位、同族视觉；同时只开一个） */
.nav-segguide-btn {
	cursor: pointer;
	color: #1D4ED8;
	border-color: #1D4ED8;
}
.nav-segguide-btn:hover {
	background: #EFF6FF;
}
.nav-segguide-panel {
	position: absolute;
	bottom: calc(100% + 8px);
	right: 0;
	width: 288px;
	max-height: 340px;
	overflow-y: auto;
	background: #fff;
	border: 1px solid #e5e7eb;
	border-radius: 10px;
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.18);
	z-index: 1000;
	font-size: 13px;
	color: #374151;
}
.nav-segguide-head {
	position: sticky;
	top: 0;
	padding: 10px 14px;
	font-weight: 700;
	color: #111827;
	background: #fff;
	border-bottom: 1px solid #f3f4f6;
	border-radius: 10px 10px 0 0;
}
.nav-segguide-list {
	list-style: none;
	margin: 0;
	padding: 8px 14px;
}
.nav-segguide-list li {
	display: flex;
	gap: 8px;
	padding: 4px 0;
	line-height: 1.65;
}
.nav-segguide-list b {
	flex: none;
	width: 64px;
	color: #64748B;
	font-weight: 600;
}
.nav-segguide-list span {
	color: #334155;
	word-break: break-word;
}
.nav-segguide-meta {
	margin: 0;
	padding: 8px 14px 12px;
	font-size: 12px;
	color: #9CA3AF;
	border-top: 1px solid #f3f4f6;
}
.nav-ports-panel {
	position: absolute;
	bottom: calc(100% + 8px);
	right: 0;
	width: 270px;
	max-height: 340px;
	overflow-y: auto;
	background: #fff;
	border: 1px solid #e5e7eb;
	border-radius: 10px;
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.18);
	z-index: 1000;
	font-size: 13px;
	color: #374151;
}
.nav-ports-head {
	position: sticky;
	top: 0;
	padding: 10px 14px;
	font-weight: 700;
	color: #111827;
	background: #fff;
	border-bottom: 1px solid #f3f4f6;
	border-radius: 10px 10px 0 0;
}
.nav-ports-loading,
.nav-ports-empty {
	padding: 14px;
	color: #6B7280;
	line-height: 1.6;
}
.nav-ports-err {
	padding: 14px;
	color: #B91C1C;
}
.nav-ports-list {
	padding: 4px 0;
}
.nav-port-item {
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: 8px 14px;
	text-decoration: none;
	color: inherit;
	border-bottom: 1px solid #f9fafb;
}
.nav-port-item:hover {
	background: #F9FAFB;
}
.nav-port-item:last-child {
	border-bottom: none;
}
.nav-port-name {
	font-weight: 600;
	color: #111827;
}
.nav-port-meta {
	display: flex;
	gap: 6px;
	align-items: center;
	font-size: 12px;
	color: #6B7280;
}
.nav-port-type {
	display: inline-block;
	padding: 1px 6px;
	font-size: 11px;
	color: #1D4ED8;
	background: #EFF6FF;
	border-radius: 999px;
}

/* E-1：统一「需要登录」顶部提示 */
.travel-nav-toast {
	position: fixed;
	top: 16px;
	left: 50%;
	z-index: 99999;
	max-width: 90vw;
	padding: 10px 16px;
	background: #16A34A;
	color: #fff;
	font-size: 13px;
	line-height: 1.5;
	border-radius: 8px;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18);
	opacity: 0;
	transform: translate(-50%, -8px);
	transition: opacity 0.2s, transform 0.2s;
	pointer-events: none;
}
.travel-nav-toast.show {
	opacity: 1;
	transform: translate(-50%, 0);
}
.travel-nav-toast.err {
	background: #DC2626;
}

/* ---------- 线路名称标签 ---------- */
.travel-nav-route-label {
	background: transparent;
	border: none;
	box-shadow: none;
	padding: 0;
	font-size: 13px;
	font-weight: 700;
	color: #111;
	white-space: nowrap;
	/* 文字白描边 + 白发光：压在线路上也能看清 */
	text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff, 0 0 4px #fff;
	/* 向上偏移，避免文字盖住线路中点 */
	transform: translate(-50%, -150%);
}

/* ---------- 0.10.0 路段悬停名称提示（配合 Leaflet tooltip，白底默认） ---------- */
.travel-map-nav .leaflet-tooltip {
	padding: 4px 10px;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.5;
	border: 1px solid rgba(0, 0, 0, 0.18);
	border-radius: 6px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18);
}

/* ---------- 景点标记（Phase 3） ---------- */
.travel-nav-poi-wrap {
	background: none;
	border: none;
}

.travel-nav-poi {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	border: 2px solid #fff;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.35);
	box-sizing: border-box;
	cursor: pointer;
	transition: transform 0.15s ease;
}

.travel-nav-poi-wrap:hover .travel-nav-poi {
	transform: scale(1.25);
}

/* ---------- v0.18.0 市县徽章（白名单线路 route 层级） ---------- */
.tm-city-badge-wrap {
	background: none;
	border: none;
}

.tm-city-badge {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 3px 8px 3px 5px;
	background: #fff;
	border: 1.5px solid; /* 颜色由内联 style 跟随线路色 */
	border-radius: 999px;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
	cursor: pointer;
	white-space: nowrap;
	transition: transform 0.15s ease;
}

.tm-city-badge-dot {
	flex: none;
	width: 8px;
	height: 8px;
	border-radius: 50%;
}

.tm-city-badge-name {
	font-size: 12px;
	font-weight: 600;
	color: #1f2937;
	line-height: 1.2;
}

.tm-city-badge-wrap:hover .tm-city-badge {
	transform: scale(1.06);
}

/* 徽章弹层卡片（PC popup 与手机端信息区 city 态共用结构） */
.tm-city-card {
	min-width: 180px;
}

.tm-city-card-title {
	font-size: 15px;
	font-weight: 700;
	color: #111827;
	margin: 0 0 8px;
}

.tm-city-card-sec {
	margin-bottom: 8px;
}

.tm-city-card-sec-title {
	font-size: 12px;
	font-weight: 600;
	color: #94a3b8;
	margin-bottom: 4px;
}

.tm-city-card-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.tm-city-card-list li {
	margin-bottom: 2px;
}

.tm-city-card-link {
	display: block;
	padding: 6px 8px;
	font-size: 13px;
	line-height: 1.4;
	color: #1f2937;
	text-decoration: none;
	border-radius: 6px;
}

.tm-city-card-link:hover {
	background: #f1f5f9;
	color: #1d4ed8;
}

.tm-city-card-guide {
	font-weight: 600;
}

/* ---------- 景点弹窗（Phase 3，方案 6.4） ---------- */
.attraction-popup {
	min-width: 200px;
}

.attraction-popup .attraction-popup-thumb {
	display: block;
	width: 100%;
	height: 120px;
	object-fit: cover;
	border-radius: 6px;
}

.attraction-popup .attraction-popup-thumb.ph {
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 40px;
	font-weight: 700;
	color: #fff;
	background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
}

/* 0.9.5：打卡实拍照片（主图带角标） */
.attraction-popup .popup-thumb-wrap {
	position: relative;
	display: block;
}
.attraction-popup .popup-thumb-badge {
	position: absolute;
	left: 6px;
	bottom: 6px;
	background: rgba(0, 0, 0, 0.55);
	color: #fff;
	font-size: 11px;
	font-style: normal;
	line-height: 1.4;
	padding: 2px 6px;
	border-radius: 4px;
}

.attraction-popup h3 {
	margin: 10px 0 4px;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.4;
}

.attraction-popup .location {
	margin: 0 0 6px;
	font-size: 12px;
	color: #999;
}

.attraction-popup .summary {
	margin: 0 0 10px;
	font-size: 13px;
	color: #555;
	line-height: 1.6;
}

/* 0.9.0 A-2：卡片「已有 N 人打卡」热度行 */
.attraction-popup .popup-hot {
	margin: 0 0 6px;
	font-size: 12px;
	color: #B45309;
	line-height: 1.5;
}

.attraction-popup .popup-route-tag {
	display: inline-block;
	margin: 0 0 10px;
	padding: 2px 8px;
	font-size: 12px;
	color: #fff;
	background: #1D4ED8;
	border-radius: 10px;
	text-decoration: none;
	cursor: default;
}

/* 0.8.0 卡片底部操作栏：左线路标签 / 右打卡 + 详情 */
.attraction-popup .popup-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	margin-top: 2px;
}

.attraction-popup .popup-footer .popup-route-tag {
	margin: 0;
	flex: 0 1 auto;
	max-width: 55%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* 0.9.7 多归属：一个景点属于多条线路/路段时，卡片底部展示多个线路标签 */
.attraction-popup .popup-footer .popup-route-tags {
	display: inline-flex;
	flex-wrap: wrap;
	gap: 4px;
	flex: 1 1 auto;
	min-width: 0;
}

.attraction-popup .popup-footer .popup-route-tags .popup-route-tag {
	max-width: none;
	white-space: normal;
}

.attraction-popup .popup-actions {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	flex-shrink: 0;
	margin-left: auto;
}

.attraction-popup .view-posts {
	display: inline-block;
	padding: 7px 10px;
	background: #E63946;
	color: #fff;
	font-size: 13px;
	font-weight: 600;
	border-radius: 4px;
	text-decoration: none;
	transition: background 0.2s ease;
	white-space: nowrap;
}

.attraction-popup .view-posts:hover {
	background: #c72d3a;
}

.attraction-popup .view-posts.disabled {
	background: #ccc;
	cursor: default;
}

/* 0.8.0 打卡按钮状态 */
.attraction-popup .checkin-btn {
	appearance: none;
	-webkit-appearance: none;
	padding: 7px 10px;
	border: 1px solid #E63946;
	border-radius: 4px;
	background: #fff;
	color: #E63946;
	font-family: inherit;
	font-size: 13px;
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
	white-space: nowrap;
	transition: background 0.2s ease, color 0.2s ease;
}

.attraction-popup .checkin-btn:hover {
	background: #E63946;
	color: #fff;
}

.attraction-popup .checkin-btn.done {
	border-color: #1a9e4f;
	background: #eaf8ef;
	color: #1a9e4f;
}

.attraction-popup .checkin-btn.done:hover {
	background: #1a9e4f;
	color: #fff;
}

/* 行程猫 v1.6.0：「♡ 想去」按钮（导航→想去→打卡→详情） */
.attraction-popup .wish-btn {
	appearance: none;
	-webkit-appearance: none;
	padding: 7px 10px;
	border: 1px solid #d6336c;
	border-radius: 4px;
	background: #fff;
	color: #d6336c;
	font-family: inherit;
	font-size: 13px;
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
	white-space: nowrap;
	transition: background 0.2s ease, color 0.2s ease;
}

.attraction-popup .wish-btn:hover {
	background: #d6336c;
	color: #fff;
}

.attraction-popup .wish-btn.done {
	border-color: #d6336c;
	background: #fce7f0;
	color: #c2255c;
}

.attraction-popup .wish-btn.done:hover {
	background: #c2255c;
	color: #fff;
}

.attraction-popup .checkin-btn.save {
	background: #E63946;
	color: #fff;
}

.attraction-popup .checkin-btn.save:hover {
	background: #c72d3a;
}

.attraction-popup .checkin-btn.cancel {
	border-color: #bbb;
	background: #fff;
	color: #666;
}

.attraction-popup .checkin-btn.cancel:hover {
	background: #eee;
	color: #333;
}

/* 0.8.0 打卡编辑表单（卡片内展开） */
.attraction-popup .checkin-hint {
	margin: 0 0 8px;
	font-size: 12px;
	color: #888;
}

.attraction-popup .checkin-text {
	display: block;
	box-sizing: border-box;
	width: 100%;
	min-height: 56px;
	padding: 8px;
	border: 1px solid #ddd;
	border-radius: 4px;
	font-size: 13px;
	font-family: inherit;
	line-height: 1.6;
	color: #333;
	resize: vertical;
}

.attraction-popup .checkin-text:focus {
	outline: none;
	border-color: #E63946;
}

.attraction-popup .checkin-date-label {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 8px 0 0;
	font-size: 12px;
	color: #666;
}

.attraction-popup .checkin-date {
	flex: 0 1 auto;
	width: 148px;
	padding: 4px 6px;
	border: 1px solid #ddd;
	border-radius: 4px;
	font-size: 13px;
	font-family: inherit;
}

.attraction-popup .checkin-actions {
	display: flex;
	justify-content: flex-end;
	gap: 8px;
	margin-top: 10px;
}

.attraction-popup .checkin-msg {
	margin: 8px 0 0;
	font-size: 12px;
	color: #c72d3a;
}

/* 0.9.1 打卡表单：照片上传预览 + 取消打卡 */
.attraction-popup .checkin-photo {
	margin-top: 8px;
}

.attraction-popup .checkin-photo-prev {
	position: relative;
	display: inline-block;
	margin-bottom: 6px;
}

.attraction-popup .checkin-photo-prev img {
	display: block;
	width: 120px;
	height: 80px;
	object-fit: cover;
	border-radius: 6px;
	border: 1px solid #eee;
}

.attraction-popup .checkin-photo-del {
	position: absolute;
	top: -6px;
	right: -6px;
	width: 18px;
	height: 18px;
	line-height: 16px;
	text-align: center;
	border-radius: 50%;
	background: #E63946;
	color: #fff;
	font-size: 11px;
	cursor: pointer;
}

.attraction-popup .checkin-photo-label {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 5px 10px;
	border: 1px dashed #bbb;
	border-radius: 4px;
	font-size: 12px;
	color: #666;
	cursor: pointer;
	transition: border-color 0.2s ease, color 0.2s ease;
}

.attraction-popup .checkin-photo-label:hover {
	border-color: #E63946;
	color: #E63946;
}

.attraction-popup .checkin-photo-tip {
	display: block;
	margin-top: 4px;
	font-size: 11px;
	color: #999;
	line-height: 1.5;
}

.attraction-popup .checkin-btn.del {
	margin-right: auto;
	border-color: #E63946;
	background: #fff;
	color: #E63946;
}

.attraction-popup .checkin-btn.del:hover {
	background: #E63946;
	color: #fff;
}

/* ---------- 移动端 v0.16.4：全屏地图主区（顶栏 56px 以下铺满）+ 浮顶胶囊 + 底部路线浮卡 ---------- */
@media (max-width: 768px) {
	.travel-map-nav {
		height: calc(100vh - 56px);
		height: calc(100dvh - 56px);   /* v0.16.4：56dvh→顶栏以下全屏（首页删热门路书后地图即主体） */
		min-height: 300px;
		border-radius: 0;
		border-left: 0;
		border-right: 0;
	}

	/* v0.16.4 吸收自 home-mobile.css：去掉主题 entry-content 可能的下边距（该文件已不再入队） */
	.travel-map-nav-wrap {
		margin-bottom: 0;
	}

	/* 路线切换按钮：浮在地图顶部的横向滚动胶囊条（毛玻璃） */
	.travel-map-nav-wrap .travel-nav-route-toggles {
		position: absolute;
		top: 10px;
		left: 8px;
		right: 8px;
		z-index: 600;
		flex-wrap: nowrap;
		gap: 8px;
		padding: 6px 10px;
		background: rgba(255, 255, 255, 0.86);
		-webkit-backdrop-filter: blur(10px);
		backdrop-filter: blur(10px);
		border: 1px solid rgba(0, 0, 0, 0.07);
		border-radius: 999px;
		box-shadow: 0 2px 12px rgba(0, 0, 0, 0.14);
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}

	.travel-nav-route-toggles::-webkit-scrollbar {
		display: none;
	}

	.travel-nav-route-toggle {
		padding: 7px 14px;
		font-size: 13px;
	}

	/* 返回全国/线路按钮：让到胶囊条下方（提高特异性压过动态加载的 leaflet.css） */
	.travel-map-nav-wrap .leaflet-top.leaflet-right {
		top: 60px;
	}

	/* 底部路线浮卡打开时，信息条（进度/口岸/段纪律）浮到浮卡上方避让；高度由 JS 测量注入 */
	.travel-map-nav-wrap .leaflet-bottom.leaflet-right {
		transition: bottom 0.28s cubic-bezier(0.22, 0.9, 0.3, 1);
	}

	.travel-map-nav-wrap.tm-sheet-open .leaflet-bottom.leaflet-right {
		bottom: calc(var(--tm-sheet-h, 190px) + 20px);
	}

	/* 浮卡/景点弹窗贴底时，左下缩放键临时隐藏，避免遮挡（双指缩放不受影响） */
	.travel-map-nav-wrap .leaflet-bottom.leaflet-left {
		transition: opacity 0.2s ease;
	}

	.travel-map-nav-wrap.tm-sheet-open .leaflet-bottom.leaflet-left,
	.travel-map-nav-wrap.tm-popup-open .leaflet-bottom.leaflet-left {
		opacity: 0;
		pointer-events: none;
	}

	/* 口岸/段纪律展开面板：小屏限宽限高，内部滚动 */
	.travel-map-nav-wrap .nav-ports-panel,
	.travel-map-nav-wrap .nav-segguide-panel {
		width: min(288px, calc(100vw - 32px));
		max-height: min(320px, 42vh);
	}

	/* v0.16.12 手机端：线路信息控件整块下线（圆钮/打卡/口岸/段纪律均不在手机端展示） */
	.travel-map-nav-wrap .travel-nav-routeinfo {
		display: none !important;
	}

	/* v0.16.5 版权标识手机端降存在感（版权文字依法保留，仅缩小/半透明，不删除） */
	.travel-map-nav-wrap .leaflet-control-attribution {
		font-size: 9px;
		line-height: 1.4;
		padding: 1px 6px;
		background: rgba(255, 255, 255, 0.62);
		box-shadow: none;
		color: #6B7280;
	}
	.travel-map-nav-wrap .leaflet-control-attribution a {
		color: #6B7280;
	}

	/* ========== v0.16.6 首页手机端固定舞台：上地图(43dvh) / 下信息区(四态，不滚动) ========== */
	/* 仅 JS 重组后 body 带 class 才生效，桌面端与非地图页零影响 */
	body.tm-home-stage-active {
		overflow: hidden;
		height: 100vh;
		height: 100dvh;
	}
	body.tm-home-stage-active #page {
		height: 100%;
		padding: 0;
		display: flex;
		flex-direction: column;
	}
	body.tm-home-stage-active #main,
	body.tm-home-stage-active .wrapper {
		flex: 1 1 auto;
		min-height: 0;
		padding: 0;
		display: flex;
		flex-direction: column;
	}
	body.tm-home-stage-active #primary,
	body.tm-home-stage-active #content,
	body.tm-home-stage-active #content > article {
		flex: 1 1 auto;
		min-height: 0;
		padding: 0;
		display: flex;
		flex-direction: column;
	}
	body.tm-home-stage-active #content > article {
		margin: 0;
		padding: 0;
	}
	body.tm-home-stage-active .entry-content {
		flex: 1 1 auto;
		min-height: 0;
		margin: 0;
		padding: 0;
		display: flex;
		flex-direction: column;
	}
	body.tm-home-stage-active .entry-footer,
	body.tm-home-stage-active #colophon,
	body.tm-home-stage-active footer[role="contentinfo"] {
		display: none;
	}

	.tm-stage {
		flex: 1 1 auto;
		min-height: 0;
		display: flex;
		flex-direction: column;
	}
	.tm-stage-map {
		flex: 0 0 43dvh;
		min-height: 0;
		position: relative;
	}
	.tm-stage-map .travel-map-nav-wrap {
		position: absolute;
		inset: 0;
	}
	.tm-stage-map .travel-map-nav {
		height: 100% !important;
		min-height: 0;
		border-radius: 0;
	}
	.tm-stage-info {
		flex: 1 1 auto;
		min-height: 0;
		position: relative;
		background: #fff;
		overflow: hidden;
		border-top: 1px solid #eef1f5;
	}

	/* 四态显隐：默认介绍 / 线路路段 / 景点 / 列表 / 市县徽章 */
	.tm-info-intro,
	.tm-stage-info .tm-route-sheet,
	.tm-info-attr,
	.tm-info-list,
	.tm-info-city {
		display: none;
	}
	.tm-stage-info[data-state="intro"] .tm-info-intro,
	.tm-stage-info[data-state="route"] .tm-route-sheet,
	.tm-stage-info[data-state="attr"] .tm-info-attr,
	.tm-stage-info[data-state="list"] .tm-info-list,
	.tm-stage-info[data-state="city"] .tm-info-city {
		display: flex;
	}

	/* —— 市县徽章态：县名 + 攻略/景点列表（v0.18.0） —— */
	.tm-info-city {
		position: absolute;
		inset: 0;
		flex-direction: column;
		background: #fff;
	}
	.tm-city-head {
		flex: none;
		display: flex;
		align-items: center;
		gap: 8px;
		padding: 8px 12px;
		border-bottom: 1px solid #f1f5f9;
	}
	.tm-city-label {
		flex: none;
		font-size: 11.5px;
		color: #94a3b8;
	}
	.tm-city-name {
		flex: 1;
		min-width: 0;
		font-size: 16px;
		line-height: 1.3;
		color: #111827;
	}
	.tm-city-close {
		flex: none;
		width: 32px;
		height: 32px;
		border: 0;
		border-radius: 50%;
		background: #f1f5f9;
		color: #475569;
		font-size: 16px;
		line-height: 1;
	}
	.tm-city-body {
		flex: 1 1 auto;
		min-height: 0;
		overflow-y: auto;
		scrollbar-width: none;
		padding: 8px 12px 10px;
		-webkit-overflow-scrolling: touch;
	}
	.tm-city-body::-webkit-scrollbar {
		display: none;
	}
	.tm-city-body .tm-city-card {
		min-width: 0;
	}
	.tm-city-body .tm-city-card-title {
		display: none; /* 头部已有县名，避免重复 */
	}
	.tm-city-body .tm-city-card-link {
		padding: 8px 10px;
		font-size: 14px;
	}

	/* —— 默认态：首页正文（后台→页面→首页直接编辑，短代码以外的内容全在这里） —— */
	/* v0.16.17：内容较多时改为面板内滚动（此前 hidden 会截断文章），舞台高度仍固定 */
	.tm-info-intro {
		position: absolute;
		inset: 0;
		flex-direction: column;
		overflow-y: auto;
		overscroll-behavior: contain;
		-webkit-overflow-scrolling: touch;
		padding: 16px 18px 12px;
		background: #fff;
	}
	.tm-info-intro .entry-header {
		margin: 0 0 8px;
	}
	.tm-info-intro .entry-title {
		font-size: 19px;
		line-height: 1.35;
		margin: 0;
		color: #111827;
	}
	.tm-info-intro h2,
	.tm-info-intro h3 {
		font-size: 15px;
		margin: 6px 0 6px;
		color: #111827;
	}
	.tm-info-intro p {
		font-size: 14px;
		line-height: 1.7;
		margin: 0 0 10px;
		color: #374151;
	}
	.tm-info-intro ul,
	.tm-info-intro ol {
		margin: 0;
		padding-left: 20px;
		font-size: 13.5px;
		line-height: 1.72;
		color: #374151;
	}
	.tm-info-intro li {
		margin-bottom: 6px;
	}
	.tm-info-intro img {
		max-width: 100%;
		border-radius: 10px;
	}

	/* —— 线路/路段态：原底部浮卡静态化为信息区面板 —— */
	.tm-stage-info .tm-route-sheet {
		position: absolute;
		inset: 0;
		flex-direction: column;
		max-height: none;
		margin: 0;
		padding: 12px 18px 14px;
		border-radius: 0;
		border: 0;
		border-top: 1px solid #eef1f5;
		box-shadow: none;
		transform: none;
		opacity: 1;
		overflow: hidden;
		background: #fff;
	}
	.tm-stage-info .tm-route-sheet .tm-route-sheet-grab {
		display: none;
	}
	.tm-stage-info .tm-route-sheet-head {
		padding: 2px 0 6px;
		align-items: center;
	}
	.tm-stage-info .tm-route-sheet-dot {
		margin-top: 0;
		width: 14px;
		height: 14px;
	}
	.tm-stage-info .tm-route-sheet-title {
		font-size: 18px;
	}
	.tm-stage-info .tm-route-sheet-summary {
		flex: 1 1 auto;
		min-height: 0;
		overflow-y: auto;
		overscroll-behavior: contain;
		-webkit-overflow-scrolling: touch;
		font-size: 13.5px;
		line-height: 1.62;
		margin: 0;
		padding: 2px 2px 10px 0;
		scrollbar-width: none;
	}
	.tm-stage-info .tm-route-sheet-summary::-webkit-scrollbar {
		display: none;
	}
	.tm-stage-info .tm-route-sheet-actions {
		margin-top: auto;
		padding-top: 10px;
		flex: none;
	}
	.tm-stage-info .tm-route-sheet-hint {
		font-size: 12px;
		margin-top: 8px;
		text-align: center;
		flex: none;
	}

	/* —— 景点态：popup 内容改在信息区紧凑展示（不滚动，摘要限 3 行） —— */
	.tm-info-attr {
		position: absolute;
		inset: 0;
		flex-direction: column;
		background: #fff;
	}
	.tm-attr-head {
		flex: none;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 8px 16px;
		border-bottom: 1px solid #f1f5f9;
	}
	.tm-attr-label {
		font-size: 12px;
		font-weight: 600;
		color: #94a3b8;
		letter-spacing: 0.5px;
	}
	.tm-attr-close {
		width: 30px;
		height: 30px;
		border-radius: 50%;
		border: 1px solid #e2e8f0;
		background: #fff;
		font-size: 14px;
		line-height: 1;
		color: #64748b;
		padding: 0;
	}
	.tm-attr-body {
		flex: 1 1 auto;
		min-height: 0;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		padding: 10px 16px 12px;
	}
	.tm-attr-body .attraction-popup {
		display: flex;
		flex-direction: column;
		gap: 7px;
		max-width: none;
		height: 100%;
	}
	.tm-attr-body .attraction-popup-thumb {
		width: 100%;
		height: 126px;
		object-fit: cover;
		border-radius: 10px;
		display: block;
		flex: none;
	}
	.tm-attr-body .popup-thumb-wrap {
		position: relative;
		flex: none;
	}
	.tm-attr-body .popup-thumb-badge {
		position: absolute;
		left: 8px;
		bottom: 8px;
	}
	.tm-attr-body .attraction-popup h3 {
		margin: 0;
		font-size: 17px;
		line-height: 1.35;
	}
	.tm-attr-body .attraction-popup .location {
		margin: 0;
		font-size: 12px;
		color: #64748b;
	}
	.tm-attr-body .attraction-popup .summary {
		margin: 0;
		font-size: 13px;
		line-height: 1.6;
		color: #374151;
		display: -webkit-box;
		-webkit-line-clamp: 3;
		-webkit-box-orient: vertical;
		overflow: hidden;
	}
	.tm-attr-body .popup-hot {
		margin: 0;
		font-size: 12px;
		color: #e11d48;
	}
	.tm-attr-body .popup-footer {
		margin-top: auto;
		flex-wrap: wrap;
		gap: 6px;
		padding-top: 2px;
	}
	.tm-attr-body .popup-actions {
		display: flex;
		flex-wrap: wrap;
		gap: 6px;
	}
	.tm-attr-body .checkin-btn,
	.tm-attr-body .view-posts,
	.tm-attr-body .guide-nav {
		padding: 7px 12px;
		font-size: 12.5px;
	}
	/* 打卡表单紧凑化 */
	.tm-attr-body .checkin-hint {
		margin: 0;
		font-size: 12px;
		line-height: 1.55;
		color: #64748b;
	}
	.tm-attr-body .checkin-photo {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 6px;
	}
	.tm-attr-body .checkin-photo-prev img {
		max-height: 96px;
		border-radius: 8px;
	}
	.tm-attr-body .checkin-photo-tip {
		width: 100%;
		font-size: 11px;
		line-height: 1.4;
	}
	.tm-attr-body .checkin-text {
		font-size: 13px;
		padding: 8px 10px;
		resize: none;
	}
	.tm-attr-body .checkin-date-label {
		font-size: 12.5px;
	}
	.tm-attr-body .checkin-actions {
		display: flex;
		gap: 8px;
	}
	.tm-attr-body .checkin-actions .checkin-btn {
		flex: 1;
	}

	/* —— 列表态：路段 / 景点（舞台不动，仅列表内部可滑） —— */
	.tm-info-list {
		position: absolute;
		inset: 0;
		flex-direction: column;
		background: #fff;
	}
	.tm-list-head {
		flex: none;
		display: flex;
		align-items: center;
		gap: 8px;
		padding: 8px 12px;
		border-bottom: 1px solid #f1f5f9;
	}
	.tm-list-back {
		flex: none;
		width: 32px;
		height: 32px;
		border: 0;
		border-radius: 50%;
		background: #f1f5f9;
		color: #475569;
		font-size: 22px;
		line-height: 1;
		padding: 0 0 3px;
	}
	.tm-list-titles {
		display: flex;
		flex-direction: column;
		min-width: 0;
	}
	.tm-list-title {
		font-size: 16px;
		line-height: 1.3;
		color: #111827;
	}
	.tm-list-sub {
		font-size: 11.5px;
		color: #94a3b8;
	}
	.tm-list-body {
		flex: 1 1 auto;
		min-height: 0;
		overflow-y: auto;
		scrollbar-width: none;
		padding: 6px 12px 10px;
		-webkit-overflow-scrolling: touch;
	}
	.tm-list-body::-webkit-scrollbar {
		display: none;
	}
	.tm-list-row {
		width: 100%;
		display: flex;
		align-items: center;
		gap: 11px;
		padding: 9px 10px;
		border: 0;
		border-bottom: 1px solid #f3f5f8;
		background: #fff;
		text-align: left;
	}
	.tm-list-row:active {
		background: #f8fafc;
	}
	.tm-list-idx {
		flex: none;
		width: 26px;
		height: 26px;
		border-radius: 50%;
		background: #eef2ff;
		color: #4f46e5;
		font-size: 12.5px;
		font-weight: 700;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.tm-list-thumb {
		flex: none;
		width: 44px;
		height: 44px;
		border-radius: 9px;
		overflow: hidden;
		background: #f1f5f9;
	}
	.tm-list-thumb img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		display: block;
	}
	.tm-list-thumb-ph {
		width: 100%;
		height: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		color: #e64980;
		background: #fdf2f8;
		font-size: 16px;
		font-weight: 600;
	}
	.tm-list-main {
		flex: 1;
		min-width: 0;
		display: flex;
		flex-direction: column;
		gap: 2px;
	}
	.tm-list-main strong {
		font-size: 14.5px;
		font-weight: 600;
		color: #1f2937;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	.tm-list-main em {
		font-style: normal;
		font-size: 12px;
		color: #94a3b8;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	.tm-list-arrow {
		flex: none;
		font-size: 20px;
		color: #cbd5e1;
		line-height: 1;
	}
	.tm-list-empty {
		margin: 24px 0 0;
		text-align: center;
		font-size: 13px;
		color: #94a3b8;
	}

	/* 景点圆点略放大，手指好点 */
	.travel-map-nav-wrap .travel-nav-poi {
		width: 22px;
		height: 22px;
	}

	/* ---------- 底部路线浮卡 ---------- */
	.tm-route-sheet {
		position: absolute;
		left: 10px;
		right: 10px;
		bottom: 10px;
		z-index: 600;
		padding: 10px 16px 16px;
		background: #fff;
		border-radius: 18px;
		box-shadow: 0 10px 32px rgba(0, 0, 0, 0.22);
		transform: translateY(calc(100% + 24px));
		opacity: 0;
		transition: transform 0.28s cubic-bezier(0.22, 0.9, 0.3, 1), opacity 0.2s ease;
		max-height: 48%;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
	}

	.tm-route-sheet.is-show {
		transform: translateY(0);
		opacity: 1;
	}

	/* 景点弹窗打开时浮卡暂时让位（弹窗贴底抽屉） */
	.travel-map-nav-wrap.tm-popup-open .tm-route-sheet {
		transform: translateY(calc(100% + 24px));
		opacity: 0;
		pointer-events: none;
	}

	.tm-route-sheet-grab {
		width: 38px;
		height: 4px;
		margin: 0 auto 8px;
		border-radius: 999px;
		background: #e2e4e8;
	}

	.tm-route-sheet-head {
		display: flex;
		align-items: flex-start;
		gap: 10px;
	}

	.tm-route-sheet-dot {
		flex: none;
		width: 12px;
		height: 12px;
		margin-top: 5px;
		border-radius: 50%;
		box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.12);
	}

	.tm-route-sheet-title {
		flex: 1;
		min-width: 0;
		margin: 0;
		font-size: 17px;
		font-weight: 700;
		color: #1a1a1a;
		line-height: 1.35;
	}

	.tm-route-sheet-seg {
		display: block;
		margin-top: 2px;
		font-size: 12px;
		font-weight: 400;
		color: #9aa0a6;
	}

	.tm-route-sheet-close {
		flex: none;
		width: 32px;
		height: 32px;
		padding: 0;
		font-size: 18px;
		line-height: 1;
		color: #8a8f98;
		background: #f3f4f6;
		border: 0;
		border-radius: 50%;
		cursor: pointer;
	}

	.tm-route-sheet-summary {
		margin: 8px 0 0;
		font-size: 13.5px;
		line-height: 1.6;
		color: #4b5563;
		display: -webkit-box;
		-webkit-line-clamp: 3;
		-webkit-box-orient: vertical;
		overflow: hidden;
	}

	.tm-route-sheet-meta {
		display: flex;
		flex-wrap: wrap;
		gap: 6px;
		margin-top: 10px;
	}

	.tm-route-sheet-chip {
		padding: 3px 10px;
		font-size: 12px;
		color: #6b7280;
		background: #f3f4f6;
		border-radius: 999px;
	}

	.tm-route-sheet-actions {
		display: flex;
		gap: 10px;
		margin-top: 12px;
	}

	.tm-route-sheet-cta {
		flex: 1;
		min-height: 44px;
		padding: 0 16px;
		font-size: 15px;
		font-weight: 600;
		color: #fff;
		background: #e64980;
		border: 0;
		border-radius: 999px;
		cursor: pointer;
	}

	.tm-route-sheet-cta:active {
		background: #c7366a;
	}

	.tm-route-sheet-hint {
		margin: 10px 0 0;
		font-size: 12px;
		line-height: 1.5;
		color: #9aa0a6;
		text-align: center;
	}

	/* 移动端弹窗：贴底抽屉样式（方案 11.4） */
	.leaflet-popup-content-wrapper {
		border-radius: 12px 12px 0 0;
		box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.2);
	}

	.leaflet-popup-content {
		margin: 12px;
	}

	.attraction-popup {
		min-width: 0;
		width: calc(100vw - 64px);
		max-width: 340px;
	}

	.attraction-popup .attraction-popup-thumb {
		height: 140px;
	}
}
