/* ===========================================================
   智途 · AI 出行规划地图  样式
   =========================================================== */
:root{
  --primary:#1f6feb;
  --primary-dark:#1554bb;
  --primary-soft:#e8f1ff;
  --accent:#0fbf8f;
  --accent-soft:#e3fbf3;
  --warm:#ff8a3d;
  --warm-soft:#fff1e6;
  --danger:#e5484d;
  --ink:#101828;
  --ink-2:#344054;
  --ink-3:#667085;
  --ink-4:#98a2b3;
  --line:#e4e7ec;
  --line-2:#f0f2f5;
  --bg:#f4f6fa;
  --card:#ffffff;
  --radius:12px;
  --radius-sm:8px;
  --shadow:0 1px 2px rgba(16,24,40,.06), 0 8px 24px -12px rgba(16,24,40,.18);
  --shadow-lg:0 12px 40px -12px rgba(16,24,40,.28);
  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", "PingFang SC",
          "Hiragino Sans GB", "Source Han Sans SC", Roboto, Helvetica, Arial, sans-serif;
}

*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  margin:0; font-family:var(--font); color:var(--ink); background:var(--bg);
  font-size:13px; line-height:1.5; -webkit-font-smoothing:antialiased; overflow:hidden;
}
button,input,select,textarea{ font-family:inherit; font-size:inherit; color:inherit; }
::-webkit-scrollbar{ width:9px; height:9px; }
::-webkit-scrollbar-thumb{ background:#cfd6e0; border-radius:9px; border:2px solid transparent; background-clip:content-box; }
::-webkit-scrollbar-thumb:hover{ background:#aab4c2; background-clip:content-box; }
::-webkit-scrollbar-track{ background:transparent; }

/* ---------------- 顶栏 ---------------- */
.topbar{
  height:58px; display:flex; align-items:center; gap:16px; padding:0 14px;
  background:var(--card); border-bottom:1px solid var(--line);
  position:relative; z-index:40;
}
.brand{ display:flex; align-items:center; gap:10px; min-width:210px; }
.brand-logo{
  width:34px; height:34px; border-radius:10px; flex:none;
  background:linear-gradient(135deg,var(--primary),var(--accent));
  color:#fff; font-weight:700; display:grid; place-items:center; font-size:16px;
  box-shadow:0 4px 12px -4px rgba(31,111,235,.7);
}
.brand-name{ font-weight:700; font-size:14px; letter-spacing:.2px; }
.brand-sub{ font-size:11px; color:var(--ink-4); }
.topbar-search{ display:flex; gap:8px; align-items:center; width:280px; }
.topbar-actions{ display:flex; gap:8px; align-items:center; margin-left:auto; }

/* ---------------- 通用控件 ---------------- */
.input{
  height:32px; padding:0 10px; border:1px solid var(--line); border-radius:var(--radius-sm);
  background:#fff; outline:none; transition:.15s; width:100%; min-width:0;
}
.input:focus{ border-color:var(--primary); box-shadow:0 0 0 3px rgba(31,111,235,.12); }
.textarea{ height:auto; padding:8px 10px; resize:vertical; line-height:1.55; }
select.input{ cursor:pointer; appearance:none;
  background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 4.5L6 8l3.5-3.5' fill='none' stroke='%23667085' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 8px center; padding-right:24px;
}
.btn{
  height:32px; padding:0 12px; border-radius:var(--radius-sm); border:1px solid transparent;
  cursor:pointer; background:#fff; white-space:nowrap; font-weight:500;
  display:inline-flex; align-items:center; justify-content:center; gap:5px; transition:.15s;
}
.btn:active{ transform:translateY(1px); }
.btn-primary{ background:var(--primary); color:#fff; box-shadow:0 1px 2px rgba(16,24,40,.08); }
.btn-primary:hover{ background:var(--primary-dark); }
.btn-outline{ border-color:var(--line); color:var(--ink-2); }
.btn-outline:hover{ border-color:var(--primary); color:var(--primary); background:var(--primary-soft); }
.btn-ghost{ color:var(--ink-3); }
.btn-ghost:hover{ background:var(--line-2); color:var(--ink); }
.btn-mini{ height:26px; padding:0 9px; font-size:12px; }
.btn-icon{ width:34px; padding:0; font-size:15px; color:var(--ink-2); border-color:var(--line); }
.btn-icon:hover{ background:var(--line-2); }
.btn.full{ width:100%; }
.grow{ flex:1; min-width:0; }
.row{ display:flex; gap:8px; align-items:center; }
.row + .row{ margin-top:8px; }
.mode-row{ flex-wrap:wrap; }
.mt8{ margin-top:8px; }
.grid2{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.grid2 > div{ display:flex; flex-direction:column; gap:4px; min-width:0; }

.label{ font-weight:600; font-size:12px; color:var(--ink-2); display:block; margin-bottom:8px; }
.mini-label{ font-size:11px; color:var(--ink-4); }
.hint{ font-size:11px; color:var(--ink-4); margin-top:6px; line-height:1.6; }
.hint code{ background:var(--line-2); padding:1px 4px; border-radius:4px; font-size:11px; }
.hint b{ color:var(--ink-3); }

.chip{ font-size:11px; padding:3px 8px; border-radius:999px; white-space:nowrap; }
.chip-muted{ background:var(--line-2); color:var(--ink-3); }
.chip-mini{ background:var(--primary-soft); color:var(--primary); }
.chip-ok{ background:var(--accent-soft); color:#0a8f6b; }
.chip-warn{ background:var(--warm-soft); color:#c2601a; }
.chip-err{ background:#fee4e2; color:#b42318; }

/* ---------------- 布局 ---------------- */
.layout{ display:flex; height:calc(100% - 58px); }
.panel{ background:var(--card); display:flex; flex-direction:column; min-height:0; }
.panel-left{ width:346px; border-right:1px solid var(--line); flex:none; }
.panel-right{ width:330px; border-left:1px solid var(--line); flex:none; }
.pane-body{ overflow-y:auto; overflow-x:hidden; padding:12px; flex:1; min-height:0; }

/* ---------------- Tabs ---------------- */
.tabs{ display:flex; padding:8px 8px 0; gap:4px; border-bottom:1px solid var(--line); flex:none; }
.tab{
  flex:1; padding:8px 4px; border:none; background:transparent; cursor:pointer;
  font-size:12px; font-weight:600; color:var(--ink-4); border-bottom:2px solid transparent;
  border-radius:6px 6px 0 0; transition:.15s; white-space:nowrap;
}
.tab:hover{ color:var(--ink-2); background:var(--line-2); }
.tab.active{ color:var(--primary); border-bottom-color:var(--primary); background:var(--primary-soft); }
.tab-pane{ display:none; flex:1; min-height:0; flex-direction:column; }
.tab-pane.active{ display:flex; }

.block{ margin-bottom:16px; }
.block:last-child{ margin-bottom:6px; }
.block-head{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
.block-head .label{ margin-bottom:0; }
.block-head{ margin-bottom:8px; }

/* ---------------- 结果 / 列表 ---------------- */
.result-list{ margin-top:10px; display:flex; flex-direction:column; gap:6px; }
.result-list:empty{ display:none; }
.result-item{
  border:1px solid var(--line); border-radius:var(--radius-sm); padding:8px 9px;
  cursor:pointer; transition:.15s; background:#fff;
}
.result-item:hover{ border-color:var(--primary); background:var(--primary-soft); }
.result-head{ display:flex; align-items:baseline; gap:6px; }
.result-name{ font-weight:600; font-size:12.5px; flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.result-meta{ font-size:11px; color:var(--ink-4); margin-top:3px; display:flex; gap:8px; flex-wrap:wrap; }
.result-desc{ font-size:11px; color:var(--ink-3); margin-top:4px; }
.price-tag{ color:var(--warm); font-weight:700; font-size:12px; }
.price-tag.free{ color:var(--accent); }
.rating{ color:#f59e0b; font-weight:600; }
.result-actions{ display:flex; gap:6px; margin-top:7px; }

.point-list{ display:flex; flex-direction:column; gap:6px; }
.point-item{
  display:flex; align-items:center; gap:8px; padding:7px 8px; border:1px solid var(--line);
  border-radius:var(--radius-sm); background:#fff; transition:.15s;
}
.point-item:hover{ border-color:#cbd5e1; box-shadow:var(--shadow); }
.point-item.active{ border-color:var(--primary); background:var(--primary-soft); }
.point-item.dragging{ opacity:.45; }
.drag-handle{ cursor:grab; color:var(--ink-4); font-size:13px; line-height:1; user-select:none; }
.point-index{ width:20px; height:20px; border-radius:6px; flex:none; display:grid; place-items:center;
  font-size:11px; font-weight:700; color:#fff; background:var(--primary); }
.point-main{ flex:1; min-width:0; }
.point-name{ font-weight:600; font-size:12.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.point-sub{ font-size:11px; color:var(--ink-4); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.point-tools{ display:flex; gap:2px; align-items:center; }
.icon-btn{
  width:24px; height:24px; border-radius:6px; border:none; background:transparent; cursor:pointer;
  color:var(--ink-4); display:grid; place-items:center; font-size:12px; transition:.15s;
}
.icon-btn:hover{ background:var(--line-2); color:var(--ink); }
.icon-btn.on{ color:var(--primary); background:var(--primary-soft); }
.check{ width:15px; height:15px; accent-color:var(--primary); cursor:pointer; flex:none; }

.tag-box{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:10px; }
.tag{
  font-size:11.5px; padding:4px 10px; border-radius:999px; border:1px solid var(--line);
  background:#fff; cursor:pointer; color:var(--ink-3); transition:.15s; user-select:none;
}
.tag:hover{ border-color:var(--primary); color:var(--primary); }
.tag.on{ background:var(--primary); border-color:var(--primary); color:#fff; font-weight:600; }
.tag.has-data{ position:relative; padding-right:16px; }
.tag.has-data::after{
  content:''; position:absolute; right:6px; top:50%; width:5px; height:5px; margin-top:-2.5px;
  border-radius:50%; background:var(--accent);
}
.tag.on.has-data::after{ background:#fff; }

.switch-row{
  display:flex; align-items:flex-start; gap:7px; font-size:11.5px; color:var(--ink-2);
  cursor:pointer; line-height:1.5; background:var(--line-2); padding:8px 10px; border-radius:var(--radius-sm);
}
.switch-row input{ margin-top:2px; flex:none; }
.switch-row span{ flex:1; }

.empty{ color:var(--ink-4); font-size:12px; text-align:center; padding:22px 10px; line-height:1.7; }

/* ---------------- 地图 ---------------- */
.map-wrap{ flex:1; position:relative; min-width:0; background:#e8edf3; }
/* isolation:isolate 建立独立层叠上下文，防止 Leaflet 内部的 z-index
   （瓦片 200 / 覆盖层 400 / 标记 600 / 控件 800）逃逸到页面根层叠上下文，
   否则它们会盖住地图上方的按钮、图例，甚至弹窗。 */
.map{ position:absolute; inset:0; z-index:0; isolation:isolate; }
.map *{ font-family:var(--font); }
.map-overlay{ position:absolute; z-index:20; pointer-events:none; }
.map-overlay > *{ pointer-events:auto; }
.map-overlay-tl{ top:12px; left:12px; }
.map-overlay-tr{ top:12px; right:12px; display:flex; flex-direction:column; gap:6px; }
.map-overlay-bl{ bottom:12px; left:12px; }
.map-overlay-br{ bottom:12px; right:12px; }
.overlay-card{
  background:rgba(255,255,255,.96); backdrop-filter:blur(8px); border-radius:var(--radius);
  box-shadow:var(--shadow-lg); padding:9px 13px; border:1px solid rgba(255,255,255,.7); max-width:330px;
}
.overlay-mode{ font-size:11px; color:var(--ink-4); font-weight:600; }
.overlay-route{ font-size:13px; font-weight:600; margin-top:2px; color:var(--ink); }
.map-btn{
  width:34px; height:34px; border-radius:9px; border:1px solid var(--line); background:rgba(255,255,255,.97);
  cursor:pointer; font-size:15px; color:var(--ink-2); box-shadow:var(--shadow); transition:.15s;
}
.map-btn:hover{ color:var(--primary); border-color:var(--primary); }
.legend{
  background:rgba(255,255,255,.96); border-radius:10px; padding:7px 10px; box-shadow:var(--shadow);
  display:flex; gap:12px; font-size:11px; color:var(--ink-3); flex-wrap:wrap; max-width:420px;
}
.legend i{ width:9px; height:9px; border-radius:50%; display:inline-block; margin-right:4px; }
.statbar{
  background:rgba(255,255,255,.96); border-radius:10px; padding:7px 4px; box-shadow:var(--shadow);
  display:flex; align-items:center;
}
.stat{ display:flex; flex-direction:column; align-items:center; padding:0 14px; min-width:74px; }
.stat + .stat{ border-left:1px solid var(--line); }
.stat b{ font-size:15px; font-weight:700; color:var(--ink); }
.stat i{ font-style:normal; font-size:10.5px; color:var(--ink-4); margin-top:1px; }

.map-loading{
  position:absolute; inset:0; z-index:50; display:flex; flex-direction:column; gap:12px;
  align-items:center; justify-content:center; background:#eef2f7; color:var(--ink-3); font-size:12.5px;
  transition:opacity .3s;
}
.map-loading.hide{ opacity:0; pointer-events:none; }

/* 地图状态横幅 */
.map-banner{
  position:absolute; top:12px; left:50%; transform:translateX(-50%); z-index:120;
  background:rgba(255,244,232,.98); border:1px solid #ffd9bd; color:#8a4b13;
  padding:7px 10px 7px 12px; border-radius:10px; box-shadow:var(--shadow-lg);
  display:flex; align-items:center; gap:10px; font-size:12px; max-width:94%;
}
.map-banner span{ flex:1; line-height:1.5; }
.map-banner .btn{ flex:none; }
.spinner{
  width:26px; height:26px; border-radius:50%; border:3px solid #d7dee8; border-top-color:var(--primary);
  animation:spin .8s linear infinite;
}
@keyframes spin{ to{ transform:rotate(360deg); } }

/* 地图标记（自定义 HTML） */
.mk{ position:relative; display:flex; flex-direction:column; align-items:center; cursor:pointer; transform:translateY(-4px); }
.mk-pin{
  width:26px; height:26px; border-radius:50% 50% 50% 3px; transform:rotate(-45deg);
  display:grid; place-items:center; color:#fff; font-size:11px; font-weight:700;
  box-shadow:0 3px 8px rgba(16,24,40,.35); border:2px solid #fff;
}
.mk-pin span{ transform:rotate(45deg); }
.mk-label{
  margin-bottom:3px; font-size:11px; font-weight:600; background:rgba(255,255,255,.94); color:var(--ink);
  padding:1px 6px; border-radius:6px; white-space:nowrap; box-shadow:0 1px 4px rgba(16,24,40,.2);
  max-width:130px; overflow:hidden; text-overflow:ellipsis;
}
.mk.sel .mk-label{ background:var(--primary); color:#fff; }
.mk.sel .mk-pin{ outline:3px solid rgba(31,111,235,.28); }

/* 预览点（点击搜索结果时在地图上高亮显示） */
.mk.preview .mk-pin{ background:#8b5cf6; animation:pulse 1.4s ease-out infinite; }
.mk.preview .mk-label{ background:#8b5cf6; color:#fff; }
@keyframes pulse{
  0%{ box-shadow:0 0 0 0 rgba(139,92,246,.55); }
  70%{ box-shadow:0 0 0 12px rgba(139,92,246,0); }
  100%{ box-shadow:0 0 0 0 rgba(139,92,246,0); }
}

/* 地点详情卡 */
.poi-detail{
  margin-top:10px; border:1px solid var(--primary); border-radius:var(--radius);
  background:linear-gradient(180deg,#f7faff,#fff); padding:11px 12px;
  box-shadow:0 4px 14px -8px rgba(31,111,235,.5);
}
.pd-head{ display:flex; align-items:center; gap:6px; margin-bottom:8px; }
.pd-name{ font-weight:700; font-size:13.5px; flex:1; min-width:0; }
.pd-desc{ font-size:11.5px; color:var(--ink-3); line-height:1.6; margin-bottom:8px; }
.pd-rows{ border-top:1px dashed var(--line); padding-top:7px; }
.pd-row{ display:flex; gap:8px; font-size:11.5px; padding:2.5px 0; }
.pd-row > span{ color:var(--ink-4); width:62px; flex:none; }
.pd-row > b{ font-weight:500; color:var(--ink-2); flex:1; min-width:0; word-break:break-all; line-height:1.55; }
.pd-row .dim{ color:var(--ink-4); font-weight:400; }
.pd-row .loading-text{ color:var(--ink-4); font-weight:400; }
.poi-detail .result-actions{ margin-top:9px; }

/* 固定安排（车票 / 机票）列表 */
.event-list{ display:flex; flex-direction:column; gap:6px; }
.event-list:empty{ display:none; }
.event-item{
  display:flex; align-items:center; gap:8px; padding:7px 9px; border-radius:var(--radius-sm);
  background:linear-gradient(90deg,#fff7ed,#fff); border:1px solid #ffe0c2;
}
.event-ico{ font-size:15px; flex:none; }
.event-main{ flex:1; min-width:0; }
.event-name{ font-weight:600; font-size:12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.event-sub{ font-size:11px; color:var(--ink-4); margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.event-time{
  font-weight:800; font-size:12.5px; color:#c2601a; flex:none; text-align:right; line-height:1.25;
}
.event-time small{ display:block; font-size:10px; font-weight:500; color:var(--ink-4); }
.ticket-grid{ display:flex; align-items:flex-end; gap:8px; margin-top:10px; }
.ticket-col{ flex:1; min-width:0; display:flex; flex-direction:column; }
.ticket-arrow{ flex:none; color:var(--primary); font-weight:700; padding-bottom:22px; font-size:14px; }

/* 行程总览 */
.plan-overview{ font-size:12px; }
.ov-grid{ display:grid; grid-template-columns:1fr 1fr; gap:6px; margin-bottom:9px; }
.ov-cell{ background:var(--line-2); border-radius:8px; padding:7px 9px; }
.ov-cell b{ display:block; font-size:15px; font-weight:800; color:var(--ink); }
.ov-cell i{ font-style:normal; font-size:10.5px; color:var(--ink-4); }
.ov-days{ display:flex; flex-direction:column; gap:5px; margin-bottom:9px; }
.ov-day{ display:flex; align-items:center; gap:7px; font-size:11.5px; color:var(--ink-2); }
.ov-day .d{ font-weight:700; flex:none; width:52px; }
.ov-bar{ flex:1; height:7px; border-radius:4px; background:var(--line-2); overflow:hidden; }
.ov-bar > span{ display:block; height:100%; background:linear-gradient(90deg,var(--primary),var(--accent)); }
.ov-day .t{ flex:none; font-size:10.5px; color:var(--ink-4); }
.warn-item{
  display:flex; gap:7px; padding:7px 9px; border-radius:8px; font-size:11.5px; line-height:1.55; margin-bottom:5px;
}
.warn-item.err{ background:#fee4e2; color:#912018; }
.warn-item.warn{ background:var(--warm-soft); color:#8a4b13; }
.warn-item.ok{ background:var(--accent-soft); color:#0a8f6b; }
.warn-item b{ flex:none; }
.ov-skipped{ margin-top:9px; border-top:1px dashed var(--line); padding-top:8px; }
.ov-skipped .t{ font-size:11.5px; font-weight:700; color:var(--ink-2); margin-bottom:5px; }
.ov-advice{ margin-top:9px; border-top:1px dashed var(--line); padding-top:8px; }
.ov-advice .t{ font-size:11.5px; font-weight:700; color:var(--ink-2); margin-bottom:5px; }
.ov-advice .btn{ margin-left:4px; }
.warn-item span{ flex:1; }

/* 攻略 AI 分析 */
.guide-result{ margin-top:10px; }
.gd-summary{ background:var(--primary-soft); border-radius:var(--radius-sm); padding:9px 11px; font-size:12px; line-height:1.7; color:var(--ink-2); }
.gd-sec{ margin-top:10px; }
.gd-sec .t{ font-size:11.5px; font-weight:700; color:var(--ink-2); margin-bottom:5px; }
.gd-item{ border-left:2px solid var(--primary); padding:3px 0 3px 9px; margin-bottom:7px; font-size:12px; }
.gd-item b{ font-weight:600; }
.gd-item .chip{ margin-left:6px; }
.gd-item .why{ color:var(--ink-3); font-size:11.5px; margin-top:2px; line-height:1.6; }
.gd-line{ font-size:11.5px; color:var(--ink-2); line-height:1.7; }
.gd-poi{ border:1px solid var(--line); border-radius:var(--radius-sm); padding:8px 9px; margin-bottom:6px; }
.gd-poi .nm{ font-weight:600; font-size:12.5px; }
.gd-poi .why{ font-size:11.5px; color:var(--ink-3); margin:3px 0 6px; line-height:1.6; }

/* 离线 SVG 示意地图 */
.fallback-map{ position:absolute; inset:0; width:100%; height:100%; background:#eaeff5; cursor:crosshair; }
.fallback-note{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); text-align:center;
  color:#94a3b8; font-size:12.5px; pointer-events:none;
}

/* ---------------- 右侧 ---------------- */
.pane-head{
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  padding:12px 14px 10px; border-bottom:1px solid var(--line); flex:none;
}
.pane-head.inner{ padding:16px 0 10px; margin-top:12px; border-bottom:1px solid var(--line); }
.pane-title{ font-weight:700; font-size:13px; }

.route-summary{ background:var(--primary-soft); border-radius:var(--radius-sm); padding:11px 12px; }
.route-summary.empty{ background:var(--line-2); color:var(--ink-4); font-size:12px; text-align:center; }
.route-summary h4{ margin:0 0 7px; font-size:13px; }
.rs-row{ display:flex; justify-content:space-between; font-size:12px; color:var(--ink-2); padding:3px 0; }
.rs-row b{ color:var(--ink); }
.rs-big{ font-size:19px; font-weight:800; color:var(--primary); }
.rs-modes{ display:flex; gap:6px; margin-top:9px; flex-wrap:wrap; }
.rs-mode{
  flex:1; min-width:64px; background:#fff; border-radius:7px; padding:6px 4px; text-align:center;
  cursor:pointer; border:1px solid transparent; transition:.15s;
}
.rs-mode:hover{ border-color:var(--primary); }
.rs-mode.on{ border-color:var(--primary); background:#fff; box-shadow:0 0 0 2px rgba(31,111,235,.14); }
.rs-mode .m{ font-size:10.5px; color:var(--ink-4); }
.rs-mode .t{ font-weight:700; font-size:12.5px; margin-top:1px; }
.rs-mode .c{ font-size:10px; color:var(--warm); font-weight:600; }
.rs-mode.loading .t{ color:var(--ink-4); }

.route-steps{ margin-top:10px; display:flex; flex-direction:column; gap:0; }
.step{
  display:flex; gap:9px; font-size:12px; padding-bottom:11px; position:relative;
}
.step:not(:last-child)::before{
  content:""; position:absolute; left:9px; top:20px; bottom:-2px; width:2px; background:var(--line);
}
.step-ico{
  width:19px; height:19px; border-radius:50%; flex:none; background:var(--primary-soft); color:var(--primary);
  display:grid; place-items:center; font-size:10px; font-weight:700; z-index:1;
}
.step-body{ flex:1; min-width:0; }
.step-txt{ color:var(--ink-2); line-height:1.55; }
.step-sub{ font-size:11px; color:var(--ink-4); margin-top:2px; }

.timeline{ display:flex; flex-direction:column; }
.tl-day{
  font-size:12px; font-weight:700; color:var(--ink-2); margin:14px 0 8px;
  padding-bottom:6px; border-bottom:1px dashed var(--line); display:flex; justify-content:space-between;
}
.tl-day:first-child{ margin-top:4px; }
.tl-day span{ font-weight:500; color:var(--ink-4); font-size:11px; }
.tl-item{ display:flex; gap:9px; padding-bottom:12px; position:relative; }
.tl-item:not(:last-child)::before{
  content:""; position:absolute; left:29px; top:22px; bottom:0; width:2px; background:var(--line-2);
}
.tl-time{
  width:38px; flex:none; text-align:right; font-size:11px; font-weight:700; color:var(--primary); padding-top:3px;
}
.tl-dot{ width:9px; height:9px; border-radius:50%; margin-top:6px; flex:none; box-shadow:0 0 0 3px #fff; }
.tl-body{ flex:1; min-width:0; }
.tl-name{ font-weight:600; font-size:12.5px; display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.tl-del{ margin-left:auto; width:20px; height:20px; font-size:11px; opacity:.5; }
.tl-item:hover .tl-del{ opacity:1; }
.tl-del:hover{ background:#fee4e2; color:var(--danger); }
.tl-meta{ font-size:11px; color:var(--ink-4); margin-top:3px; line-height:1.6; }
.tl-reason{ font-size:11px; color:var(--ink-3); margin-top:4px; background:var(--line-2); padding:5px 8px; border-radius:6px; line-height:1.6; }
.tl-item.transit{ opacity:.82; }
.tl-item.transit .tl-name{ font-weight:500; color:var(--ink-3); font-size:12px; }

/* ---------------- 住宿 ---------------- */
.price-range{ margin-bottom:10px; }
.range-track{ position:relative; height:34px; }
.range-track input[type=range]{
  position:absolute; left:0; right:0; top:0; width:100%; height:34px; margin:0; background:transparent;
  pointer-events:none; appearance:none; -webkit-appearance:none;
}
.range-track input[type=range]::-webkit-slider-thumb{
  pointer-events:auto; appearance:none; -webkit-appearance:none; width:17px; height:17px; border-radius:50%;
  background:#fff; border:2px solid var(--primary); cursor:pointer; box-shadow:0 1px 4px rgba(16,24,40,.3); margin-top:-7px;
}
.range-track input[type=range]::-webkit-slider-runnable-track{ height:3px; background:transparent; }
.range-fill{ position:absolute; height:3px; background:var(--primary); top:9px; border-radius:3px; }
.range-track::after{
  content:""; position:absolute; left:0; right:0; top:9px; height:3px; background:var(--line); border-radius:3px; z-index:-1;
}
.price-labels{ display:flex; justify-content:space-between; font-size:11.5px; color:var(--ink-3); }
.price-labels b{ color:var(--primary); font-size:13px; }
.price-labels span{ white-space:nowrap; min-width:0; }
.price-now{ margin-top:6px; font-size:11.5px; color:var(--ink-2); background:var(--primary-soft);
  border-radius:6px; padding:4px 8px; text-align:center; }
.hotel-warn{ font-size:12px; line-height:1.6; color:#b54708; background:var(--warm-soft);
  border-left:3px solid #f59e0b; border-radius:6px; padding:7px 9px; margin-bottom:8px; }
.hotel-item.out-range{ border-style:dashed; }

/* ---------------- 打车比价 ---------------- */
.me-card{ margin-top:8px; max-width:280px }
.me-head{ display:flex; align-items:center; gap:6px; font-size:12.5px }
.me-head .mini-label{ margin-left:auto }
.me-head .icon-btn{ width:22px; height:22px; font-size:12px }
.me-coord{ font-family:ui-monospace,Consolas,monospace; font-size:12.5px; margin:4px 0 2px; letter-spacing:.3px }
.me-time{ font-size:11px; color:var(--ink-4); margin-bottom:6px }
.me-dot{ width:18px; height:18px; border-radius:50%; background:#1f6feb; border:3px solid #fff;
  box-shadow:0 0 0 2px rgba(31,111,235,.45), 0 2px 6px rgba(16,24,40,.35); }
.me-dot span{ display:block; width:6px; height:6px; margin:3px auto; border-radius:50%; background:#fff }
.tp-alts{ margin-top:9px; border-top:1px dashed var(--line-2); padding-top:8px }
.tp-alt-head{ font-size:12px; font-weight:700; margin-bottom:6px; display:flex; gap:6px; align-items:baseline }
.tp-alt{ border:1px solid var(--line); border-radius:9px; padding:6px 8px; margin-bottom:5px; cursor:pointer }
.tp-alt:hover{ border-color:var(--primary); background:var(--primary-soft) }
.tp-alt.on{ border-color:var(--primary); background:var(--primary-soft); box-shadow:0 0 0 1px var(--primary) inset }
.tp-alt b{ font-size:12px }
.tp-alt .chip{ font-size:10px; padding:1px 6px; margin-left:4px }
.tp-taxi{ margin-top:10px; border:1px solid var(--line); border-radius:10px; padding:9px 10px; background:#fff }
.tp-taxi-head{ font-size:12.5px; font-weight:700; margin-bottom:6px; display:flex; gap:6px; align-items:baseline; flex-wrap:wrap }
.tp-taxi-row{ display:flex; align-items:center; gap:8px; padding:6px 0; border-top:1px dashed var(--line-2) }
.tp-taxi-row .grow{ flex:1; min-width:0 }
.tp-taxi-row b{ font-size:12.5px }
.tp-taxi-row .chip{ font-size:10px; padding:1px 6px }
.tp-taxi-price{ font-weight:700; color:#e11d48; font-size:13px; white-space:nowrap }
.tp-taxi .hint{ margin-top:6px }

.hotel-list{ display:flex; flex-direction:column; gap:8px; }
.hotel-item{ border:1px solid var(--line); border-radius:var(--radius-sm); padding:9px 10px; transition:.15s; }
.hotel-item:hover{ border-color:var(--primary); box-shadow:var(--shadow); }
.hotel-head{ display:flex; align-items:baseline; gap:6px; }
.hotel-name{ font-weight:600; font-size:12.5px; flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.hotel-price{ color:var(--danger); font-weight:800; font-size:13.5px; }
.hotel-price i{ font-style:normal; font-size:10px; color:var(--ink-4); font-weight:400; }
.hotel-meta{ font-size:11px; color:var(--ink-4); margin-top:4px; display:flex; gap:8px; flex-wrap:wrap; }
.hotel-reason{ font-size:11px; color:var(--ink-3); margin-top:5px; line-height:1.6; }
.bars{ display:flex; gap:2px; margin-top:5px; }
.bar{ font-size:10px; padding:2px 6px; border-radius:5px; background:var(--line-2); color:var(--ink-3); }
.bar.hi{ background:var(--accent-soft); color:#0a8f6b; }

/* ---------------- 弹窗 / Toast ---------------- */
.modal-mask{
  position:fixed; inset:0; background:rgba(16,24,40,.42); z-index:2000; display:none;
  align-items:center; justify-content:center; backdrop-filter:blur(2px);
}
.modal-mask.show{ display:flex; }
.modal{
  background:#fff; border-radius:14px; width:min(430px,92vw); padding:18px; box-shadow:var(--shadow-lg);
  animation:pop .18s ease-out;
  /* 关键：长内容（如使用说明）必须能滚动，否则标题栏和按钮会被顶出屏幕 → 关不掉 */
  max-height:min(86vh,760px); display:flex; flex-direction:column;
}
@keyframes pop{ from{ transform:scale(.95); opacity:0; } to{ transform:scale(1); opacity:1; } }
.modal-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:12px; flex:none; }
.modal-title{ font-weight:700; font-size:14px; }
.modal-body{ font-size:12.5px; color:var(--ink-2); line-height:1.75;
  flex:1 1 auto; min-height:0; overflow-y:auto; -webkit-overflow-scrolling:touch; overscroll-behavior:contain; }
.modal-body .input{ margin-top:8px; }
.modal-actions{ display:flex; gap:8px; justify-content:flex-end; margin-top:16px; flex:none; }
.modal-help h5{ margin:12px 0 4px; font-size:12.5px; color:var(--ink); }
.modal-help ul{ margin:0; padding-left:18px; }
.modal-help li{ margin:3px 0; }

.toast-wrap{ position:fixed; top:70px; left:50%; transform:translateX(-50%); z-index:3000;
  display:flex; flex-direction:column; gap:8px; align-items:center; pointer-events:none; }
.toast{
  background:rgba(16,24,40,.92); color:#fff; padding:8px 16px; border-radius:999px; font-size:12.5px;
  box-shadow:var(--shadow-lg); animation:slideIn .22s ease-out; max-width:70vw;
}
.toast.ok{ background:rgba(10,143,107,.95); }
.toast.err{ background:rgba(180,35,24,.95); }
.toast.warn{ background:rgba(194,96,26,.95); }
@keyframes slideIn{ from{ transform:translateY(-8px); opacity:0; } to{ transform:translateY(0); opacity:1; } }

/* Amap 信息窗体适配 */
.amap-info-content{ border-radius:10px !important; padding:10px 12px !important; font-size:12px !important; }

/* ---------------- 响应式 ---------------- */
@media (max-width:1250px){
  .panel-left{ width:310px; }
  .panel-right{ width:290px; }
  .topbar-search{ width:210px; }
  .brand-sub{ display:none; }
}
/* 中等屏幕（笔记本窗口不全屏时）：只收窄三栏，不堆叠，
   避免「地图被挤到页面最下面」的问题；堆叠只留给手机（<=820px） */
@media (max-width:1180px){
  .panel-left{ width:300px; }
  .panel-right{ width:290px; }
  .topbar-search{ width:230px; }
  #btnAiPlan{ font-size:12px; }
}

/* ---------------- 天气条 ---------------- */
.weather-strip{ display:flex; flex-wrap:wrap; gap:8px; padding-bottom:6px; margin-bottom:10px; }
.weather-strip:empty{ display:none; margin:0; }
.wstrip-note{ flex:1 0 100%; font-size:11px; color:var(--ink-3); line-height:1.6; }
.wstrip-note.warn{ color:#b54708; background:var(--warm-soft); border-radius:8px; padding:6px 8px; }
.wcard{
  flex:none; min-width:92px; background:var(--card); border:1px solid var(--line);
  border-radius:10px; padding:8px 10px; text-align:center; line-height:1.35;
}
.wcard .wicon{ font-size:17px; }
.wcard b{ display:block; font-size:11px; color:var(--ink-3); font-weight:600; }
.wcard .wtemp{ font-size:12px; color:var(--ink-2); }
.wcard.rain{ border-color:#bcd7ff; background:#f2f7ff; }
.wcard.warn{ border-color:#ffd0a8; background:var(--warm-soft); }

/* ---------------- 手机端底部导航 ---------------- */
.mobile-nav{ display:none; }

@media (max-width:820px){
  body{ overflow:auto; height:auto; }
  /* 顶栏：手机上两行内放下，不再把「设置」挤到第三行 */
  .topbar{ height:auto; flex-wrap:wrap; padding:6px 8px; gap:6px; position:sticky; top:0; z-index:60; }
  .brand{ display:none; }
  .topbar-actions{ width:100%; margin:0; order:2; flex-wrap:nowrap; gap:6px; justify-content:space-between; align-items:center; }
  .topbar-actions .btn{ height:30px; padding:0 8px; font-size:12px; }
  #btnAiPlan{ flex:1 1 auto; min-width:0; overflow:hidden; }
  #btnOpenSettings{ width:30px; }
  #tpCloudChip{ font-size:10px; padding:3px 6px; max-width:84px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  #tpUndoBox{ gap:2px; }
  #tpUndoBox .btn-icon{ width:30px; height:30px; font-size:14px; }
  #engineChip, #llmChip{ display:none; }
  .topbar-search{ width:100%; order:3; gap:6px; }
  .topbar-search .btn{ padding:0 10px; }
  .layout{ display:block; height:auto; padding-bottom:74px; }
  .map-wrap{ height:calc(100vh - 166px); min-height:280px; }
  /* 地图浮层：手机上收起图例、缩小提示卡、统计条上移避开底部导航 */
  .map-overlay-bl{ display:none; }
  .map-overlay-br{ bottom:74px; right:8px; }
  .map-overlay-br .statbar{ font-size:10px; padding:4px 7px; gap:8px; }
  .map-overlay-br .statbar .stat b{ font-size:13px; }
  .map-overlay-br .statbar .stat i{ font-size:9px; }
  /* 左侧提示卡给右侧那排小按钮留出位置，否则会被压在下面 */
  .map-overlay-tl{ top:8px; left:8px; right:52px; }
  .me-card{ max-width:none; }
  .me-card .me-time{ font-size:10px; }
  .map-overlay-tl .overlay-card{ max-width:none; font-size:11px; line-height:1.5; padding:6px 9px; }
  .map-overlay-tr{ top:8px; right:8px; gap:4px; flex-direction:column; }
  .map-overlay-tr .map-btn{ width:30px; height:30px; font-size:13px; }
  .map-banner{ font-size:11px; padding:6px 8px; }
  .panel-left, .panel-right{ width:100%; height:auto; max-height:none; flex:none; border:none; }
  .panel-left{ border-bottom:1px solid var(--line); }
  .pane-body{ max-height:none; overflow:visible; }
  body[data-mview="map"] .panel-left, body[data-mview="map"] .panel-right{ display:none; }
  body[data-mview="places"] .map-wrap, body[data-mview="hotels"] .map-wrap,
  body[data-mview="itinerary"] .map-wrap, body[data-mview="route"] .map-wrap{ display:none; }
  body[data-mview="places"] .panel-right, body[data-mview="hotels"] .panel-right{ display:none; }
  body[data-mview="route"] .panel-left{ display:none; }
  .mobile-nav{
    display:flex; position:fixed; left:0; right:0; bottom:0; z-index:80;
    background:rgba(255,255,255,.97); border-top:1px solid var(--line);
    padding:4px 4px calc(4px + env(safe-area-inset-bottom));
  }
  .mobile-nav button{
    flex:1; border:none; background:transparent; display:flex; flex-direction:column; align-items:center;
    gap:2px; padding:6px 2px; font-size:11px; color:var(--ink-4); cursor:pointer; border-radius:8px;
  }
  .mobile-nav button i{ font-size:17px; font-style:normal; line-height:1; }
  .mobile-nav button.active{ color:var(--primary); background:var(--primary-soft); }
  /* 面板在小屏上也别撑破 */
  .tp-plan-grid{ grid-template-columns:auto 1fr; }
  .tp-taxi-row{ flex-wrap:wrap; }
  .tp-alt{ padding:7px 8px; }
}